我们如何针对DOM操作执行unit testing？

在netTuts.com上对QUnit的介绍产生了一个有趣的交换（从未解决），如何对操作DOM的操作应用unit testing。 以下引用（亚历克斯约克）得到了关键：

如果您有这样的函数，那将是多么好的：

function add（a，b）{var result = a + b; $（“＃输入ResultTestBox”）VAL（结果）。

在上面的测试中，我想测试两件事：添加a和b，并将结果正确地放入DOM元素中。 我想通过提供一些模拟HTML来测试第二件事。 可能？

但是，就像我说的……没有解决。 可分解？

Answer 1

最新版本的QUnit支持#qunit-fixture元素，可以将您的CSS添加到QUnit网页。

例如，在您的HTML中：

 
 
test markup, will be hidden 

在你的JavaScript中：

 $('').appendTo('#qunit-fixture'); var result = add(a, b); equals(result, $('input#ResultTestBox').val(), "testing result box value"); 

Answer 2

当然你真正关心的是val方法在$(“input#ResultTestBox”)的返回值上调用$(“input#ResultTestBox”) – 你不需要测试jQuery方法本身的function。 为什么不注入jQuery对象的模拟实现并对其进行测试？

Answer 3

如果您不想为所有测试创建html页面沙箱的麻烦，可以在env.js中运行它们。