Question

我快速浏览了QUnit，这是一个单元测试JavaScript的框架。我的目的是使用QUnit来调试复杂的网站行为。

但是，默认情况下，似乎QUnit的所有输出都是在DOM树中生成的。因此，在运行单元测试时，在DOM树上运行的任何JavaScript测试都可能表现不同。我的意思是，真正的网站没有QUnit的输出部分。

我找到了将结果输出到浏览器控制台的方法：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>QUnit Example</title>
  <!-- not needed      <link rel="stylesheet" href="qunit-1.15.0.css"> -->
  <style>
      #test {
          background-color: #ff9900;
      }
  </style>
</head>
<body>

<!-- not needed...

  <div id="qunit"></div>
  <div id="qunit-fixture"></div>
-->

  <script src="qunit-1.15.0.js"></script>
  <script src="tests.js"></script>

  <div id="testdiv">My normal DOM DATA</div>
</body>
</html>

在我的tests.js中，我有以下代码段：

QUnit.log(function( details ) {
  console.log( "QUnit: '" + details.name + "' = "
      + (details.result ? "PASS" : "FAIL,  " + "'"+details.message+"'"));
});

这很有效。但是，我目前在这个快速和肮脏的解决方案中存在的问题是：

我需要打开浏览器的控制台。完成所有测试后，现有解决方案可能会生成alert()（总结所有结果）。调整上述代码以便为单个失败/通过的测试发送alert()是微不足道的（但请参阅问题3）。
我无法启用＆＃34; noglobals＆＃34;检查功能，我发现它非常方便。 /含义，我无法通过JavaScript API了解如何设置它。
我想知道是否有任何现有/官方解决方案（所以我不需要重新发明轮子）。

Answer 1

所以，首先，对于测试JavaScript的单元测试！由于您突出显示的许多原因，这通常会被避免，因此很高兴看到您正在努力。

QUnit在浏览器中运行，它必须。还有其他的JS测试库绝对不必（例如Mocha），但在测试网站代码时（实际上它不是用于测试Node）。如果要测试网站JS代码，则需要在浏览器上下文中。但更重要的是，不，您不需要在浏览器中查看QUnit结果。

查看输出的最简单方法是最有可能使用自动化工具，尽管这不是设置的最快捷方式。例如，您可以使用Grunt和使用PhantomJS作为浏览器的QUnit plugin for Grunt来自动运行测试并在终端中查看输出（不是浏览器JS控制台，而是Linux / Mac） / Windows终端）。 Grunt也可用于Jenkins，Travis或TeamCity等持续集成工具。

事实上，QUnit让您能够在测试运行后获得所有结果并随意使用它们。因此，您可以编写自己的代码来处理结果并对它们执行某些操作（例如发送到ajax端点进行报告）：

var log = [];
// set up a handler to capture the output from QUnit.log()
// then put that output into the array above for reporting later
QUnit.testStart(function(testDetails){
  QUnit.log(function(details){
    if (!details.result) {
      details.name = testDetails.name;
      log.push(details);
    }
  });
});

// set up a callback for when the entire test suite is complete
QUnit.done(function (totals) {
  // do whatever you need to in here with the totals (http://api.qunitjs.com/QUnit.done/)
  // and with the individual test `log` array
});

所以，要专门回答你的问题：

您可以将window.alert(...)挂钩到QUnit.done()回调...但我认为您最好使用自动化解决方案。
虽然您无法通过API以编程方式设置noglobals切换，但您只需将其添加到测试文件的网址中即可：http://localhost:1234/tests/index.html?noglobals=true
请参阅上面的示例，我们在所有项目中使用Grunt，但对于跨浏览器测试，我会查看Sauce Labs及其VM API。

QUnit：在网站DOM树中没有输出结果的任何官方解决方案？

1 个答案: