web-dev-qa-db-ja.com

NodeJSとクライアント側のYeomanとMochaとの完全な統合テスト

Yeomanで実行した素晴らしいクライアントサイドテストを取得しました。 Yeomanは私のCoffeeScriptをコンパイルし、サーバーでテストページを開き、PhantomJSでアクセスして、すべてのテスト結果をコマンドラインに渡します。このプロセスはかなりハッキーです。テスト結果はalert()メッセージを介してPhantomプロセスに渡され、Phantomプロセスは一時ファイルを作成し、JSONとしてメッセージを入力します。 Yeoman（Grunt）は一時ファイルをループし、テストを解析してコマンドラインに表示します。

私がプロセスを説明した理由は、それにいくつかのことを追加したいからです。サーバー側のテストも受けました。彼らはmochaとsupertestを使用してAPIエンドポイントをチェックし、Redisクライアントを使用してデータベースの状態が期待どおりであることを確認します。しかし、私はこれら2つのテストスイートをマージしたいと思います！

サーバー呼び出しに対するクライアント側のモック応答を書きたくありません。サーバーのモックデータを送信したくありません。途中でサーバーまたはクライアントを変更すると、テストは失敗しません。実際の統合テストを行いたいです。したがって、クライアント側でテストが終了するたびに、サーバー側で関連するテストを実行するフックが必要です（db状態、セッション状態の確認、別のテストページへの移動）。

これに対する解決策はありますか？または、代わりに、これを機能させるために、どこでYeoman/Grunt/grunt-mochaをハッキングし始めますか？

Grunt-mochaのPhantomHandlersから始めるのが良いと思います。

// Handle methods passed from PhantomJS, including Mocha hooks.
  var phantomHandlers = {
    // Mocha hooks.
    suiteStart: function(name) {
      unfinished[name] = true;
      currentModule = name;
    },
    suiteDone: function(name, failed, passed, total) {
      delete unfinished[name];
    },
    testStart: function(name) {
      currentTest = (currentModule ? currentModule + ' - ' : '') + name;
      verbose.write(currentTest + '...');
    },
    testFail: function(name, result) {
        result.testName = currentTest;
        failedAssertions.Push(result);
    },
    testDone: function(title, state) {
      // Log errors if necessary, otherwise success.
      if (state == 'failed') {
        // list assertions
        if (option('verbose')) {
          log.error();
          logFailedAssertions();
        } else {
          log.write('F'.red);
        }
      } else {
        verbose.ok().or.write('.');
      }
    },
    done: function(failed, passed, total, duration) {
      var nDuration = parseFloat(duration) || 0;
      status.failed += failed;
      status.passed += passed;
      status.total += total;
      status.duration += Math.round(nDuration*100)/100;
      // Print assertion errors here, if verbose mode is disabled.
      if (!option('verbose')) {
        if (failed > 0) {
          log.writeln();
          logFailedAssertions();
        } else {
          log.ok();
        }
      }
    },
    // Error handlers.
    done_fail: function(url) {
      verbose.write('Running PhantomJS...').or.write('...');
      log.error();
      grunt.warn('PhantomJS unable to load "' + url + '" URI.', 90);
    },
    done_timeout: function() {
      log.writeln();
      grunt.warn('PhantomJS timed out, possibly due to a missing Mocha run() call.', 90);
    },

    // console.log pass-through.
    // console: console.log.bind(console),
    // Debugging messages.
    debug: log.debug.bind(log, 'phantomjs')
  };

ありがとう！これには報奨金があります。

javascriptunit-testingnode.jscoffeescriptgruntjs
25
CamelCamelCamel

わからないヨーマン-まだ試していません-パズルの残りの部分を実行しました。私はあなたが残りを理解すると信じています。

統合テストを行う理由

