我的 qUnit 测试套件需要许多不同的整页 DOM 样本答案

【问题标题】：I need a number of different full-page DOM samples for my qUnit test suite我的 qUnit 测试套件需要许多不同的整页 DOM 样本
【发布时间】：2011-03-28 01:47:38
【问题描述】：

我有少量的 Javascript 来测试，但它在整个页面上运行，例如，通过像“#t34”这样的编号 id 来查找元素。我需要创建一些不同的页面来测试不同的可能配置。我看到我可以使用 qunit-fixture 创建一个 DOM 树供测试访问，但是每个页面配置都需要是一个完整的页面，因为它会通过 id 查找元素。

那里的各种 qUnit 教程似乎专注于执行简单算术的纯 Javascript 函数的简单示例。我需要帮助了解如何使用许多不同的文件构建真正的测试套件。

更新了更多细节：我是 Python 代码覆盖工具 coverage.py 的所有者。它生成 HTML 报告。这些报告上有 jQuery 以增加一点交互性。我正在添加更多内容，并希望自动化测试。 HTML 看起来像 like this。不涉及服务器，这些只是写入本地目录的文件，因此没有机会使用 ajax。我想针对许多不同的页面配置运行我的测试，主要与红色和绿色代码块的边缘情况有关。

因为我的代码以$("#t123") 的形式访问源代码行（例如），所以我在同一个DOM 中不能有多个HTML“页面”，因为id 会发生冲突。如何针对不同的 HTML 页面运行 qUnit？

【问题讨论】：

更具体的信息会有很大帮助。根据我目前可以使用的内容，在下面查看我的答案。

标签： jquery dom qunit test-suite

【解决方案1】：

#qunit-fixture 由 QUnit 自动重置，这意味着您可以使用每个测试使用的标记填充它，或者将其留空并让每个测试填充它以利用自动休息。或者只使用您在每次测试后单独重置的标记。

您可以使用模块方法重构每个测试的设置和拆卸：http://docs.jquery.com/QUnit/module

在这种情况下，听起来不错的选择是为每个测试使用（同步）ajax 请求，将您需要的页面标记加载到#qunit-fixture 元素中。这样你只需要自定义设置，因为 QUnit 之后会重置。

即使您只处理来自文件系统的本地文件，只要它们与您的测试套件文件位于同一目录中，您应该能够通过 ajax 加载它们。

如果没有，它很容易让本地服务器运行，例如通过该目录中的“open http://localhost:8080/ && python -m SimpleHTTPServer 8080”。

【讨论】：

örn，谢谢，我在问题中添加了更多细节。如果没有服务器来提供 ajax，是否有另一种选择可以将不同的 HTML 加载到夹具中？
感谢通过 ajax 将页面标记加载到 #qunit-fixture 的想法。

【解决方案2】：

为了测试整个页面和 DOM，我会使用 Selenium http://seleniumhq.org/ 既然你对 JS 测试有一定的了解，你也可以考虑http://www.phantomjs.org/ 和http://zombie.labnotes.org/

有了这些，您基本上可以使用 node.js 服务器来加载页面，您可以通过 node.js 命令行或通过脚本完全访问 DOM。把它想象成命令行上的萤火虫脚本（或者，萤火虫插件可以做同样的事情）。您可以进行断言以查看您的 id'ed 元素是否存在，并切换 click 元素等。

（顺便说一句，我也在 bocoup ：D）

【讨论】：