JavaScriptの単体テスト環境構築のまとめ。
テストランナーとして「Karma」、テストフレームワーク・アサーションライブラリとして「Jasmine」を使う。
#前提条件
下記が使用できること。
- node
- npm
検証環境
- MacOS X 10.9.2
#package.json生成
$ npm init
- 対話形式でprojectの初期設定をする。
- 不要な項目は、空欄のままEnter
- 最終的に、package.jsonファイルが生成される(直接編集も可)
#karmaインストール
$ npm install --save-dev karma
- node_modules/が生成され、その中に karma 関連ファイルが格納される
- option「–save-dev」によって、install 対象の library 情報が自動で package.json に記述される
package.json
{
"name": "JSTestSample",
"version": "0.0.0",
"description": "Sample for JS Test.",
"main": "index.js",
"scripts": {
"test": "node_modules/karma/bin/karma start"
},
"author": "",
"license": "not commedical",
"devDependencies": {
"karma": "~0.12.9"
}
}
karma init
$ node_modules/karma/bin/karma init
- 対話形式で情報を入力
- karma.conf.jsが作成される
- package.json に jasmine 関連ファイルと、chrome-lancher が記述される
package.json
"devDependencies": {
"karma": "~0.12.9",
"karma-jasmine": "~0.1.5",
"karma-chrome-launcher": "~0.1.3"
}
#プロダクトコード+テストコード
- jasmine の文法で
Logic.js
function Logic() {
}
Logic.prototype.squaredNumber = function(num){
return num * num;
};
LogicTest.js
describe("TestSample>", function(){
describe("Logic>", function() {
it("multiNumber", function() {
var target = new Logic();
var num = 3;
var expected = 10;
var result = target.squaredNumber(num);
expect(expected).toEqual(result);
})
});
});
#テスト実行コマンドを設定
package.json
{
"name": "JSTestSample",
"version": "0.0.0",
"description": "Sample for JS Test.",
"main": "index.js",
"scripts": {
"test": "node_modules/karma/bin/karma start"
},
"author": "",
"license": "not commedical",
"devDependencies": {
"karma": "~0.12.9",
"karma-jasmine": "~0.1.5",
"karma-chrome-launcher": "~0.1.3"
}
}
#テスト実行してみる
$ npm test
- package.json の情報を元にテストが実行される
- chromeが自動で起動する
- テスト成功時
- テスト失敗したときはこんな感じ