Question

我很难与Qunit建立一些异步测试。因为我刚接触测试，所以不知道发生了什么。我在SO上查了几个类似的问题，但似乎没有一个对我有用。

(function(){

  var textBox, textArea,
     fixture = document.getElementById('qunit-fixture');

  QUnit.module( "module", {

    setup: function( assert ) {

      textBox        = document.createElement('input');
      textBox.type   = 'text';
      textBox.value  = '';

      textArea       = document.createElement('textarea');
      textArea.value = ' ';

      textBox.setAttribute("id", "textBox");
      textArea.setAttribute("id", "textArea");

      fixture.appendChild(textBox);
      fixture.appendChild(textArea);

    },

    teardown: function( assert ) {

      fixture.removeChild(textBox);
      fixture.removeChild(textArea);

    }

  });

  QUnit.asyncTest( "test a", function( assert ) {

    expect(1);

    setTimeout(function() {
      textBox.value = 'a'
    }, 250);

    setTimeout(function() {
      assert.deepEqual(textBox.value, 'a');
      QUnit.start();
    }, 500);

  });

  QUnit.asyncTest( "test b", function( assert ) {

   expect(1);

    setTimeout(function() {
      textBox.value = 'b'
    }, 250);

    setTimeout(function() {
      assert.deepEqual(textBox.value, 'b');
      QUnit.start();
    }, 500);

  });

}());

当我在浏览器中运行它时，它会显示：1. module: test b(1)，所以我想这只是运行最后一次测试或者第一次测试还没有结束？困惑，请帮助。

Answer 1

嗯......我已将您的代码复制到测试文件中并运行它，一切正常，我看到两个测试都通过了。也就是说，QUnit允许您重新运行单个测试...您可以在浏览器中检查URL吗？它是否表示要运行的测试号码？控制台中是否有错误？

此外，请注意，#qunit-fixture div在该模块中的每次测试后会自动重置，因此您不需要teardown这个mehtod。相反，您只需将输入和textarea添加到HTML文件中的#qunit-fixture div，然后让QUnit为您重置它。

我的test.html文件：

<!doctype html>
<html>
  <head>
    <link rel="stylesheet" href="vendor/qunit-1.14.0.css" />
  </head>
  <body>
    <div id="qunit"></div>
    <div id="qunit-fixture"></div>

    <script src="vendor/qunit-1.14.0.js"></script>
    <script>
      // your code here...
    </script>
  </body>
</html>

如何使用设置和拆除模块进行多个异步单元测试

1 个答案: