web-dev-qa-db-ja.com

MochaテストフレームワークでのHTMLレポートの使用

NodeJSとMochaを使用していくつかのテストを生成してきましたが、結果をブラウザーに配置する方法を見つけたいと思います。 Mochaが「html」レポーターとmocha init <dir>を使用してこれをサポートしていることは知っていますが、どちらも機能していないようです（レポーターは、テストを実行しなくても実際にエラーをスローします）。

誰かがMochaを介してテストを実行し、HTMLレポートを生成する良い例を教えてもらえますか？私が模倣したい例は visionmedia サイトにあります。また、例として、example.jsというテストファイルを使用しているとしましょう。

事前にご協力いただきありがとうございます。周りにサンプルがほとんどないのは驚くべきことです。

javascriptnode.jsmocha
12
whitfin

Mochaにブラウザとターミナルの両方でテストを実行させるには、次の小さなチュートリアルに従ってください。

通常のnode.jsmochaテストスイート用に次のプラグインを想定しています。

  1. Node.js
  2. モカ

そして、次のツリー構造：

/root
  /test
    my_something_spec.js
  /javascript
  index.html

index.html

免責事項：私はあらゆる種類のベストプラクティスを露骨に放棄しましたが、正しい方向に向けるためだけです。

<html>
<head>
    <meta charset="utf-8">
    <title>Mocha Tests</title>
    <link rel="stylesheet" href="node_modules/mocha/mocha.css" />
</head>
<body>
    <div id="mocha"></div>
    <script src="node_modules/mocha/mocha.js"></script>
    <script>mocha.setup('bdd')</script>
    <script src="test/my_something_spec.js"></script>
    <script>
        mocha.checkLeaks();
        mocha.run();
    </script>
</body>
</html>

test/my_something_spec.js

describe("my function", function() {
  it("is a function", function() {
    expect(true).to.be(true);
  });
});

ルートから単純なpython server python -m SimpleHTTPServer 8080を実行し、localhost:8080にアクセスすると、テストが失敗します。ターミナルからmochaを実行すると、テストが失敗します。同じ出力、そのexpectは定義されていません。

7
Henrik Andersson

htmlレポーターを使用しようとすると、ノードで使用しようとするとスローされます。

$ mocha --reporter html > report.html

/usr/local/lib/node_modules/mocha/lib/reporters/html.js:194
    , div = document.createElement('div')
            ^
ReferenceError: document is not defined

Mochaドキュメント （および Githubの関連する問題 ）によると、htmlreporterはブラウザでのみ機能します。ブラウザでクライアント側のコードをテストします。

Node.jsテストスクリプトのHTMLを出力する場合は、 doc reporter を使用すると、HTMLが生成されます。

14
Paul Mougel

状況に応じて、ブラウザでNode.js andを使用して同じコードをテストするのが好きです。 「結果をブラウザーに配置する」（Node.jsから？）ことを求めていたのは知っていますが、これで十分だと思います。

この例はWindowsマシンで作成されましたが、MacとLinuxでも機能します。

これを機能させるには、not Webサーバー（Node.jsまたはその他）が必要です。

ブラウザでテストを実行するには、。/ test /index.htmlファイルを開きます。

コマンドラインでテストを実行するには、「mocha」を実行するだけです。

何もないところから始める：

C:\TEMP>mkdir mocha_node_browser

C:\TEMP>cd mocha_node_browser

C:\TEMP\mocha_node_browser>dir
Volume in drive C is MessedUp
Volume Serial Number is CAB2-E609

Directory of C:\TEMP\mocha_node_browser

2014-08-09  12:17    <DIR>          .
2014-08-09  12:17    <DIR>          ..
               0 File(s)              0 bytes
               2 Dir(s)  287,218,769,920 bytes free

すべてのテストを保持するディレクトリを初期化します。常に「テスト」と呼んでください。

C:\TEMP\mocha_node_browser>mocha init test

いくつかのファイルを編集および/または作成します。

C:\TEMP\mocha_node_browser>gvim -p test_me.js test\index.html test\tests.js

チャイを使います。同じchai.jsファイルが両方のテストで使用されます。

C:\TEMP\mocha_node_browser>cd test

C:\TEMP\mocha_node_browser\test>curl -O http://chaijs.com/chai.js
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100  117k  100  117k    0     0  99902      0  0:00:01  0:00:01 --:--:-- 99902

C:\TEMP\mocha_node_browser\test>cd ..

ファイルを作成/編集した後、コマンドラインからテストを実行します。

C:\TEMP\mocha_node_browser>mocha

  .

  1 passing (15ms)

...またはブラウザで./test/index.htmlを指定します。

passes: 1
failures: 0
duration: 0.03s

whatever
    should return "it worked!"

ファイルの内容：

C:\TEMP\mocha_node_browser>type test_me.js

// the function to be tested
function whatever() {
  return 'it worked!';
}

// only kicks in when running in Node.js via "mocha"
if (typeof module !== 'undefined') {
  module.exports = whatever;
}

テストするChaiとソースをtest/index.htmlに追加します。

C:\TEMP\mocha_node_browser>type test\index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Mocha</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="mocha.css" />
  </head>
  <body>
    <div id="mocha"></div>
    <script src="mocha.js"></script>
    <script>mocha.setup('bdd')</script>

    <!-- added to index.html: -->
    <script src="./chai.js"></script>
    <script src="../test_me.js"></script>

    <script src="tests.js"></script>
    <script>
      mocha.run();
    </script>
  </body>
</html>

テストをコマンドラインと互換性を持たせるおよびブラウザ

C:\TEMP\mocha_node_browser>type test\tests.js

if (typeof require !== 'undefined') {
  // testing in command-line
  var chai = require('./chai');
  var whatever = require('../test_me');
}

var expect = chai.expect;

describe('whatever', function() {
  it('should return "it worked!"', function() {
    expect(whatever()).to.equal("it worked!");
  });
});
1
Harry Pehkonen