如何在Jasmine中正确使用模拟Ajax库

Question

我有一个调用JSON的函数，然后在成功函数中对DOM进行了一些更改。 我试图在我的Jasmine测试中使用mock-ajax库 ，以避免不得不公开各种私有函数来进行模拟 。

即使在逐步执行测试时设置了request.response也不会调用onSuccess方法。

我的测试：

 describe('the table loader', function () {
        var request;

        beforeEach(function() {
            //html with a loader div, an output div and a transit and dwell template
            setFixtures('<div class="loader"></div><div class="row"><div id="output" class="col-xs-12"></div></div><script id="thingTemplate" type="text/x-handlebars">{{snip}}</script>');
            expect($('.loader')).toBeVisible();

            //start ajax call
            window.dashboards.thing.display({
                loaderId: '.loader',
                templateId: '#thingTemplate',
                templateOutletId: '#output',
                dataUrl: '/my/fake/url'
            });
            //catch the ajax request
            request = mostRecentAjaxRequest();
        });

        describe('on success', function () {
            beforeEach(function() {
                //populate the response
                request.response({
                    status: 200,
                    responseText: "{rowItem: [{},{},{}]}"
                });
            });

            it('should hide the loader', function () {
                //thing should now receive that JSON and act accordingly
                expect($('.loader')).not.toBeVisible();
            });
        });
    });

和我的代码：

(function (dashboards, $) {
    dashboards.thing = dashboards.thing || {};

    var compileTable = function(templateId, jsonContext) {
        var source = $(templateId).html();
        var template = Handlebars.compile(source);
        var context = jsonContext;
        return template(context);
    };

    var getDashboardData = function(options) {
        $.getJSON(
            options.dataUrl,
            function (data) {
                processDashboardData(options, data);
            }
        ).fail(function (jqxhr, textStatus, error) {
            console.log('error downloading dashboard data');
            console.log(textStatus + ': ' + error);
        }).always(function() {
            console.log('complete');
        });
    };

    var processDashboardData = function (options, data) {
        $(options.loaderId).hide();
        $(options.templateOutletId).html(compileTable(options.templateId, data));
    };

    dashboards.thing.display = function (options) {
        getDashboardData(options);
    };
}(
    window.dashboards = window.dashboards || {},
    jQuery
));

没有调用任何延迟的函数（成功，错误和总是）。

编辑

基于下面的@gregg的答案（他是对的，我没有在示例代码中包括UseMock调用），这感觉像是一个版本问题。 即使包含该呼叫，这仍然对我不起作用。

我在github上添加了一个可运行的示例

Answer 1

在实际进行调用之前，您需要确保使用jasmine.Ajax.useMock()安装ajax模拟，否则jasmine-ajax不会接管XHR对象，您将发出真实的请求。 一旦对您的示例代码执行了此操作，看起来您要发送的responseText不是JSON可解析的，并且jQuery崩溃了。 但是我仍然在控制台中看到“完成”消息。

Answer 2

因此，截至2014年1月29日，Github上1.3.1标记中的模拟ajax的自述文件中的下载链接未指向该文件的正确版本。

从标记的lib文件夹中手动下载模拟ajax文件即可。

换句话说，对于标记为1.3.1的发行版，请不要从自述文件链接中下载，而是直接从标签lib文件夹中下载。

Answer 3

您的ajax调用和茉莉花返回的数据格式可能不同-我认为这将引发无法恢复的异常，因此您的回调函数均未运行。

较新版本的jasmine-ajax也使用request.respondWith ，并且还应注意（尽管我认为jQuery处理此问题），但Jasmine并没有定义XMLHttpRequest.Done ，因此，如果您使用香草JS，则必须自己处理这种情况。 最后，我使用jasmine.Ajax.install()而不是jasmine.Ajax.useMock() 。

ew-很难知道该怎么做，因为Jasmine的旧版本文档太差了，而且它们之间有很多不一致之处。