簡單易用、穩定的前端單元測試工具:totoro
簡單易用、穩定的前端單元測試工具。
0. 特性
- 在真實的瀏覽器中運行
- 支持所有的測試框架
- 支持調試
- 自動測試覆蓋率
- 足夠健壯,可用于實戰
1. 安裝
node 版本要求
>= 0.10.12
從 npm 安裝
$ npm install totoro -g
從 Github 安裝
可以體驗開發中的最新功能
$ git clone git@github.com:totorojs/totoro.git
$ cd totoro
$ sudo npm install -g
2. 快速上手
簡單起見,我們已經為你準備好了一個可供測試的例子:
注意:測試前請先指定測試服務
$ totoro config --server-host={{yourServerHost}}
默認為阿里巴巴集團的內部測試服務,你也可以 啟動自己的測試服務。
$ git clone git@github.com:totorojs/totoro.git
$ cd totoro/examples/simple
$ totoro
如無意外,你將看到如下結果:
- 小圓點為即時進度反饋。成功顯示為綠色圓點,失敗顯示為紅色小叉。
- 單個瀏覽器測試結果中包含運行時間和測試覆蓋率。
- 測試成功的瀏覽器會以綠色字符輸出顯示,失敗或超時的瀏覽器會以紅色字符顯示,并輸出錯誤詳情。
推薦的項目目錄結構
project-dir/
dist/
src/ or lib/
tests/ or test/
runner.html or index.html
其中:
- 你需要在 project-dir/ 目錄運行
totoro
命令 - dist/ 為編譯或打包后的輸出目錄
- src/ 或 lib/ 為源碼目錄
- tests/ 或 test/ 為測試目錄,其中的 runner.html 或 index.html 都能被識別為 runner
3. 命令行配置項
3.1 totoro
--runner
測試 runner。接受本地文件和 URL。
默認:自動查找當前目錄,tests
或 test
子目錄下的 runner.html
或 index.html
均可被識別。
--code
方便的 debug 途徑。接受 單個 表達式、 JS 文件和 URL。totoro 將返回指定表達式計算的值或 JS 文件中所有 console.log() 輸出結果。例如:
$ totoro --code document.getElementsByClassName
$ totoro --code examples/code/code.js // 我們真的準備了這個例子,試試看!
注意: --code
和 --runner
是互斥的選項!
--adapter
測試框架的適配器,用于發送測試報告。接受內置關鍵字、本地路徑和 URL。
已支持的內置關鍵字有:mocha
, jasmine
。
自定義適配器寫法可參考 static/adapters/mocha.js。
默認:如果 --runner
指定的是本地路徑,則會先查看 runner 所在的位置是否有 totoro-adapter.js
;如果沒找到或者 --runner
指定的是 url 則 totoro-server
會自動掃描 --runner
的內容嘗試查找匹配的內置關鍵字。
--browsers
指定要測試的瀏覽器,多個以逗號分隔。例如:
chrome,firefox,safari,ie //不指定版本
ie/6,ie/7,ie/8,ie/9 //指定版本
默認:自動選取測試服務端可用的桌面瀏覽器。
--timeout
客戶端超時時間,單位為分鐘。
默認:5
--server-host
測試服務 host。
默認:阿里的內部host
--server-port
測試服務 port。
默認:9999
--client-root
如果 --runner
是一個本地文件,totoro
在測試時會起一個臨時的 HTTP 服務,該選項這個服務的根目錄,接受相對路徑和絕對路徑。
默認:根據 --runner
和 --adapter
進行猜測。
--skip-coverage
跳過代碼覆蓋率檢查.
默認:false
--verbose
顯示更詳細的信息:
- debug 日志
- 如果啟用測試代碼覆蓋率, 將會顯示沒有覆蓋到行的詳細信息.
默認:false
3.2 totoro list
顯示當前可用的測試瀏覽器。配置項可通過 totoro list -h
查看。
3.3 tororo config
讀取或者設置全局配置。配置項可通過 totoro config -h
查看。
讀取全局配置
$ totoro config
設置全局配置
totoro config --server-host=10.15.52.87 --server-port=''
將 server-host 設置為 10.15.52.87,將 server-port 置空。
4. 配置文件
除了命令行配置項和全局配置,你還可以為你的項目建立名為 totoro-config.json
的配置文件,放在項目根目錄下。
這 3 種配置方式的優先級為:命令行 > 配置文件 > 全局配置 > 內置默認配置。
以下為一個配置文件的例子:
{
"browsers": ["chrome", "ie/10.0"],
"serverHost": "127.0.0.1",
"serverPort": 9999
}
5. 關于
totoro 的名字來自于宮崎駿導演的奇幻動畫電影《龍貓》。