触发事件的Quit-asyncTest在单独运行时通过，但在另一个测试后运行时不通过

Question

我一直在尝试使用qunit来运行一些测试，这些测试需要触发点击，然后根据附加到点击事件的jQuery函数来测试是否设置了值或是否使div可见，该函数位于单独的js文件中。在设置时，我发现在另一个测试之后运行的任何异步测试都会失败，但在单独运行（或首次运行）时都会通过。

下面的代码用于底部链接的jsfiddle精简测试用例。test()之外的on('click')模仿对点击做出反应然后更改值的功能。通过移除第一个test()块，asyncTest()每次都会通过，通过在asyncTest()块内移动on('click')，测试每次也会沿着第一个test()块通过，所以从test()块内触发外部jQuery事件似乎有问题，并且在重置qunit-fixturediv内的测试代码时可能会混淆。

在寻找答案时，我见过一些此类问题的例子（交替通过和失败），但似乎没有任何东西可以解释这个特定的问题。有人能解释为什么会发生这种情况吗？如果可能的话，也许可以提出一个修复方案，保持这里列出的功能。

如有任何帮助，我们将不胜感激。

HTML

<div id="qunit"></div>
<div id="qunit-fixture">
    <input id="type" type="hidden" value="1" />
    <a id="click">click</a>
</div>

JS-

jQuery('#click').on('click', function(){
    jQuery('#type').val(2);
});
test("works", 1, function(){
    ok(jQuery('#type').val() == 1);
});
asyncTest("async", 1, function(){  
    setTimeout(function(){
        equal(jQuery('#type').val(), "2");
        start();
    }, 1000);
    jQuery('#click').trigger('click');
});

JS Fiddle

http://jsfiddle.net/andyface/rFpxL/

更新：

重新审视了这一点，发现通过将我的.on('click')处理程序设置为委派，它在测试重置时可以工作，我认为这是更大的问题，请参阅下面更新的fiddle。

jQuery('body').on('click', '#click', function(){
    jQuery('#type').val(2);
});

http://jsfiddle.net/andyface/rFpxL/4/

更新2:

我有一种感觉，我在这里试图做的事情实际上超出了单元测试的范围，理想情况下不应该使用qUnit进行测试，而应该使用其他工具进行集成测试。。。或者类似的东西。

Answer 1

发生了什么：

• setTimeout和trigger调用都是异步的
• 测试完成后未重置qunit-fixture
• test正在同步发生并阻止asyncTest

Answer 2

在我的特定测试用例中，我可以通过使事件处理程序使用委托来使其工作。

jQuery('body').on('click', '#click', function(){
    jQuery('#type').val(2);
});

我认为这是因为当测试被重置时，如果不作为委托来完成，那么事件绑定就会丢失，这对jQuery事件处理程序的工作方式是有意义的。

我不完全确定如何将其用于使用现有代码运行的实际测试，我不想将现有代码更改为仅用于测试，但我至少更清楚测试失败的原因。

Answer 3

当我遇到同样的问题时，我对这个问题做了很多研究，并在这里找到了一个解决方法：QUnit如何测试事件？

Woogy通过修复qunit的fixture之外的HTML，成功地避开了jquery在不委派时删除事件处理程序的行为。考虑到你的情况，我不知道这有多可行，或者你是否还在乎，但这对我来说很好。