针对不同浏览器的 JavaScript 中的通用单元测试概念/实践？

Posted 2023-02-26

【中文标题】针对不同浏览器的 JavaScript 中的通用单元测试概念/实践？

【英文标题】：General unit testing concepts/practices in JavaScript against different browsers?

【发布时间】：2010-11-24 05:34:21

【问题描述】：

我一直在用强类型语言编写单元测试，对此我有相当好的理解。在用 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。

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

谢谢。

【参考方案1】：

这绝对是目前 Web 开发中一个令人困惑且充满活力的领域。在我看来，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 和其他 helpers

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

浏览器外测试（通常运行速度更快，因此可以在 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 的语法测试的单一测试，其中有几个元素。希望这会有所帮助！

【参考方案2】：

检查 jsTestDriver。我认为这是最好的之一：

JsTestDriver 的目标是构建一个 JavaScript 测试运行器：

很容易与连续集成 构建系统并允许运行 在多个浏览器上快速测试 简化 TDD 风格的开发。

http://code.google.com/p/js-test-driver/

【参考方案3】：

我有时会听说Selenium。我从未使用过它，但也许它可以帮助你。

Selenium Remote Control (RC) 运行您的 在多个浏览器中测试和 平台。调整你的测试 首选语言。

我还找到了一篇博客文章：Unit Testing in JavaScript，其中提到：Looking for a better JavaScript unit test tool。

【讨论】：

谢谢，但我不是在寻找任何特定的框架，我正在寻找的是理解在 javascript 中进行单元测试的概念，特别是针对不同的浏览器。

除非您尝试了几种不同的工具，否则您永远不会找到适合您需求的方法。据我了解，从那些测试的人那里，每个人都有自己的测试方式，这取决于 JS 如何融入整体解决方案。

【参考方案4】：

您可能需要考虑为您的 JavaScript 使用演示者模式并仅使用简单的单元测试。 Google 测试博客有一些不错的资源。

我会从这里开始：

http://googletesting.blogspot.com/2009/02/with-all-sport-drug-scandals-of-late.html

我在 Flex (ActionScript) 项目中为我的所有 UI 代码完成了这项工作，发现它运行良好。您希望隔离您的功能，以避免测试已经被浏览器供应商广泛测试过的东西。

【讨论】：

还可以查看我在链接帖子的 cmets 中找到的这个链接：atomicobject.com/pages/Presenter+First

【参考方案5】：

你可以尝试使用Test Swarm

【讨论】：

目前还处于 alpha 阶段，只对开源项目开放，看起来。