Edited at

mocha+testling-ciでブラウザテストを自動化する

結果的にはこの様なバッジが出来ます、githubにpushする度更新されるので便利。

ブラウザとの相性


環境を整える

コマンドラインからもcoffeeやmochaは実行したいのでこの二つはグローバルに入れる。詳細は前の投稿で。

$ git init

$ npm init

$ npm install coffee-scirpt -g
$ npm install mocha -g
$ npm install chai --save-dev


package.jsonにtestling設定を追加。

欲張りすると無駄に重なるので注意。


package.json

{

"testling": {
"browsers": {
"ie": [ 6, 7, 8, 9, 10 ],
"ff": [ 12, 13, 14, 15, 16, 17 ],
"chrome": [ 20, 21, 22, 23 ],
"opera": [ 10, 11, 12 ],
"safari": [ 5.1 ]
},
"harness" : "mocha",
"files": "test/*.coffee"
},
"devDependencies": {
"chai": "*",
"mocha": "*",
"coffee-script": "*"
}
}



githubのプロジェクトページでwebhookを設定

プロジェクトページ > settingボタンをクリック > サイドバーからservice hooks > WebHook URLに


http://git.testling.com


と入力。

詳細はgithubの公式ドキュメント参照。


完成

これでgithubにpushする度以下のURLで結果が見れます、テスト待ちに少々時間がかかります。


http://ci.testling.com/ユーザー名/プロジェクト名


README.mdにはこう書きますとテスト結果が画像で表示されます。


README.md

[![browser support](http://ci.testling.com/USER/PROJECT.png)](http://ci.testling.com/USER/PROJECT)


詳細は公式ドキュメントを参照。

作者はbrowserifyなどを作ったbrowserling