javascript - 是否可以用 jasmine 模拟网络故障来模拟 ajax 请求？

Question

我有一个网络应用程序需要检查用户是否已连接到互联网。在实现中，如果对已知端点的 ajax ping 成功，则 check() 函数 promise 为 true，如果 ajax 调用以任何方式失败，则 promise 为 false。

在 Jasmine 中，我可以使用 request.respondWith({status:400, etc}) 来模拟失败，但我不知道如何模拟调用的更基本的错误根本没有被制造。

实际上，当调用甚至无法进行时，浏览器似乎“返回”状态代码 0 和 readyState 4。

我应该如何在我的 Jasmine 测试中处理这个问题？

Answer 1

这是一个有趣的问题。虽然我可能不会为您提供直接的答案，但我想尝试一下。

下面的代码说明了三个这样的例子(而不是测试)。在 action 中查看

  var errorFunction = function(jqXHR, status, error) {  
    console.log('This is errorFunction')  
  }

  var makeAPICall = function(url) {
    return $.ajax({
      url: url,
      fail: errorFunction,
      error: errorFunction
    });
  }

  var testFunction = function() {
    makeAPICall().done(function(data, status, xh) {
      if (xh.status === 0 && xh.readyState == 4) {
        errorFunction();
        return;
      }
      console.log("this is successFunction");
    }).fail(errorFunction);
  }

  var getData = function() {
    var str = 'ABCDEFGHIJ'
    var returnStr = '';
    for (var i = 0; i < 3000; i++) {
      returnStr += str;
    }
    return returnStr;
  }

  describe('test ajax errors', function() {
    it('tests a failed call due to huge payload ', function() {
      var xhrObj = $.ajax({
        url: 'https://jsonplaceholder.typicode.com/posts?userId=' + getData(),
        async: false
      });
      console.log('Below is the xhr object that is breing returned via spy');
      console.log(xhrObj);    
      spyOn(window, 'makeAPICall').and.returnValue(xhrObj);
      spyOn(window, 'errorFunction').and.callThrough();    
      testFunction();
      expect(window.errorFunction).toHaveBeenCalled();
    });

    it('tests a failed call due to some n/w error scenario (readyState->4, status->0)', function() {
      var xhrObj = $.ajax({
        url: '',      
        async: false
      });
      xhrObj.status = 0;
      xhrObj.statusText = 'error';
      console.log('Below is the xhr object that is breing returned via spy');
      console.log(xhrObj);    
      spyOn(window, 'makeAPICall').and.returnValue(xhrObj);
      spyOn(window, 'errorFunction').and.callThrough();    
      testFunction();
      expect(window.errorFunction).toHaveBeenCalled();
    });

    it('tests a failed call (bad url pattern)', function() {
      var xhrObj = $.ajax({
        url: 'https://jsonplaceholder.typicode.com/postssss/1',
        async: false
      });
      console.log('Below is the xhr object that is breing returned via spy');
      console.log(xhrObj);    
      spyOn(window, 'makeAPICall').and.returnValue(xhrObj);
      spyOn(window, 'errorFunction').and.callThrough();    
      testFunction();
      expect(window.errorFunction).toHaveBeenCalled();
    });


  });

注意事项:

• errorFunction 是从 done 调用的 errorFunction如果 readySatate === 4 && status === 0 以及所有其他错误/失败回调
• makeAPICall 返回使用了 done 和 fail 回调的 jqXHR。
• getData 是一个实用函数，它会生成一个巨大的有效负载:在 test1 中使用
• 第二个测试是关于使用空 url 进行虚拟 ajax 调用，以模拟 readyState->4 & status->0
• 第三个测试模拟了常见的错误请求 url 模式测试。
• 对于所有 3 个场景，我使用了一个由 $.ajax({some params & async false}) 创建的 jqXHR 对象
• 设置 async: false 帮助我生成一个虚拟对象并通过 spy 将其传递给函数