JasmineユニットテストでSinonを使用してjQueryアニメーションを偽造するにはどうすればよいですか？

Question

私は1秒のjQuery .animateアクションがあり、ページが読み込まれてから5秒後に起動します。私はJasmineのユニットテストコードでSinonタイマーを設定し、アニメーション後のプロパティがそうであるかどうかを確認するために7秒のティックの後にテストします。

正常に動作しないため、私はジャスミンHTMLテストページにアニメーション自体のインスタンスを配置して、何が起こっているのかをよりよく確認しています。 Firefoxとクロームで

• 、ページのロードが、アニメーション関数が呼び出されると、ユニットテストは直ちに失敗し、（直ちに）アニメーションが目に見えて起こります。

• IE、Opera、Safariでは、ページが読み込まれ、アニメーション機能が呼び出され、すぐに単体テストが失敗し、アニメーションが目に見えることはありません。私は（すべてのブラウザで）次られた望んで何

：

• ページが読み込まれると、アニメーション関数が呼び出され、アニメーションは瞬時に完了し、ユニットテストはすぐに成功しました。 Sinon's documentationを見ると

、それは偽のタイマーは以下のプロセスをカバーします： setTimeout、clearTimeout、setInterval、clearInterval、Date

私はjQueryのアニメーションがどのように動作するかわからないが、私はそれがCSSを使用していると想像トランジション、およびCSSトランジションはSinonのuseFakeTimersでカバーされていないので、これが問題だと思います。しかし、私が問題について正しいのであれば、まだ解決策が必要です。

私はシノン以外のものを試してみるべきでしょうか？ Jasmineのwaits()はこのテストでは完全に機能しますが、自分のような辛抱強い人にとっては実用的ではありません。

他の提案はありますか？私はJSユニットテストの初心者であることを覚えておいてください。曖昧な答えは私を助けてくれるものです。 ; o）

Answer 1

あなたはjQueryのエフェクトをオフにするjQuery offを使用することができます。

jQuery.fx.off = true 

これは、火災にあなたのイベントのためにinital 7秒の待機のあなたの問題を解決することはできませんが、それはあなたがDOMを持っていることをテストすることができます意味してい期待どおりに変更されました。

Answer 2

私は同じ問題を抱えています。 jQueryのアニメーションはを利用しているので、代わりにsetTimeout()に頼っているので、それが起こると思います。私はnullにwindowオブジェクトのすべてのブラウザ固有の​​の機能を設定することにより、この問題に働いてきた

：

window.webkitRequestAnimationFrame = null; 
window.mozRequestAnimationFrame = null; 
window.oRequestAnimationFrame = null; 

は、このコードはjQueryのがロードされる前 を実行していることを確認します。

Answer 3

は、私はそれがここにあったとして、それはSinonJsで可能だと思います：http://sinonjs.org/qunit

test("should animate element over 500ms", function() { 
    var el = jQuery("<div></div>"); 
    el.appendTo(document.body); 

    el.animate({ height: "200px", width: "200px" }); 
    this.clock.tick(510); 

    equals("200px", el.css("height")); 
    equals("200px", el.css("width")); 
});