jquery - qUnit：在 qunit-fixture 之外编写的 Twitter Bootstrap 模态

Question

我很难为使用 Twitter 的 Bootstrap 的项目编写 qUnit 测试。当一个模态被生成时，它会将覆盖层放在 qunit-fixture 之外，所以当下一个测试运行时，覆盖层不会被删除。有人遇到这个问题吗？

点击事件（链接到 jsfiddle 需要一些内联代码，请看 fiddle）：

$("#qunit-fixture").on('click', '#click', function () {
    $('#error').modal('show');
});

注意每次测试时屏幕如何变暗？这是每次连续测试都不会重置的覆盖。

另一个问题是

test("Error Dialog ", function () {
    $("#click").click();
    equal($("#error").is(":visible "), true, "Error dialog spawned.")
});

失败了。不知道为什么对话框没有出现。任何见解将不胜感激。

score 1 · Accepted Answer

Bootstrap 在 body 的末尾添加了一个 div 来管理背景。它在测试执行后仍然存在，因为它在#qunit-fixture div 之外。

<div class="modal-backdrop fade in"></div>

除了使用适当的选项删除背景之外，我没有看到任何其他解决方案：

$('#error').modal({
    backdrop: false
});

或者：

data-backdrop="false"

我认为这没什么大不了的，因为您可能想测试您的代码而不是引导程序的模态效果。

1 回答 1