jQueryAjax测试不起作用

Question

我正在尝试测试一个非常简单的jQuery插件，它只需调用$.ajax方法并将其内容放入元素中。为了测试，我使用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文本。

有人知道我做错了什么吗？因为我确信我错过了一些现在看不见的东西。

Answer 1

使用同步AJAX

JS测试驱动程序和我所知道的大多数测试框架在处理异步javascript时都有点问题，基本上异步调用的脱节性质会打乱测试执行的顺序（比如：测试2在测试1完成之前开始执行）。因此，请尝试在测试期间使用同步ajax调用，方法是使用jQuery.ajaxSetup（）.设置全局异步属性

// Use synchronous AJAX
jQuery.ajaxSetup({async: false});
TestCase("Ajax ", {
    'test1' : function () {
        // etc...
    }
});
// Revert to default
jQuery.ajaxSetup({async: true});

Answer 2

我建议您使用js测试驱动程序提供的AsyncTestCase。它能很好地处理异步进程。

将您的模拟服务器方法添加到队列中的回调中，以便测试等待，直到"服务器"被调用。类似这样的东西：

var AjaxTest = AsyncTestCase('AjaxTest');
AjaxTest.prototype.testResponse = function(queue) {
    /*:DOC divElement = <div id="container" style="height: 100px;"></div>*/
    queue.call('Set up mocked server', function(callbacks) {        
        var serverStub = sinon.stub(jQuery, "ajax").yieldsTo("success", 'alex');
        callbacks.add(serverStub);
        $(this.divElement).transfer();
    });
    queue.call('Make assertions here', function() {
        console.log("*"+$(this.divElement).text()+"*");
    });
};

注意：我还没有尝试过代码。希望没有错别字。）