Mocha

テストツールの話をします

Mocha - JavaScriptのユニットテストフレームワーク - node.jsやブラウザから実行できる - IDE（WebStormなど）からも実行できる

Mocha 設定もコードも簡単にできます。 chaiやshould.jsなどのアサーションライブラリを使えば、いろいろな書き方もできますが、今回は話しません。

準備 $ yarn add -D mocha

準備 package.json “scripts”: { “test”: “mocha” }

準備 $ yarn test

簡単な例 var assert = require('assert'); describe('Array', function() { describe('#indexOf()', function()
{ it('should return -1 when the value is not present', function() { assert.equal([1,2,3].indexOf(4), -1); }); }); });

簡単な例 $ mocha "test/test01.js" Array #indexOf() ✓ should return -1
when the value is not present 1 passing (8ms) ✨ Done in 0.50s.

非同期の例 const assert = require('assert'); function asyncAdd(a, b) { return
new Promise((resolve) => { resolve(a+b); }); }; describe('async test', () => { it('Promise', (done) => { let result = 0; asyncAdd(2, 3).then((result) => { assert(result === 9); }).then(done, done); }) });

非同期の例 $ mocha "test/test02.js" async test ✓ Promise 1 passing
(12ms) ✨ Done in 0.46s.

ブラウザでも動きます

ブラウザの例 <html> <head> <meta charset="utf-8"> <title>Mocha Tests</title> <link href="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.css" rel="stylesheet"
/> </head> <body> <div id="mocha"></div> <script src="https://cdn.rawgit.com/jquery/jquery/2.1.4/dist/jquery.min.js"></script> <script src="https://cdn.rawgit.com/Automattic/expect.js/0.3.1/index.js"></script> <script src="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.js"></script> <script>mocha.setup('bdd')</script>

ブラウザの例

テストの結果を変えることもできます

reporter $ yarn test --reporter json

reporter $ mocha "test/test01.js" "--reporter" "json" { "stats": { "tests":
[ { } ], "pending": [], "failures": [], ・・・ ✨ Done in 0.45s.

独自のreporter 作り方について詳しくはこちら https://github.com/mochajs/mocha/wiki/Third-party-reporters

独自のreporter $ yarn test --reporter ne

独自のreporter

おしまいいつか公開します。。。

Mocha

Mocha

Kaneko Takeshi

More Decks by Kaneko Takeshi

Other Decks in Technology

Featured

Transcript

Mocha

テストツールの話をします

Mocha - JavaScriptのユニットテストフレームワーク - node.jsやブラウザから実行できる - IDE（WebStormなど）からも実行できる

Mocha 設定もコードも簡単にできます。 chaiやshould.jsなどのアサーションライブラリを使えば、いろいろな書き方もできますが、今回は話しません。

準備 $ yarn add -D mocha

準備 package.json “scripts”: { “test”: “mocha” }

準備 $ yarn test

簡単な例 var assert = require('assert'); describe('Array', function() { describe('#indexOf()', function()

簡単な例 $ mocha "test/test01.js" Array #indexOf() ✓ should return -1

非同期の例 const assert = require('assert'); function asyncAdd(a, b) { return

非同期の例 $ mocha "test/test02.js" async test ✓ Promise 1 passing

ブラウザでも動きます

ブラウザの例 <html> <head> <meta charset="utf-8"> <title>Mocha Tests</title> <link href="https://cdn.rawgit.com/mochajs/mocha/2.2.5/mocha.css" rel="stylesheet"

ブラウザの例

テストの結果を変えることもできます

reporter $ yarn test --reporter json

reporter $ mocha "test/test01.js" "--reporter" "json" { "stats": { "tests":

独自のreporter 作り方について詳しくはこちら https://github.com/mochajs/mocha/wiki/Third-party-reporters

独自のreporter $ yarn test --reporter ne

独自のreporter

おしまいいつか公開します。。。