javascript - 针对不同浏览器的 JavaScript 中的一般单元测试概念/实践？

Question

我一直在用强类型语言编写单元测试，对此我有很好的理解。当用 JavaScript 编写单元测试以验证某些功能在某些浏览器中是否正常工作时，我又回到了手动测试。我不了解它是如何工作的。 因为 JavaScript 旨在缩小数据和表示之间的差距，并使其更具交互性。一切都在浏览器中发生，而且更多地与 UI 有关。所以我假设如果我要编写单元测试，我会编写类似(伪代码)的内容:

run function A
check DOM if certain element has been created
  if not then fail
check if element is visible
  if not then fail
check for the content of that element
  if null then fail
etc…

编写这些测试对我来说似乎是“硬编码”，缺少的是测试无法判断它是否已正确呈现，它只是进行纯功能测试。所以我想知道是否有人可以向我解释什么是 JavaScript 中正确的测试过程，如何进行构建自动化以及一些通用的概念。我只是在看John Resig's project testswarm但还没有弄清楚它是关于什么的。我也在阅读 QUnit此刻。

我正在寻找一些关于我可以开始的概念/实践的介绍性 Material 。我不会寻找特定的库或工具，除非它们对概念有很好的介绍。

谢谢。

Answer 1

这绝对是目前网络开发中一个令人困惑和动态的领域。在我看来，JS 测试有几个重要的特征区别:

• 纯单元测试，测试纯 Javascript 代码。你可以断言 a+b=3 ， 管他呢。我们只有少数问题属于这一类。在讨论选项时，有很多 JSUnit(JUnit 端口)的替代方案。它们分为 TDD 与 BDD 以及这些类别中的命名选择。
• Javascript + DOM 测试。现在写的很多代码都是关于操作 DOM 的。例如。 assertEqual('<a><div /></a>', $('div').wrap('a'));对于基于 DOM 的 JS 测试，您要么需要转到浏览器内测试，要么使用像 env.js 这样的库。
• 还有 mocking & stubbing (smoke), async 等助手

有两个地方可以运行测试:

• 浏览器外测试(通常运行速度更快，因此可以在 TDD 环境中使用)
• 浏览器内测试(更慢、更复杂，但提供更准确的跨浏览器测试结果)

Selenium 在浏览器中运行，因此非常适合集成测试。如果您没有其他工作，这是一个很好的起点。它已经存在了几年，支持大多数流行的浏览器和语言。正在观看 a screencast like this可能会有帮助。和 this documentation可能会让您大致了解测试的样子。周围还有很多其他教程和截屏视频，但其中很多都陷入了您不关心的技术问题，因此您必须有所选择。

最后，这是来自 blue ridge 的示例，这是一组用于 Rails 的浏览器外测试(和手动浏览器内测试)的工具集合:

Screw.Unit(function() {
    describe("Your application javascript", function() {
        it("accesses the DOM from fixtures/application.html", function() {
            expect($$('.select_me').length).to(equal, 2);
        });
    });
});

这是一个使用类似 rspec 的语法测试的单一测试，测试是否有几个元素。希望这对您有所帮助!