使用 Jasmine 测试 DOM 操作

Question

我正在创建一个 JS 小部件，第一部分是使用 javascript 添加脚本，就像这样（来自谷歌分析的示例）：

 (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

如何用茉莉花测试它（使用固定装置）？

原文由 Sławosz 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

为了在我的规范中设置 HTML fixtures，我写了 jasmine-fixture 。有了它，你可以做这样的事情：

 var $foo, $input;
beforeEach(function(){
  $foo = affix('.foo');
    # appends to the DOM <div class="foo"></div>
  $input = $foo.affix('input[id="name"][value="Jim"]');
    # appends <input id="name" value="Jim"/> beneath the .foo div

afterEach，它会在你之后清理。

对于 DOM 状态的预期，我使用 jasmine-jquery 。它提供了大量匹配器，如下所示：

 it('is named Jim', function(){
  expect($input).toHaveValue("Jim");
});

原文由 Justin Searls 发布，翻译遵循 CC BY-SA 3.0 许可协议