0

$.ajax メソッドを呼び出してそのコンテンツを要素に入れるだけの非常に単純な jQuery プラグインをテストしようとしています。テストでは、モックに JsTestDriver と Sinon を使用しています。

プラグイン ファイルは次のようになります。

(function($) {
    $.fn.transfer = function() {

    $.ajax({
        url : 'friends',
    type : 'GET',
    contentType : 'application/json',
    dataType : 'json',
    success : function(html) {
        console.log("-"+html+"-");
        console.log($(this));
        $(this).html(html);
        console.log("+"+$(this).html()+"+")
    }
});
};
})(jQuery);

理論的には非常に単純なプラグインです。

そして、成功関数をモックする単体テストを作成しました。

TestCase("Ajax ", {
    'test response' : function () {
        /*:DOC divElement = <div id="container" style="height: 100px;"></div>*/
        sinon.stub(jQuery, "ajax").yieldsTo(
            "success", 'alex');
        $(this.divElement).transfer();
        console.log("*"+$(this.divElement).text()+"*");
    }
});

それも正しいようです。次に、このテストを実行すると、コンソールから次の行が出力されます。

[LOG] -alex-

[LOG] [object Object]

[LOG] +null+

[LOG] **

したがって、成功関数は「alex」文字列を正しく受け取ります。次に、 $(this) 参照が出力され、メッセージが html() 関数で設定され、以前の設定値をログに記録すると null が返されます。最後のログ メッセージはテスト ファイルにあり、ご覧のとおり ajax テキストが設定されていません。

私が間違っていることを誰かが知っていますか？今は見えない何かが欠けていると確信しているからです。

4

2 に答える 2

0

同期 AJAX を使用する

JS テスト ドライバーと私が知っているほとんどのテスト フレームワークでは、非同期 JavaScript の処理に少し問題があります。基本的に、非同期呼び出しのバラバラな性質により、テスト実行の順序が乱れます (テスト 1 が完了する前にテスト 2 が実行を開始すると考えてください)。このため、jQuery.ajaxSetup()でグローバル async プロパティを設定して、テスト中に同期 ajax 呼び出しを使用してみてください。

// Use synchronous AJAX
jQuery.ajaxSetup({async: false});

TestCase("Ajax ", {
    'test1' : function () {
        // etc...
    }
});

// Revert to default
jQuery.ajaxSetup({async: true});
于 2012-05-10T23:39:17.663 に答える