javascript - 使用 Jasmine 和 Karma 使用失败方法对 jQuery getJSON 函数错误进行单元测试

Question

我已经为调用 jQuery getJSON 方法的函数编写了单元测试。我正在测试的唯一事情是使用预期的 URL 调用它。我的单元测试使用 Jasmine Spy 来模拟 API 调用。但是，当我运行单元测试时，我收到此错误:

1) should make a request to the expected URL when running on localhost
     test module getDataFromApi function
     TypeError: Cannot read property 'fail' of undefined

在我的单元测试中，我创建了一个 Jasmine Spy，它返回 done 和 fail 方法。我在这里做错了什么？

这是我的单元测试:

describe('getFundDataFromApi function', function () {
    beforeEach(function () {
        spyOn($, "getJSON").and.callFake(function () {
            return {
                done: function () {},
                fail: function () {}
            };
        });
    });
    it('should make a request to the expected URL when running on localhost', function () {
        var expectedUrl = '/assets/mock-data/mock-data.json';
        module.getDataFromApi();
        expect($.getJSON).toHaveBeenCalled();
        expect($.getJSON).toHaveBeenCalledWith({url:expectedUrl});
    });
});

我正在尝试测试的函数:getDataFromApi

getDataFromApi: function () {
    var mod = this;
    var url = this.settings.apiUrl;

    $.getJSON({
        url: url
    })
    .done(function (data) {
        mod.processApiData(data);
    })
    .fail(function () {
        mod.displayErrorMessage();
    });
},

Answer 1

在您的函数getDataFromApi中，您在done之后链接了fail的调用，但是在模拟版本中done，它什么也不返回(undefined)，因此，您会得到TypeError:无法读取未定义的属性“失败”。

您可以使 done 函数返回一个具有 fail 属性的对象，该对象是一个函数。

beforeEach(function() {
  spyOn($, "getJSON").and.callFake(function() {
    return {
      done: function() {
        return { fail: function() {} };
      }
    };
  });
});

或者，一行 ES6 版本
spyOn($, "getJSON").and.callFake(() => ({ 完成: () => ({fail: () => {}}) }));

或者，如果您计划在测试中执行更多操作，例如测试成功或失败的响应，可能会返回 jQuery Deferred可以帮助你

beforeEach(function() {
  spyOn($, "getJSON").and.callFake(function() {
    const deferred = $.Deferred();

    deferred.resolve({'success': true});

    return deferred;
  });
});

调用 deferred.reject({'success': false}); 将为您提供测试错误的机会。

希望对你有帮助