我想在我们的网络应用程序中测试 JavaScript 代码。我们正在使用 jQuery 库和 .Net MVC。我已经查看了这些答案,并且jqUnit看起来不错,所以我尝试了它,只是为了意识到我必须为我想要测试的每个页面重新创建所有标记。
我错过了什么吗?是否有任何替代方法来测试 JS/jQuery 代码?我们的标记有时很复杂,并且由于 AJAX 调用而发生巨大变化。
我能想到的最好的方法是尝试将我们的应用程序粘贴在测试页面上的 iframe 中。还没试过。
如果您测试 javascript 函数/对象,我可能会建议 YUI 的测试组件。
http://developer.yahoo.com/yui/yuitest/
与 JUnit 非常相似的设置,但只需要包含一些测试 javascript 文件。仅在测试模式下将其包含在您的页面中非常容易。
您可以只在内存中创建要测试的结构,而无需将其附加到文档中。这不适用于所有测试(例如,CSS 属性不会影响未插入文档的项目,但在某些情况下这可能值得一试)。
首先,它非常快,其次,您不会因为完成测试后需要删除的测试项目而破坏文档。
这是一个非常简单的例子中的想法。
test('My tests', function () {
var testSubj = $('<div>This <b>is</b> my <span>test subject</span></div>');
ok(testSubj.children('span') == 'test subject', 'Span is correct');
});
您可能需要两种方法,具体取决于代码:
您可能想弄清楚如何重组您的代码,以便以这种方式对其进行测试。你能让 JS 更加模块化,或者减少对某个标记的依赖吗?(可悲的是,有时你不能。)
这些的缺点是它们往往运行速度较慢并且更难维护或易碎。查找“页面对象”模式以帮助您解决可维护性方面的问题。
我们最终使用 selenium 来自动化 JS 单元测试来驱动它。
可能值得考虑 Selenium 并在浏览器级别运行一些自动化测试。
当然,在理想情况下,您会在代码级别使用单元测试框架,但考虑到这可能涉及大量前期返工,一个可靠的折衷方案可能是测试 javascript 是否确实满足您的需求它使用 Selenium 或类似的框架。
在 iframe 中测试您的应用程序可能会起作用。
我发现更好的是坚持模型-视图-演示者(MVP)范式(仅在客户端),同时将 UI 组件分解为可消化的块,以便能够在其自己的“驱动程序”中测试每个组件“ 页。大多数逻辑都位于 Presenter(s) 中,它是纯 JavaScript,因此可以使用纯 JavaScript 单元测试进行测试。单个 UI 组件可以使用 Selenium 之类的框架进行测试,它们的测试只是确保它们向 Presenter 抛出正确的事件。如果后端访问部分被存根/模拟到某种 Fetcher 类中,模型也可以作为纯 JavaScript 进行测试。
您可以使用模板引擎。对于许多不同的 http 服务器设置,存在许多不同的模板引擎,因此您可能会找到一个适合您需求的模板引擎,并且它是在您选择的(服务器端)编程语言中实现的。
现在,一旦您安装了模板引擎,您就可以使用原始布局并添加一个小标记,您可以在测试时插入 <script> 标记,而不是在不测试时插入任何标记。
这种方法的优点是:生产页面和测试页面之间需要绝对没有区别。您可以避免添加除测试之外不需要的 iframe。
Windmill是一个优秀的基于 python 的 JavaScript 测试框架。它正在积极开发中,因此它在不断改进。我建议看看它。您可以创建自动化测试,它有一个不错的 GUI,您也可以使用它来设置测试。还有许多其他功能,但没有理由在这里一一列出。
因此,您似乎在询问两种测试。一种是对您编写的使用 jquery 的代码进行单元测试。这个问题的答案比大家通常想的要简单得多。只需在您的单元测试中模拟 jquery。这真的很简单,并且工作方式与使用任何其他编程语言进行模拟的方式几乎相同。除了即使没有javascript框架也很容易做到。实际上,我在一个自动化测试套件中使用Test.TAP和 rhino 为我的项目运行这些类型的测试。无需浏览器。
另一种测试是集成或回归测试。这就是像 selenium 这样的工具的用武之地。这些测试发生在您的实际应用程序中,旨在确保所有部分按照您期望的方式协同工作。浏览器、JQuery、你的 javascript 和 Web 服务器。将这两种测试分开在您的脑海中是为 javascript 代码组合测试套件的关键。理想情况下,您将在多个浏览器中运行这些测试(甚至可能是浏览器的多个配置)。
visibone 浏览器参考建议他们称之为“自信”。它基本上给出了关于如何为 JavaScript 实现单元测试的建议。它真的很简单。
见下图链接右下角:
http://www.visibone.com/products/ebk8-9_850.jpg
在这里总结一下:
创建一个函数 assert():
function assert(fact, details){
if (!fact) alert("Assert failure: " + details);
}
你可以这样称呼它:
assert((parseInt("1") == 1), "Check string '1' is equal to integer 1");
或者可能有更好的 === 比较:
assert((parseInt("1") === 1), "Check string '1' is equal to integer 1");
链接图片上还有更多内容,您的断言功能可能会变得更加复杂。
我在“JavaScript assert”上进行了谷歌搜索,并获得了相当多的链接,因此可能值得自己检查一下。