テスト確認用ページを作成
足し算関数サンプルのページで使用されているadd()関数をテストするtest.htmlを作成する。test.html内には結果を表示する<div id="mocha"></div>を記述する。
Mocha+expect.jsファイル読み込み
test.html内にMocha+expect.jsおよびadd()関数が記述されているmain.jsを読み込む。さらにテストコードを記述するtest.jsを作成して読み込む。
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/2.2.1/mocha.min.css"> <script src="main.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/expect.js/0.2.0/expect.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/2.2.1/mocha.min.js"></script> <script src="test.js"></script>
test.jsの記述
まずテストコードを実行するために下記を記述
mocha.setup('bdd'); window.onload = function() { mocha.run(); };
そのあとにテストコードを記述する。
describe('add(a, b)', function() { describe('add(1, 2)', function() { it('1+2の足し算の結果3', function() { var test = add(1, 2); return expect(test).to.be(3); }); }); describe('add(0.1, 0.2)', function() { it('0.1+0.2の足し算の結果0.3', function() { var test = add(0.1, 0.2); return expect(test).to.be(0.3); }); }); });
describeやit部分はテストケースを分けるためのもの。
expect(【結果の値】).to.be(【テストする値】)のように値を入れる。
to.beは値が等しいかを調べる。その他はexpect.jsのGitHubを参照。