2

虽然我过去使用过 QUnit，但我已经有一年没有真正使用它了，所以我希望这是一件微不足道的事情！

我有一堆运行良好的 QUnit 测试，除了每次加载页面时都会失败的测试。如果我刷新，测试有效，但如果我再次刷新它会中断！它变得可以预测，但我不明白为什么它不起作用。有问题的测试应该使用一个trigger('change')事件，但这只会每隔一次触发一次。

我有一个动态填充的select，我将一个change事件绑定到。它所做的所有事情都将值保存到localStorage并且我刚刚检查了该值是否已设置的测试。

示例 HTML：

<select id="options">
    <option value="">Please choose</option>
</select>
<p id="result"></p>

示例 JS：

$(document).ready(function() {
    var data = {
        1: 'Option 1',
        2: 'Option 2',
        3: 'Option 3'
    }
    for(var d in data) {
        $('#options').append($('<option>').val(d).text(data[d]));
    }
    $('#options').on('change', function() {
        $('#result').text(this.value);
        if(this.value != '') {
            localStorage.setItem('optionValue') = this.value;
        } else {
            throw 'You must choose a team';
        }
    });
});

示例 QUnit 测试：

test('Test some other stuff', function(assert) {
    localStorage.removeItem('optionValue');
    // some tests to check things have worked correctly
});

test('Is value added to localStorage?', 2, function(assert) {
    throws(function() { throw new $('#chooseTeam').val('').change(); }, 'No option selected');
    $('#options').val(1).trigger('change');
    equal(localStorage.getItem('optionValue'), 1, 'The first item should be selected');
});

但是，QUnit 输出中的结果是undefined. 我将其缩小到第一个测试，然后能够看到它localStorage.removeItem('optionValue')是每次调用的行，但更改事件仅每隔一次触发一次。

我创建了一个 JS fiddle 来尝试演示问题： http: //jsfiddle.net/cchana/zqNtU/3/（演示显示了它应该如何工作，但不是失败的测试）

有什么明显的东西会让这个失败吗？

更新

以为我应该更新一些可能有帮助的信息...

在更改方法中，我添加了一个console.log()，如下所示：

$('#options').on('change', function() {
    console.log('here');
});

我只是想检查一下 change 事件是否真的被触发了，但正如测试显示的那样，该方法只是每隔一次触发一次。

更新 2

为了让我的测试通过，我删除了localStorage.removeItem('optionValue');不理想的行，如果可能的话，我仍然想深入了解它！

4

1 回答 1

2

我从这篇文章中找到了答案（解决了在 qunit 中交替失败测试背后的奥秘）

为了解释原因，您可能有一个回调/插件自动绑定到页面上的现有元素。因此，当包含插件的文件包含在页面中时，元素会自动绑定。

因此，当您第一次运行测试时，它会失败。为什么？！原因是当测试运行时，测试工具中的元素似乎在每次运行测试时重新创建。因此，当重新创建它们时，不会发生自动绑定，因为 JavaScript 文件已经包含在内。

如果是这样，那么为什么它在交替调用上起作用？啊……这就是魔法。为了提高测试效率，QUnit 会在页面刷新时在其他测试之前运行失败的测试。因此，当失败的测试在其他测试之前执行时，测试工具中已经存在的元素被绑定，因此，测试通过了！但是因为这些测试现在通过了，当页面被刷新时，它们会回到原来的顺序，因此它们现在失败了！

当然有了这个认识，它促使我更有效地重写插件。希望这种自我发现对那里的人有所帮助！祝测试愉快！

我希望这可以帮助你。

于 2013-05-07T14:48:45.927 回答