關於使用qunit.js進行事件回調測試的查詢

Question

我有一個html視圖，其中包含類「覆蓋」的div和具有類「關閉覆蓋」的關閉按鈕。我在JS註冊他們像這樣的活動：

$(".overlay").click(function(e){ 
    var target = $(this); // overlay div 

    target.removeClass("hide"); 

    return target; 
}); 
$(".close-overlay").click(function(e){ 
    var target = $(e.target) // close-overlay btn 
          .closest(".overlay"); // overlay div 

    target.addClass("hide"); 

    return target; 
}); 

，我已經在qunit測試如下：

test("Basic Test", function(){ 
    equal($(".overlay").click().hasClass("hide"), false, "Overlay Click"); 
    equal($(".close-overlay").click().hasClass("hide"), true, "Overlay Hide"); 
}); 

第一測試獲得通過，但第二個是越來越失敗。不知道爲什麼！ 有人可以幫忙嗎？謝謝。

Answer 1

在第二個斷言中，您正在測試.close-overlay元素具有隱藏類而不是.overlay元素。

所以你的測試應該是：

test("Basic Test", function(){ 
    equal($(".overlay").click().hasClass("hide"), false, "Overlay Click"); 
    var closeOverlayElement = $(".close-overlay"); 
    closeOverlayElement.click();  
    equal(closeOverlayElement.closest(".overlay").hasClass("hide"), true, "Overlay Hide"); 
});