Có thể giả lập yêu cầu ajax bằng hoa nhài mô phỏng một lỗi mạng không?

Question

Tôi có một ứng dụng web cần kiểm tra xem người dùng có được kết nối với Internet hay không. Trong quá trình thực hiện, hàm check() hứa hẹn là true nếu ping ajax đến một điểm cuối đã biết thành công và sai nếu cuộc gọi ajax bị lỗi theo bất kỳ cách nào.

Trong Jasmine, tôi có thể sử dụng request.respondWith({status:400, etc}) để mô phỏng lỗi, nhưng tôi không thể tìm ra cách mô phỏng lỗi cơ bản hơn về cuộc gọi không được thực hiện.

Trong thực tế, các trình duyệt dường như 'trả lại' mã trạng thái 0 và readyState 4 khi cuộc gọi thậm chí không thể thực hiện được.

Tôi nên tiếp cận điều này như thế nào trong các bài kiểm tra Jasmine của mình?

Answer 1

Đây là một câu hỏi thú vị. Mặc dù tôi có thể không cung cấp cho bạn một câu trả lời thẳng về phía trước cho nó, tôi muốn có một đâm vào nó.

Mã dưới đây minh họa ba ví dụ như vậy (các bài kiểm tra thay vì). Nhìn thấy nó trong 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(); 
    }); 


    }); 

Ghi chú:

• errorFunction là errorFunction đó được gọi là từ thực hiện nếu readySatate === 4 && status === 0 và cũng tất cả khác error/fail callbacks
• makeAPICall trả về jqXHR trên trong đó done & fail gọi lại được sử dụng.
• getData là một chức năng tiện ích mà tạo ra một tải trọng rất lớn: sử dụng trong test1
• thử nghiệm thứ hai là về thực hiện cuộc gọi ajax giả với trống url để mô phỏng readyState->4 & status->0
• các thử nghiệm thứ ba mô phỏng xấu mẫu yêu cầu url thông thường kiểm tra.
• cho tất cả 3 kịch bản, tôi đã sử dụng một đối tượng jqXHR mà tôi tạo ra bởi $.ajax({some params & async false})
• thiết async: false giúp tôi để tạo ra một đối tượng giả và vượt qua nó qua với chức năng thông qua một spy