Question

我在一个项目中工作，为每个函数编写JS单元测试。假设您有JS代码为页面执行操作，例如：

myProject.myPage.onDomReady = function() {
  $("#something").on("click", this.doSomething);
  $("#something-else").on("click", this.doSomethingElse);
}

在单元测试中，项目中的标准做法是将页面的html复制/粘贴到js测试中。像：

module("pages/my_page_test.js", {
  setup: function() {
    this.myPage = Unit.fixture('\
      <div class="container" id="my-form-container" style="display: block;">\
        <div class="container-bg"></div>\
        <div class="container-box" style="width:250px">\
        <div class="container-title">\
          <span class="container-title-text">Engage?</span>\
        </div>\
      </div>\
    ');
  }
);

通常情况下它的线条要多得多。

我的问题是：这是为页面函数编写JS单元测试的好方法吗？我的意思是你最终只是为了测试而将大部分HTML页面复制到你的JS中。每次更改HTML时，理论上您都会考虑更新测试中的HTML。

有更好的方法吗？

Answer 1

使用以下方法之一：

通过DOM引用HTML：

var foo = Unit.fixture(document.getElementById("foo").outerHTML)

通过the jQuery constructor

生成标记

var foo = Unit.fixture($("<span/>", {"class":"foo", "id":"bar", "html": "<span/>"}).get(0).outerHTML )

通过strings with Unicode escapes

生成标记

var foo = Unit.fixture("<label><input type=|radio| name=|bar| value=|baz|>bop</label>").replace(/\|/g,"\u0022")

JS单元测试而不必将整个HTML复制到单元测试中？

1 个答案: