JavaScriptテストツールの対決：sinon.js vs testdouble.js

単体テストの実際のコードをテストする場合、多くの状況により、テストの書き込みが困難になります。関数が呼び出されているかどうかを確認する方法は？ AJAXコールをテストする方法は？または、setTimeoutのコードを使用しますか？この時点では、を使用して、コードを交換して、テストが難しいテスト内でテストを容易にするために、コードを交換する必要があります。

最近、testdouble.jsという新しいライブラリが出現しています。 Sinon.jsにセットされた同様の機能がありますが、あちこちでいくつかの違いがあることを除いて。

この記事では、sinon.jsとtestdouble.jsがそれぞれの長所と短所を提供し、比較して比較します。 Sinon.jsはまだより良い選択ですか、それとも挑戦者は勝つことができますか？

注：スタンドインのテストに慣れていない場合は、最初に私のsinon.jsチュートリアルを読むことをお勧めします。これは、ここで説明する概念をよりよく理解するのに役立ちます。

キーポイント

• 機能セットと用語：sinon.jsは、他のプログラミング言語に精通している人に馴染みのある人に馴染みのあるスパイ、スタブ、モックなど、従来のテストスタンドインセットを提供します。 JavaScript中心の語彙に関しては、伝統的なスパイが排除されます。
• 使いやすい：testdouble.jsには、初心者が習得するのが簡単なよりシンプルなAPIがありますが、sinon.jsは、他の言語の同様のテストツールに精通しているユーザーがそれを好むかもしれないより詳細ではあるが複雑なインターフェイスを提供しますその他。
入力の処理の関数：sinon.jsは、明示的に構成されていない限り、testdouble.jsによる正確なパラメーターマッチングの厳格な要件とは対照的に、正確な一致を必ずしも必要とすることなく、入力パラメーターを使用することなく、スタブとアサーションの柔軟性を高めることができます。
Promise and Callbacksのサポート：TestDouble.jsは、Promiseの組み込みサポートを統合し、Sinon.jsよりも最新のJavaScript開発により適している可能性があります達成されます。
モジュールの交換機能：TestDouble.jsは、モジュール全体の交換をサポートします。これは、テストモジュールの相互作用の分離に役立ちます。
クリーニングとメンテナンス：TestDouble.jsは、単一のリセット機能でクリーニングプロセスを簡素化し、他のテストに影響を与える可能性のあるテストスタンドインを残すリスクを減らしますが、Sinon.jsは管理するのが面倒な複数のクリーニング方法を提供します。 。
この記事で使用されている用語

議論されているものを簡単に理解するために、使用されている用語の簡単な概要を次に示します。これらはsinon.jsの定義であり、他の場所でわずかに異なる場合があります。

テストStand-inは、テスト中に使用される機能の代替品です。以下に説明する3つのタイプのいずれかを参照できます。

• Spyは、目的関数の動作に影響を与えることなく効果をチェックできるようにするテストの代役です。
• スタブは、目的関数の動作を戻り値などの他の何かに置き換えるテストの代役です。
• シミュレーションは、スタブとは異なるアプローチです。シミュレーションには、組み込みの検証が含まれています。これは、個別のアサーションの代わりになります。
testdouble.jsの目標の1つは、この用語の間の混乱を減らすことであることに注意する必要があります。

の概要

sinonには、スパイ、スタブ、モックの3つの異なるテストの代役概念があります。アイデアは、それぞれが異なる使用シナリオを表すということです。これにより、ライブラリは他の言語の人々や、Xunitテストモードなどの同じ用語を使用して本を読んだ人たちにとってより馴染みのあるものになります。しかし、一方で、これらの3つの概念は、最初に使用したときにシノンをより困難にすることもできます。

これは、Sinonの使用法の基本的な例です：

// 以下是查看函数调用的参数的方法：
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出：[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法：
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出：'not an html element'
stub.restore();

対照的に、testdouble.jsはよりシンプルなAPIを選択します。スパイやスタブなどの概念を使用する代わりに、JavaScriptの開発者が

、td.function、など、よりよく慣れている言語を使用しています。これにより、TestDoubleは潜在的に開始が容易になり、特定のタスクに適しています。しかし、一方で、いくつかのより高度な用途は単に不可能かもしれません（これは時々意図的です）。 td.object td.replace以下は、testdouble.jsの使用方法：

です

TestDoubleはよりシンプルな言語を使用します。 「スタブ」の代わりに関数を「交換」します。情報を取得するには、テスト疑惑の「解釈」関数が必要です。それとは別に、これまでのところ、それはシノンに非常に似ています。

// 以下是查看函数调用的参数的方法：
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出：[ -10 ]

// 以下是控制函数执行方式的方法：
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出：'not an html element'

// testdouble 使用一次调用重置所有测试替身，无需单独清理
td.reset();

これは、「匿名」テストのスタンドイン：

の作成にも拡張されます

および

var x = sinon.stub();

sinonのスパイとスタブには、それらに関するより多くの情報を提供する属性があります。たとえば、Sinonはやなどの属性を提供します。 testdoubleの場合、この情報は

var x = td.function();

：

から取得します。 stub.callCount stub.args最大の違いの1つは、スタブの設定方法と検証が行われる方法に関連しています。 Sinonを使用すると、スタブの後にコマンドをリンクし、アサーションを使用して結果を確認できます。 testdouble.jsは、関数をどのように呼びたいか、または関数呼び出しを「リハーサル」する方法を示してください。 td.explain

// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出：
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/

および

var x = sinon.stub();
x.withArgs('hello', 'world').returns(true);

var y = sinon.stub();
sinon.assert.calledWith(y, 'foo', 'bar');

これにより、TestDoubleのAPIが理解しやすくなります。これは、いつでリンクできるかを知る必要がないためです。

一般的なテストタスクをより詳細に比較します

var x = td.function();
td.when(x('hello', 'world')).thenReturn(true);

var y = td.function();
td.verify(y('foo', 'bar'));

高レベルでは、両方のライブラリが非常に似ています。しかし、実際のプロジェクトで実行する必要がある可能性のある一般的なテストタスクについてはどうでしょうか？いくつかの違いがどこに現れ始めているか見てみましょう。

testdouble.js spy

最初に注意すべきことは、testdouble.jsには「スパイ」の概念がないことです。 sinon.jsを使用すると、関数呼び出しを置き換えて、関数のデフォルトの動作を維持しながら情報を取得することができますが、これはtestdouble.jsでは不可能です。関数をTestDoubleに置き換えると、常にデフォルトの動作が失われます。

しかし、これは必ずしも問題ではありません。スパイの最も一般的な使用法は、それらを使用してコールバックが呼ばれていることを確認することです。

および

td.function大したことではありませんが、2つのライブラリ間のこの違いに注意することは依然として重要です。そうしないと、TestDouble.jsでより具体的な方法でスパイを使用できると予想している場合は驚くかもしれません。

var spy = sinon.spy();

myAsyncFunction(spy);

sinon.assert.calledOnce(spy);

testdouble.jsには、より正確な入力が必要

が必要です

遭遇する2番目の違いは、TestDoubleが入力に厳しいことです。

var spy = td.function();

myAsyncFunction(spy);

td.verify(spy());

Sinonのスタブとアサーションにより、提供されたパラメーターを不正確にすることができます。これは、例で説明するのが最も簡単です：

および

// 以下是查看函数调用的参数的方法：
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出：[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法：
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出：'not an html element'
stub.restore();

デフォルトでは、Sinonは関数に提供される追加のパラメーターの数を気にしません。 sinon.assert.calledWithExactlyなどの関数を提供しますが、ドキュメントのデフォルト値として推奨されません。 stub.withArgsのような関数には、「正確に」バリアントもありません。

一方、

testdouble.jsには、デフォルトで指定された正確なパラメーターが必要です。これは設計によるものです。アイデアは、この機能にテストで指定されていない他のパラメーターが提供されている場合、これはエラーであり、テストに失敗する可能性があるということです。

任意のパラメーターはtestdouble.jsで指定できますが、これはデフォルト値ではありません。

// 以下是查看函数调用的参数的方法：
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出：[ -10 ]

// 以下是控制函数执行方式的方法：
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出：'not an html element'

// testdouble 使用一次调用重置所有测试替身，无需单独清理
td.reset();

を使用すると、動作はsinon.jsに似ています。 ignoreExtraArgs: true

testdouble.jsには、約束のサポートが組み込まれています

および

var x = sinon.stub();

var x = td.function();

Note との形での約束サポートが含まれています。 stub.resolves testdouble.jsのコールバックサポートはより強力ですstub.rejects

sinonとtestdoubleは両方とも、スタブ関数コールバックを簡単に作成する方法を提供します。ただし、それらがどのように機能するかにはいくつかの違いがあります。

sinonは

を使用して、パラメーターとして受信した最初の関数

をスタブコールにします。

stub.yields testDouble.jsはデフォルトでノードスタイルモードになります。ここでは、コールバックは最後の

パラメーターであると想定されます。通話のリハーサル時に指定する必要はありません：

// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出：
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/

TestDoubleのコールバックサポートをより強力にするのは、複数のコールバックまたは異なるコールバックでシナリオの動作を簡単に定義できることです。

var x = sinon.stub();
x.withArgs('hello', 'world').returns(true);

var y = sinon.stub();
sinon.assert.calledWith(y, 'foo', 'bar');

…

を呼び出したいとします

callback1の関数にパラメーターとして渡すことに注意してください。これにより、TestDoubleに、コールバックとして使用するパラメーターが表示されます。

var x = td.function();
td.when(x('hello', 'world')).thenReturn(true);

var y = td.function();
td.verify(y('foo', 'bar'));

sinonを使用して、動作を変更することもできます：

td.callback td.whenこの場合、

の代わりに

を使用します。特に多くのパラメーターを備えた機能については、それを機能させるために、それを機能させるために呼び出しの特定のインデックスを提供する必要があります。

var spy = sinon.spy();

myAsyncFunction(spy);

sinon.assert.calledOnce(spy);

特定の値を持つ2つのコールバックを呼び出したい場合はどうなりますか？

callsArgWith yields sinonでは、これは単に不可能です。複数の呼び出しを

にリンクできますが、そのうちの1つだけを呼び出します。

testdouble.jsには、モジュールの交換が組み込まれています

関数を

var spy = td.function();

myAsyncFunction(spy);

td.verify(spy());

に置き換えることができることに加えて、TestDoubleを使用すると、モジュール全体を交換することもできます。

これは、交換する必要がある関数を直接エクスポートするモジュールがある場合に主に役立ちます。 callsArgWith

testdoubleに置き換えたい場合は、たとえば...

を使用できます。

// 以下是查看函数调用的参数的方法：
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出：[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法：
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出：'not an html element'
stub.restore();

// 以下是查看函数调用的参数的方法：
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出：[ -10 ]

// 以下是控制函数执行方式的方法：
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出：'not an html element'

// testdouble 使用一次调用重置所有测试替身，无需单独清理
td.reset();

モジュールの交換について注意する必要があるもう1つのことは、testdouble.jsがモジュール全体を自動的に交換することです。ここの例のような関数のエクスポートである場合、関数を置き換えます。複数の関数を含むオブジェクトの場合、それらすべてを置き換えます。コンストラクターとES6クラスもサポートされています。 ProxyquireとRewireの両方で、何とどのように交換するかを個別に指定する必要があります。

testdouble.js sinon

のヘルパー関数がありません

Sinonのエミュレーションタイマー、エミュレーションXMLHTTPREQUEST、またはエミュレーションサーバーを使用すると、TestDoubleには存在しないことに気付くでしょう。

エミュレーションタイマーはプラグインとして使用できますが、xmlhttprequestsとajax関数をさまざまな方法で処理する必要があります。

単純なソリューションは、使用しているAjax関数を置き換えることです

$.post testdouble.js

を使用してテストコンテンツをクリーンアップする方が簡単です

var x = sinon.stub();

ログイン後にコピー

または：

または：

var x = td.function();

通常、Sandboxおよび

メソッドを使用することをお勧めします。そうしないと、誤ってスタブやスパイを残すことができます。これにより、他のテストで問題が発生する可能性があります。これにより、トレースが困難なカスケードの障害につながる可能性があります。

// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出：
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/

testdouble.jsは、代役をクリーンアップしてテストする方法のみを提供します：

。推奨される方法は、

var x = sinon.stub();
x.withArgs('hello', 'world').returns(true);

var y = sinon.stub();
sinon.assert.calledWith(y, 'foo', 'bar');

ログイン後にコピー