如何使用茉莉花单元测试jquery ajax调用？

Question

我的.js文件中有下面的ajax调用代码，我想编写茉莉花单元测试来介绍它。

var promise = $.ajax({
                url: URL,
                type: 'GET'
               });
promise.done(function(data, status) {
       console.log("success");
});
promise.fail(function(status, error) {
       console.log("error");
});

我能够通过存根/模拟数据来编写$ .ajax调用的单元测试用例，但无法为.done和.fail方法编写测试用例。 无论如何，有没有编写.done和.fail方法的规范。

Answer 1

• 您可以从成功/失败处理程序中调用其他函数，以有效地模拟promise处理程序。
• 除了使代码易于阅读之外，它还有助于调试和模拟
• Slava Ivanov的答案可帮助您暂存适当的回调，并使用Jquery Deferred对象

这是我如何略微修改您的问题以适合模拟行为。 看到它在这里行动

var handler = {
  success: function(data) {
    console.log("success");
  },
  fail: function(data) {
    console.log("error");
  }
};
var testObj = {
  ajaxFunction: function() {
    var promise =
      $.ajax({
        url: 'abc',
        type: 'GET'
      });
    promise.done(function(data, status) {
      handler.success(data);
    });
    promise.fail(function(status, error) {
      handler.fail(error);
    });
  }
};

describe('test ajax', function() {
  it('test success', function() {
    spyOn(handler, 'success').and.callFake(function(e) {
      console.log("This is a spy call for success handler");
    });
    spyOn($, 'ajax').and.callFake(function(e) {
      return $.Deferred().resolve({
        'hurray': 'success'
      }).promise();
    });
    testObj.ajaxFunction();
    expect(handler.success).toHaveBeenCalled();
  });

  it('test failure', function() {
    spyOn(handler, 'fail').and.callFake(function(e) {
      console.log("This is a spy call for fail handler");
    });
    spyOn($, 'ajax').and.callFake(function(e) {
      return $.Deferred().reject({
        'alas': 'failure'
      }).promise();
    });
    testObj.ajaxFunction();
    expect(handler.fail).toHaveBeenCalled();
  });

});

Answer 2

要为.done和.fail方法编写测试用例，您需要在$.ajax JQuery函数上创建Spy ，并调用您自己的伪函数，在其中您将创建Deferred对象并根据您的测试来解析/拒绝它。 例如，您的代码可能看起来像...

// successful case
spyOn($, "ajax").and.callFake(function () {
    return $.Deferred().resolve(expected_data, expected_status).promise();
});

// failure case
spyOn($, "ajax").and.callFake(function () {
    return $.Deferred().reject(expected_status, expected_error).promise();
});