あなたの質問では、クライアント側のテストとサーバー側のテストの両方をモックで実行している状況について話していました。何らかの理由で、同じモックで両方のテストセットを実行することはできないと思います。そうしないと、クライアント側でモックを変更した場合、サーバー側のテストは壊れたモックデータを取得するため失敗します。

必要なのは統合テストであるため、ヘッドレスブラウザーでクライアント側のコードを実行すると、サーバー側のコードも実行されます。さらに、サーバー側とクライアント側のコードを実行するだけでは不十分であり、両方の側にアサーションを配置できるようにする必要もありますね。

NodeおよびPhantomJSとの統合テスト

私がオンラインで見つけた統合テストの例のほとんどは、 Selenium または Zombie.js のいずれかを使用しています。前者は実際のブラウザを駆動するための大きなJavaベースのフレームワークであり、後者は jsdom の単純なラッパーです。私はあなたがそれらのどちらかを使うことを躊躇していて、 PhantomJS を好むと思います。もちろん、トリッキーな部分は、Nodeアプリから実行することです。そして、私はそれを取得しました。

PhantomJSを駆動するための2つのノードモジュールがあります。

  1. ファントム
  2. ノードファントム

残念ながら、両方のプロジェクトは作成者によって放棄されたようであり、他のコミュニティメンバーはそれらをフォークしてニーズに適応します。これは、両方のプロジェクトが何度もフォークされ、すべてのフォークがほとんど実行されていないことを意味します。 APIはほとんど存在しません。 ファントムフォークの1つ （ありがとう、 Seb Vincent ）でテストを実行しました。簡単なアプリは次のとおりです。

'use strict';
var express = require('express');

var app = express();

app.APP = {}; // we'll use it to check the state of the server in our tests

app.configure(function () {
    app.use(express.static(__dirname + '/public'));
});

app.get('/user/:name', function (req, res) {
    var data = app.APP.data = {
        name: req.params.name,
        secret: req.query.secret
    };
    res.send(data);
});

module.exports = app;

    app.listen(3000);
})();

/userへのリクエストをリッスンし、パスパラメータnameとクエリパラメータsecretを返します。これが私がサーバーを呼び出すページです：

window.APP = {};

(function () {
    'use strict';

    var name = 'Alex', secret ='Secret';
    var xhr = new XMLHttpRequest();
    xhr.open('get', '/user/' + name + '?secret=' + secret);
    xhr.onload = function (e) {
        APP.result = JSON.parse(xhr.responseText);
    };
    xhr.send();
})();

そして、ここに簡単なテストがあります：

describe('Simple user lookup', function () {
    'use strict';

    var browser, server;

    before(function (done) {
        // get our browser and server up and running
        phantom.create(function (ph) {
            ph.createPage(function (tab) {
                browser = tab;
                server = require('../app');
                server.listen(3000, function () {
                    done();
                });
            });
        });
    });

    it('should return data back', function (done) {
        browser.open('http://localhost:3000/app.html', function (status) {

            setTimeout(function () {
                browser.evaluate(function inBrowser() {
                    // this will be executed on a client-side
                    return window.APP.result;
                }, function fromBrowser(result) {
                    // server-side asserts
                    expect(server.APP.data.name).to.equal('Alex');
                    expect(server.APP.data.secret).to.equal('Secret');
                    // client-side asserts
                    expect(result.name).to.equal('Alex');
                    expect(result.secret).to.equal('Secret');
                    done();
                });
            }, 1000); // give time for xhr to run

        });
    });
});

ご覧のとおり、タイムアウト内にサーバーをポーリングする必要があります。これは、すべてのファントムバインディングが不完全であり、制限が多すぎるためです。ご覧のとおり、1回のテストでクライアントの状態とサーバーの状態の両方を確認できます。

Mocha ：mocha -t 2sを使用してテストを実行します。より進化したテストを実行するには、デフォルトのタイムアウト設定を増やす必要があります。

つまり、ご覧のとおり、すべてが実行可能です。これが完全な例のリポジトリです。

24
Andrew Андрей Листочкин