Skip to content

Instantly share code, notes, and snippets.

@makotot
Created October 31, 2012 13:40
Show Gist options
  • Save makotot/3987095 to your computer and use it in GitHub Desktop.
Save makotot/3987095 to your computer and use it in GitHub Desktop.
mocha + assertion library + testem

mocha - testing JavaScript with Expect(, Chai) and testem

node.js, browser用のJSテストフレームワーク。

BDD, TDD, QUnitスタイルのいずれかでテストコードが書ける。

mochaにアサーションの機能は無いので、should.js,expect.js,chai.js等のアサーションライブラリを用いる。

doc

http://visionmedia.github.com/mocha/

github

https://github.com/visionmedia/mocha

install

node

npm install -g mocha

browser

githubにあるmocha.js,mocha.cssをインクルードして、

mocha.setup();

http://d.hatena.ne.jp/hokaccha/20111206/1323131196

mocha1.2.0から

$ mocha init .

でmocha.js,mocha.css,test.htmlを自動生成してくれる。

global leaks detected

global leaks detectedが発生した場合、

mocha.setup({ignoreLeaks: true});

で解消できる。(詳細は良く分からない)

Assertion

Assertionとは、

プログラミング言語などの仕様・機能の一つで、プログラムの前提として満たされるべき条件を記述し、実行時にそれが満たされていない場合にエラーや例外を発生させたり、メッセージを表示して処理を中断したりする機能。 プログラム中のバグや不具合、論理の矛盾を発見するのに使われる。

アサーションはプログラムの任意の位置に挿入でき、その先の処理を実行するに当たって必ず満たされているべき条件を記述する。 実行時に条件が評価され、条件が満たされていない場合には実行を中断したり、エラーメッセージや関連する変数の値などの情報を表示したりする。

アサーションとは【assertion】(アサート) - 意味/解説/説明/定義 : IT用語辞典

mochaにはアサーションの機能が用意されておらず、Expect、Should, Chaiといったアサーションライブラリを用いる。

ブラウザでは、chai、Nodeではshouldが良く使われるらしい。 jasmineとmochaの比較 - 日々精進

IE8以下を考えると、Chaiでは無理。 expect.jsとchai.expectのブラウザ対応 - hokaccha.hamalog v2

Expect

Expectは、mochaで利用できるBDDアサーションライブラリ。

対応ブラウザは、IE6+, Firefox, Safari, Chrome, Opera。

  • node
$ npm install expect.js
  • browser

https://github.com/LearnBoost/expect.jsからexpect.jsを取得して、scriptタグで読み込む。

<script src="expect.js"></script>

testem

testemは、JavaScriptのテストランナー。

testemを用いることで、テストを行うための環境構築に時間をかけることなく、テストの実行を簡単に行える。

サポートされているフレームワークは、jasmine(デフォルト)、mocha、QUnitで、他のフレームワークもアダプタを用意すれば利用できるらしい。

install

npmでインストールする。

$ npm -g testem install

ヘルプは -h で表示。

$ testem -h

setup

行う設定は、testem.jsonを用意してjson形式で記述するだけ。

{
    "framework": "mocha",// defaultはjasmineで、jasmine以外のフレームワークを使用する場合に指定する。
    "src_files": [// テスト対象のJavaScriptファイルを指定する。
        "*.js"
    ],
    "launch_in_dev": [// テストを実行するブラウザを記述。
        "Chrome"
    ],
    "test_page": "test.html"// 特定のHTMLでテスト実行する場合
}

テスト実行可能な(launch_in_devに指定できる)ブラウザ一覧は下記で確認できる。

$ testem launchers

run

testem.jsonで設定したら、

$ testem

でテスト実行。

testem.jsonでフレームワークにmochaを指定すればmochaは不要だが、 アサーションライブラリは"src_files"に含まれる場所に置く必要がある。

"test_page"を指定している場合は、対象のHTMLに必要なファイルをインクルードする必要がある。

chai

chai は、 mochaで利用できるBDD/TDDアサーションライブラリ。

  • node
$ npm install chai
  • browser

https://github.com/chaijs/chai か、もしくはhttp://chaijs.com/chai.jsからchai.jsをダウンロードしてインクルード。

mocha + chai / BDD

chai BDD API

link

@Layzie
Copy link

Layzie commented Oct 31, 2012

testacularだと、mochaとtestemを一緒にしたような感じに使える。
Googleの中の人がAngular.jsのテストの為に作ったようです。PhantomJS使ってヘッドレスにテストできる。
(そこはtestemもそうか)

@makotot
Copy link
Author

makotot commented Nov 1, 2012

testacularだと、mochaとtestemを一緒にしたような感じに使える。

testemと同じようなテストランナーだと思ってましたけど、試してみないと分からないですね。
Testacular試してみます。
PhantomJSとかTravis CIあたりも試したいですね。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment