2

我正在尝试使用 Jest 对 Angular 应用程序进行单元测试。为了测试角度绑定，我尝试使用 jsdom（注意，我使用的是 v3.1.2，因为我使用的是节点而不是 IO）。当我需要使用 html 加载脚本时，测试似乎在加载脚本之前完成。

我已经简化了我的测试用例以使用来自 jsdom 的示例：

it('updates the view without error', function(){
    var jsdom = require('../../../../node_modules/jsdom/lib/jsdom');

    jsdom.env(
      '<p><a class="the-link" href="https://github.com/tmpvar/jsdom">jsdom!</a></p>',
      ["http://code.jquery.com/jquery.js"],
      function (errors, window) {
        //console.log("contents of a.the-link:", window.$("a.the-link").text());
        console.log("Completed");
        expect(errors).toBeNull();
      }
    );

    console.log('exiting...');
});

如果我运行此测试，测试将通过，但不会打印“已完成”日志消息，我也可以将期望替换为明显失败的内容，例如 expect(false).toBeTruthy() 并且测试仍将“经过”。如果我删除 jquery 的注入，那么一切都会按预期工作。

我应该如何确保在退出测试之前加载脚本？更一般地说，在 Jest 中显式使用 jsdom 感觉有点不对劲。有没有更好的办法？

4

2 回答 2

4

因为.env可能是异步的，所以在调用回调之前测试总是存在的。

根据笑话教程，您可以简单地将 HTML 分配给document.body.innerHTML：

// Set up our document body
document.body.innerHTML =
    '<div>' +
    ' <span id="username" />' +
    ' <button id="button" />' +
    '</div>';
var $ = require('jquery');

或者，您可以使用pit代替it并从函数返回一个承诺。

于 2015-03-02T14:52:44.070 回答
1

我认为测试异步代码的最佳方法是传递“完成”回调，如文档中所述。您的代码将变为：

it('updates the view without error', function(done){
    var jsdom = require('../../../../node_modules/jsdom/lib/jsdom');

    jsdom.env(
      '<p><a class="the-link" href="https://github.com/tmpvar/jsdom">jsdom!</a></p>',
      ["http://code.jquery.com/jquery.js"],
      function (errors, window) {
        //console.log("contents of a.the-link:", window.$("a.the-link").text());
        console.log("Completed");
        expect(errors).toBeNull();
        done();
      }
    );

    console.log('exiting...');
});

于 2018-06-25T16:24:59.927 回答