Lỗi Qunit: xác nhận bên ngoài ngữ cảnh thử nghiệm

Question

Tôi đã tìm kiếm tất cả và xuất hiện lỗi này là do không sử dụng asyncTest đúng cách. Tuy nhiên, theo tài liệu, có vẻ như tôi đang làm đúng. Tôi đoán tôi đang thiếu một chi tiết nhỏ ở đâu đó và cần thêm một đôi mắt nữa ...

Tôi đang cố gắng kiểm tra một số mã yêu cầu ajax để tải trang và sau đó tải nó trong hộp đèn . lightbox-content không hiển thị trong DOM cho đến khi cuộc gọi ajax hoàn thành và có thể được hiển thị. Vì vậy, tôi chỉ có thể kiểm tra nó trong cuộc gọi onComplete của tôi trở lại, đó là nơi tôi có bài kiểm tra của tôi để xem nó có tải nó một cách chính xác hay không.

Đây là mã của tôi:

asyncTest('mytest', 1, function() { 
    utils.lightbox.show('/login', { 
     onComplete: function() { 
      ok($('#lighbox-content').is(':visible'), 'Lightbox loaded the /login page.'); 
      start(); 
     } 
    }); 
}); 

tôi nhận được lỗi:

Uncaught Error: assertion outside test context, was at HTMLDivElement.window.utils

bất cứ ai có thể nhìn thấy nơi tôi sẽ sai?

Answer 1

Tôi đồng ý rằng mã của bạn khớp với tài liệu theo như tôi có thể biết.

Cập nhật

Mặc dù tài liệu không hiển thị nó, tôi tự hỏi, nếu bạn phải nói QUnit dừng lại ở một thời điểm nào để nó biết đợi sau khi trở về chức năng kiểm tra. Tôi nghĩ rằng QUnit giả định điều này vì nó là một thử nghiệm không đồng bộ, nhưng nó đáng để bắn.

asyncTest('mytest', 1, function() { 
    stop(); 
    ... 
}); 

Tôi đã sử dụng Sinon.JS để tránh thực hiện cuộc gọi AJAX ngay từ đầu. Điều này có ba lợi ích tức thì:

1. Tôi không phụ thuộc vào máy chủ để phản hồi yêu cầu.
2. Tôi có thể chỉ định các kết quả khác nhau cho mỗi thử nghiệm.
3. Các thử nghiệm chạy nhanh hơn nhiều.

Việc mô phỏng có thể được thực hiện ở cấp XMLHttpRequest hoặc phương pháp jQuery và khá dễ dàng. Dưới đây là ví dụ từ một trong các thử nghiệm của tôi:

module("geo", { 
    setup: function() { 
     this.server = sinon.fakeServer.create(); 
    }, 

    teardown: function() { 
     this.server.restore(); 
    } 
} 

test("returns detected ZIP code", function() { 
    this.server.respondWith("/geo/detect-zip-from-ip", 
          [ 200, { "Content-Type": "text/html" }, '90210' ]); 
    geo.detectZip(function (zip) { 
     assertThat(zip, is('90210')); 
    }); 
    this.server.respond(); 
}); 

Answer 2

Tôi đã tìm thấy giải pháp cho trường hợp của mình, hy vọng vấn đề của bạn có cùng nguồn.

Giải thích bằng chữ:

• Tôi có một bài kiểm tra không đồng bộ phức tạp
• Tôi đã trì hoãn sự kiện, và có ok và equal khẳng định bên trong
• Tất nhiên, tất cả điều này được bọc bên asyncTest
• Nhưng, khi thử nghiệm là "hoàn thành" và tôi gọi start(), trình xử lý sự kiện vẫn còn đó
• Af ter gọi start(), tất cả các cuộc gọi tiếp tục ok bên asyncTest mà trở thành bất hợp pháp
• Và ném ngoại lệ
• Tôi tự hỏi điều gì sẽ xảy ra nếu số trong expect (trong ví dụ của bạn đó là tham số thứ hai) bị vượt qua. Ngoại lệ tương tự?

Giải thích trong mã:

asyncTest('mytest', /*1,*/ function() { 

      function imgLoadedOrFailed (result) { 
       clearTimeout(imageTimeToLive); 
       img.off(); 
       ok(result, 'Image in carousel pane has been loaded'); 
      } 

      var imageTimeToLive = setTimeout(
        imgLoadedOrFailed.bind(this, false), 
        5000), 
       img = panes[index].find('img:first'); 

      if (img) { 
       img.on('load', imgLoadedOrFailed.bind(this, true)); 
       img.on('error', imgLoadedOrFailed.bind(this, false)); 
      } 
     }); 


     // at some point I call: start(); 

Trong ví dụ này, khi tôi "kết thúc" các thử nghiệm gọi start(), các onload và onerror sự kiện vẫn có thể xảy ra.