PDF超越页面对象：使用状态对象测试 Web 应用程序
使用状态驱动您的测试
Arie van Deursen
Web 应用程序的端到端测试通常涉及通过诸如 Selenium WebDriver8 之类的框架与 Web 页面进行复杂的交互。隐藏此类 Web 页面复杂性的推荐方法是使用页面对象，6 但首先需要回答一些问题：在测试 Web 应用程序时，您应该创建哪些页面对象？您应该在页面对象中包含哪些操作？给定您的页面对象，您应该指定哪些测试场景？
在过去几个月中使用页面对象测试 AngularJS (https://angularjs.org) Web 应用程序的过程中，我通过将页面对象移动到状态级别来回答了这些问题。将 Web 应用程序视为状态图使设计测试场景和相应的页面对象变得更加容易。本文描述了逐渐出现的方法：本质上是页面对象基于状态的泛化，在此称为状态对象。
WebDriver
WebDriver 是一种最先进的工具，广泛用于测试 Web 应用程序。它提供了一个 API 来访问 Web 页面上的元素，因为它们在浏览器中呈现。可以检查元素，例如访问表中包含的文本或元素的样式属性。此外，API 可以用于与页面交互——例如，单击链接或按钮或在输入表单中输入文本。因此，WebDriver 可用于编写通过 Web 应用程序的点击场景脚本，从而为应用程序生成端到端测试套件。
WebDriver 可用于针对您选择的浏览器（Internet Explorer、Firefox、Chrome 等）进行测试。它带有不同的语言绑定，允许您使用 C#、Java、JavaScript 或 Python 编写场景。
页面对象
WebDriver 提供了一个 API 来与 Web 页面上的元素进行交互，因为它们在浏览器中呈现。然而，有意义的最终用户场景不应以 Web 元素的形式表示，而应以应用程序域的形式表示。
因此，编写 WebDriver 测试的推荐模式是使用页面对象。此类对象在 Web 页面元素之上实现了域概念的 API，如图 1 所示，该图取自软件设计师 Martin Fowler4 的插图。
这些页面对象隐藏了使用的特定元素定位器（例如，查找按钮或链接）和底层小部件的详细信息。因此，如果页面详细信息发生更改，场景将更具可读性且更易于维护。
页面对象不必代表整个页面；它们也可以覆盖用户界面的一部分，例如导航窗格或上传按钮。
为了表示应用程序的导航，“PageObject 上的方法应返回其他 PageObject。”6 本文进一步发展了这个想法，从而引出了我将称之为状态对象的概念。
使用状态图建模 Web 应用程序
为了建模 Web 应用程序导航，让我们使用 UML（统一建模语言）中的状态图。图 2 显示了一个用于登录应用程序的状态图。用户要么处于正在验证状态，要么处于已验证状态。他们开始时未经验证，输入凭据，如果凭据正确，则达到已验证状态。从那里，他们可以注销以返回到他们可以进行身份验证的页面。
此图传统上会产生两个页面对象
• 一个用于登录页面，对应于正在验证状态。
• 一个用于注销按钮，该按钮存在于已验证状态下显示的任何页面上。
为了强调这些页面对象代表状态，它们被赋予了状态导航和状态检查的明确责任，并且它们变成了状态对象。
状态对象：检查和触发方法
可以为每个状态对象识别两种类型的方法
• 检查方法 返回浏览器处于给定状态时显示的键元素的值，例如用户名、文档名称或某些度量值。它们可以在测试场景中用于验证浏览器是否显示预期值。
• 触发方法 对应于模拟用户点击，并将浏览器带到新状态。在身份验证状态下，用户可以输入凭据并单击提交按钮，如果凭据正确，则会将浏览器引导到下一个已验证状态。从那里，用户可以单击注销按钮返回到身份验证状态。
将最重要的检查方法组合到一个 自检 中是有用的，该自检检查应用程序处于特定状态时必须保持的属性。例如，在身份验证状态下，您会期望有用于输入用户名或密码的字段；应该有一个提交按钮；并且 URL 可能应包含登录路由。然后可以使用这种自检方法来验证浏览器是否确实处于给定状态。
场景：触发和检查事件
给定一组状态对象，测试用例描述了通过状态机的相关场景（路径）。例如
1. 转到登录 URL。
2. 通过自检验证您处于身份验证状态。
3. 输入正确的凭据并提交。
4. 验证您处于已验证状态。
5. 点击注销。
6. 验证您处于身份验证状态。
因此，场景（测试或验收）是一系列操作，每个操作之后都进行检查以确认已达到预期状态。
条件事件
除了成功登录外，实际的登录过程还应处理尝试使用无效凭据登录的情况，如图 3 所示。该图显示了一个额外的状态，其中显示错误消息。此额外状态产生一个额外的状态对象，对应于相应消息的显示。作为操作，它只有一个关闭按钮，可返回到原始登录页面。
额外的状态自然会导致另一个测试场景
1. 转到登录 URL。
2. 执行身份验证自检。
3. 输入无效凭据并提交。
4. 执行登录错误自检。
5. 点击关闭。
6. 执行身份验证自检。
在图 3 中，边采用以下形式
事件 [条件] / 操作。
因此，触发器（点击）可以是条件性的，除了导致新状态外，它还可以导致操作（服务器端）。
在测试此类转换时，您触发事件，确保满足条件，然后验证 (1) 您可以观察到所需操作的任何影响，以及 (2) 您达到相应的状态。
扩展您的状态图
为了驱动测试，您可以扩展状态图以适应其他场景。例如，与身份验证相关的是注册新用户，如图 4 所示。此图包括身份验证状态，但并非所有传出的边。相反，重点是新的注册状态以及从那里可能进行的转换。
这再次产生了两个新的状态对象（用于注册和显示错误消息）以及两个额外的场景。因此，在为给定页面开发测试时，不必考虑完整的状态机：关注感兴趣的状态足以帮助推导出测试用例。
超级状态
具有共同行为的状态可以组织成超级状态（也称为 OR 状态）。例如，一旦通过身份验证，所有页面可能都有一个公共标头，其中包含用于注销以及导航到关键页面（例如，用于管理您的帐户或获得帮助，如图 5 所示）的按钮。
从超级状态发出的边（例如 logout）是每个内部状态（子状态）的传出 logout 事件的简写。展开简写将导致图 6 中的图，其中超级状态的五个传出边针对每个内部状态展开，从而导致 4 * 5 = 20 个（有向）边（绘制为双向边以使图表易于管理）。
实现此类超级状态的典型方法是使用可重用的 HTML 片段，例如在 AngularJS 中，这些片段通过 ngInclude 指令1 包含。
在这种情况下，创建与公共 include 文件对应的状态对象是最自然的。它包含对所需链接或按钮的存在性检查以及事件检查，以查看例如单击设置是否确实导致进入设置状态。
可能的测试场景将是
1. [登录所需的步骤。]
2. 执行投资组合自检。
3. 点击设置链接。
4. 执行设置自检。
5. 点击帮助链接。
6. 执行帮助自检。
7. 点击帐户链接。
8. 执行帐户自检。
9. 点击投资组合链接。
10. 执行投资组合自检。
11. 点击注销链接。
12. 执行身份验证自检。
这对应于测试已验证导航窗格的单个场景。它测试从帮助页面单击帐户链接是否有效。但是，它不检查从设置页面单击帐户链接是否有效。实际上，此测试仅涵盖扩展图中的 20 条边中的 4 条。
当然，您可以为所有 20 条边创建测试。如果被测应用程序为每个视图手工制作了导航窗格而不是使用单个 include 文件，则这可能是有意义的。在这种情况下，您可能有理由相信不同的路径可能会揭示不同的错误。但是，通常，对于 include 文件设置，测试所有扩展路径将是过度的。
状态遍历
导航标头的单个测试场景访问了五个不同的状态，以特定的顺序显示在图 7 中。这是一个相当长的测试，可以拆分为四个单独的测试用例（图 8）。
在单元测试中，后者将是首选方式。它的优点是四个测试是独立的：一个步骤中的失败不会影响其他步骤的测试。此外，故障诊断更容易，因为测试人员将知道哪个测试用例失败了。
然而，四个独立的测试可能会花费相当长的时间：每个测试都需要显式身份验证，这将大大减慢测试执行速度。因此，在端到端测试中，更常见的是在测试用例之间共享设置。
就 JUnit (https://junit.cn) 的设置方法而言，单元测试套件通常会使用 @Before 设置，该设置在类中的每个 @Test 之前重复执行。另一方面，端到端测试更可能使用 @BeforeClass，因此它们只需要执行一次昂贵的设置方法。
模态对话框
模态对话框通常用于禁用任何交互，直到用户确认重要消息（“您确定要...吗？”）。例如，前面显示的登录或注册错误消息。此类模态对话框需要一个单独的状态，因此需要不同的页面对象，提供一个接受事件来关闭对话框。
模态对话框可以使用浏览器警报（WebDriver 必须接受它们才能继续测试）或 JavaScript 逻辑来实现。在后一种情况下，要测试的额外检查可能是对话框确实是模态的（即，与页面的任何其他交互都被禁用）。
如果模态对话框由超级状态中包含的状态触发，则对话框状态不是超级状态的一部分（因为在对话框中禁用了超级状态交互）。因此，绘制显示错误处理和共享导航的登录状态机的正确方法如图 9 所示。在此，错误对话框不是导航超级状态的一部分，因为它只允许关闭事件，而不允许例如单击关于链接。
某些应用程序是相当对话框密集的——例如，在处理注册、登录、忘记密码等时。这些对话框中的许多对话框仅用于通知用户成功的状态更改。为了简化状态图，这些对话框可以作为边上的注释绘制，如图 10 所示。
顶部的图是完整版本，底部的图是缩写版本。请注意，<<dialog>> 注释对于实现测试非常重要。测试用例必须单击对话框的关闭按钮；否则，测试将被阻止。
转换树
为了支持关于状态可达性以及状态和转换覆盖率的推理，将状态图转换为转换树很有帮助，如图 11 所示。（有关更多信息，请参阅 Robert Binder 在测试面向对象系统中关于测试状态机的章节。）3
图 11 中的树是从先前显示的注册和身份验证状态机派生的。从初始身份验证状态开始，让我们对图进行广度优先遍历。因此，对于每个状态，您首先访问其直接后继者。如果您进入已访问过的状态，则已访问的状态将以灰色绘制为叶节点。然后，您继续到下一个未访问的状态。
该树在为单个状态设计测试时很有帮助：树中到达该状态的路径是图中到达该状态的最短路径。该树还清楚地指示状态存在哪些传出边。
该树也有助于为完整的状态机设计测试套件：为从根到叶的每个路径编写一个测试用例，将产生一个测试套件，该套件覆盖所有转换，因此覆盖机器中的所有状态。
覆盖路径
虽然专注于单个状态及其转换是发现和消除基本故障的好方法，但只有在沿着多个状态路径时才能看到更棘手的一组缺陷。
例如，考虑客户端缓存。诸如 AngularJS 之类的框架可以轻松地为（某些）后端 HTTP 调用启用缓存。正确地执行此操作可以提高响应速度并减少网络往返次数，因为后端调用的结果会被记住，而不是一遍又一遍地请求。
但是，如果结果可能会发生更改，则可能会导致不正确的结果。例如，客户端可能会在一个页面上请求包含所需信息的概览页面，在下一页上修改底层数据，然后返回到原始概览页面。这对应于图 12 中的绿色路径。
启用缓存后，投资组合状态将缓存后端调用结果。设置状态的正确缓存实现是，如果进行了更改，则使缓存无效。因此，当重新访问投资组合状态时，将再次进行调用，并将使用更新后的结果。
此缓存行为的测试用例可能如下所示
1. [采取到达投资组合的最短路线。]
2. 从投资组合收集感兴趣的值。
3. 单击设置链接以导航到设置。
4. 修改将影响感兴趣的投资组合值的设置。
5. 单击投资组合链接以导航回投资组合。
6. 断言显示修改后的值。
在前面提到的 AngularJS 应用程序中，此测试用例捕获了一个实际错误。不幸的是，很难或很昂贵地提出一种测试策略，该策略涵盖所有可能包含错误的此类路径。
在一般情况下，在存在循环的情况下，有无限多的潜在路径要遵循。因此，测试人员将需要依靠专业知识来识别感兴趣的路径。
前面描述的基于转换树的方法提供了所谓的往返覆盖率2——也就是说，它对每个循环进行一次练习，直到它返回到已访问过的节点（一次往返）。假设所有超级状态都已扩展，则此策略将导致缓存示例的测试用例。
替代标准包括所有长度为 N 的路径，其中必须练习给定长度的每个可能路径。但是，就要编写的测试用例数量增加而言，额外成本可能非常高，因此在没有自动化工具的情况下实现此类标准通常很困难。
就状态对象而言，测试路径不会导致新的状态对象——状态已经存在。但是，需要断言路径上的属性可能需要在状态对象中调用额外的检查方法。
后退
浏览器的后退按钮提供了需要特别注意的状态导航。虽然此按钮在传统的超文本导航中很有意义，但在当今的 Web 应用程序中，其行为应该是什么并不总是很清楚。
Web 开发人员可以通过操纵历史堆栈来更改按钮的行为。因此，您希望能够测试 Web 应用程序的后退按钮行为，并且 WebDriver 为此提供了一个 API 调用。
就状态机而言，后退按钮不是单独的转换。相反，它是对早期（单击）事件的反应。因此，后退按钮行为是边的属性，表明可以通过反向跟随转换来“撤消”转换。
UML 为元素赋予特殊含义的机制是使用注释（配置文件）。在图 13 中，已向边添加了显式的 <<back>> 和 <<noback>> 注释，以指示在单击后是否可以使用后退按钮返回到初始状态。因此，对于关于、注册和身份验证状态之间的简单导航，可以使用后退按钮向后导航。
但是，在已验证状态和身份验证状态之间，后退按钮实际上被禁用了：一旦注销，单击“后退”不应允许任何人访问需要身份验证的内容。知道哪些转换具有特殊的后退行为，将指导构建额外的测试场景以验证所需的行为。
带有历史记录的超级状态
作为超级状态的稍微复杂的示例，请考虑一个可以在不同列之间排序的表。单击列标题会导致表排序，从而为每列生成一个子状态（图 14）。
事件来自超级状态，表明可以从任何子状态触发事件，并进入特定的子状态。当离开可排序的表页面时——例如，通过请求给定行的详细信息——需要做出关于返回到该页面（在本例中通过单击投资组合链接）是否应产生按默认列（在本例中为 A）排序的表，还是应根据上次单击的列恢复排序的设计决策。
在 UML 状态图中，第一个选项（返回到超级状态的初始状态）是默认选项。第二个选项（返回到超级状态的状态，就像离开之前一样）可以通过将超级状态标记为历史记录状态，并用带圆圈的 H 标记来指示。在这两种情况下，如果此行为很重要并且需要测试，则需要额外的路径（场景）来验证超级状态在从非初始状态退出后是否返回到正确的状态。
与状态
当今的 Web 应用程序通常显示许多独立的窗口小部件，例如一个中的联系人列表和另一个中的图片数组。这些窗口小部件对应于放置在一个页面上的小的独立状态机。
在 UML 状态图中，此类状态可以通过正交区域（也称为 AND 状态）来描述，如图 15 所示。该图显示了一个投资组合状态，该状态由一个可排序的表和一个用于添加项目的上传按钮组成。这些可以独立使用，如投资组合状态的两个半部分（由虚线分隔）所示。上传对话框是模态的，这就是为什么它在投资组合类之外。上传后，表保持排序不变，因此用带圆圈的 H 标记。
此类正交区域可用于表示一个页面上存在的多个小型状态机。这些正交区域中的状态转换可能来自用户交互。它们也可以由服务器事件（通过 Web 套接字）触发，例如新电子邮件、股票价格调整等的推送通知。
从测试的角度来看，正交区域原则上是独立的，因此可以独立测试。
与 OR 状态一样，AND 状态可以扩展，在这种情况下，可以显式显示所有可能的交错。这会大大扩展图表，因此显着增加了潜在测试用例的数量。虽然显式测试其中一些交错是有意义且可行的，但测试所有交错需要自动化测试生成。
基于状态的故事
最后但并非最不重要的一点是，状态和状态图在描述用户故事和验收场景的需求时也很有用。例如，它与技术顾问 Dan North5 提出的故事格式自然契合。此类故事由“作为... 我想要... 以便...”的一般叙述组成，后跟许多“给定... 当... 然后...”形式的验收场景。
在许多情况下，这些验收场景可以简单地映射到测试状态图中的单个转换。然后，场景采用以下形式
给定我已到达某个状态
当我触发特定事件时
然后应用程序执行操作
并且应用程序移动到其他状态。
因此，状态对象允许 API 与状态机交互，如这些验收场景所示。单个测试用例从一个状态移动到另一个状态，而完整的功能由许多通过状态机导航的验收测试用例描述，同时检查应用程序的行为方式。
AngularJS PhoneCat 示例
作为使用 WebDriver 和状态对象进行测试的完整示例，请考虑 AngularJS PhoneCat 教程 (https://docs.angularjs.org/tutorial)。图 16 显示了 PhoneCat 应用程序运行时的屏幕截图。它附带一个以 Protractor (https://angular.github.io/protractor/#/) 编写的测试套件，WebDriverJS (https://seleniumhq.github.io/selenium/docs/api/javascript/) 扩展专为 AngularJS 应用程序量身定制。
该应用程序由一个简单的电话列表组成，该列表可以按名称过滤，并按字母顺序或年龄排序。单击一个电话会转到该电话类型的完整详细信息。
教程随附的 WebdriverJS 测试套件由每个视图（电话列表和电话详细信息）的三个测试用例以及打开 URL 的一个测试用例组成，总共七个测试用例。
原始教程中的测试套件未使用页面（或状态）对象。为了说明状态对象的使用，我已将 PhoneCat 测试套件重写为基于状态对象的测试套件，该套件可从我在 GitHub 上的 PhoneCat 分支 (https://github.com/avandeursen/angular-phonecat/pull/1) 获得。
我用于 PhoneCat 应用程序的状态图如图 17 所示。它产生了两个状态对象（每个视图一个）。这些状态对象可用于表达原始场景集。此外，状态图还要求提供其他用例，例如原始测试用例中未涵盖的“sort-newest”转换。
该图还清楚地表明，没有直接的方法从电话详细信息转到电话列表。在此，浏览器的后退按钮是交互设计的显式部分，这就是为什么将 <<back>> 注释添加到相应的转换中。（请注意，这是唯一具有此属性的边：在电话列表状态下单击任何其他转换后的“后退”都会退出应用程序，这符合 AngularJS 的默认行为。）
由于后退按钮对于在两个视图之间导航至关重要，因此基于状态的测试套件还通过场景描述了此行为。
最后，由于 Protractor 和 WebDriverJS API 完全基于异步 JavaScript 承诺，7 状态对象实现也是异步的。例如，电话列表状态对象提供了一种“计划命令对电话列表进行排序”的方法，而不是阻塞直到电话排序完成。通过这种方式，实际场景可以使用例如 then 承诺运算符将承诺链接在一起。
生产环境中的 AngularJS
本文中呈现的大多数图都是基于为代尔夫特理工大学衍生公司开发的 Web 应用程序创建的图。该应用程序允许用户注册、登录、上传文件、分析和可视化文件以及检查分析结果。
该应用程序的端到端测试套件使用状态对象。它由大约 25 个状态对象和 75 个场景组成。与 PhoneCat 测试套件一样，它使用 Protractor，由大约 1,750 行 JavaScript 代码组成。
端到端测试套件从 TeamCity (https://www.jetbrains.com/teamcity/) 持续集成服务器运行，该服务器在后端或前端发生任何更改时，都会调用大约 350 个后端单元测试以及所有端到端场景。
测试套件已帮助查找和修复与客户端缓存、后退按钮行为、表排序和图像加载相关的各种错误。其中一些问题是由于不正确的数据绑定导致的，例如，JavaScript 变量名称中的拼写错误或不完整的重命名重构。测试还发现了与不正确的服务器配置和权限相关的后端 API 问题（例如，导致 405 和偶尔的 500 HTTP 状态代码），以及不正确的客户端/服务器假设（服务器返回的 JavaScript 对象表示法不符合前端的期望）。
结论
在对 Web 应用程序进行端到端测试时，请使用状态来驱动测试
• 将感兴趣的交互建模为小型状态机。
• 让每个状态对应一个状态对象。
• 对于每个状态，包括自检以验证浏览器是否确实处于该状态。
• 对于每个转换，编写一个场景，对原始状态和目标状态执行自检，并验证转换操作的效果。
• 使用转换树来推理状态可达性和转换覆盖率。
• 使用高级状态图概念，例如 AND 状态、OR 状态和注释，以使您的图表简洁易懂。
• 考虑状态机中可能容易出错的特定路径；如果您已经拥有该路径上状态的状态对象，则测试该路径上的行为应该很简单。
• 在持续集成服务器中执行端到端测试套件，以发现 HTML、JavaScript 和后端服务之间的集成问题。
与页面对象一样，浏览器交互的详细信息封装在状态对象中，并对测试场景隐藏。最重要的是，状态图和相应的状态对象直接指导您完成测试套件设计的整个过程。
参考文献
1. AngularJS。ngInclude 指令； https://docs.angularjs.org/api/ng/directive/ngInclude。
2. Antoniol, G., Briand, L.C., Di Penta, M., Labiche, Y. 2002。使用往返策略进行基于状态的类测试的案例研究。第 13届国际软件可靠性工程研讨会 (ISSRE) 会议记录。IEEE，第 269-279 页。
3. Binder, R. V. 1999。测试面向对象系统。Addison-Wesley。
4. Fowler, M. 2013。页面对象； https://martinfowler.com.cn/bliki/PageObject.html。
5. North, D. 故事中有什么？； http://dannorth.net/whats-in-a-story/。
6. Selenium。2013。页面对象； https://github.com/SeleniumHQ/selenium/wiki/PageObjects
7. Selenium。2014。承诺。在 WebDriverJS 用户指南中； https://code.google.com/p/selenium/wiki/WebDriverJs#Promises。
8. SeleniumHQ。WebDriver； http://docs.seleniumhq.org/projects/webdriver/。
进一步阅读
Harel, D. 1987。状态图：复杂系统的可视化形式化方法。计算机编程科学 8 (3), 231-274。
Horrocks, I. 1999。使用状态图构建用户界面。Addison-Wesley。
Leotta, M., Clerissi, D., Ricca, F., Spadaro, C. 2013。使用页面对象模式提高测试套件的可维护性：工业案例研究。测试会议：学术与工业会议 - 实践与研究技术 (TAIC PART) 会议记录。IEEE，第 108-113 页。
Mesbah, A., van Deursen, A., Roest, D. 2012。现代 Web 应用程序的基于不变式的自动测试。IEEE 软件工程汇刊 38(1), 35-53。
http://en.wikipedia.org/wiki/UML_state_machine
致谢
感谢 Michael de Jong、Alex Nederlof 和 Ali Mesbah 进行了多次良好的讨论并对本文稿提供了反馈。本文稿的 UML 图表是使用免费 UML 绘图工具 UMLet（版本 13.2）制作的。
喜欢它，讨厌它？请告诉我们
Arie van Deursen 是代尔夫特理工大学的教授，他在那里领导软件工程研究小组。他的研究兴趣包括软件测试、软件架构和协作软件工程。他担任实证软件工程和 软件工程与方法论汇刊的编辑委员会成员。为了帮助将他的研究应用于实践，他于 2000 年共同创立了 Software Improvement Group，并于 2010 年共同创立了 Infotron。
© 2015 1542-7730/14/0400 $10.00
最初发表于 Queue vol. 13, no. 6—
在 数字图书馆 中评论本文
更多相关文章
Shylaja Nukala, Vivek Rau - 为什么 SRE 文档很重要
SRE（站点可靠性工程）是一种职位职能、一种思维模式以及一套工程方法，用于使网络产品和服务可靠运行。SRE 在软件开发和系统工程的交叉领域工作，以解决运营问题，并设计、构建和运行可扩展、可靠且高效的大型分布式系统。成熟的 SRE 团队可能拥有与许多 SRE 职能相关的完善文档体系。
Taylor Savage - Web 组件化
在当今的软件工程领域，没有哪项任务能像 Web 开发那样艰巨。一个典型的 Web 应用程序规范可能会这样写道：该应用必须能在各种浏览器上运行。它必须以 60 fps 的帧率运行动画。它必须对触摸操作立即响应。它必须符合一套特定的设计原则和规范。它必须能在几乎所有可以想象的屏幕尺寸上工作，从电视和 30 英寸显示器到手机和手表表面。它必须在长期内得到良好的工程设计和维护。
Rich Harris - 消除入门障碍
一场战争正在 Web 开发领域打响。一方是工具制造者和工具使用者的先锋，他们热衷于摧毁糟糕的旧观念（在这个环境中，“旧”意味着任何在一个多月前在 Hacker News 上首次出现的东西）以及关于转译器等等的激烈辩论。
Alex Liu - JavaScript 与 Netflix 用户界面
自从引入以来的二十年里，JavaScript 已经成为 Web 事实上的官方语言。在野外的运行时环境数量方面，JavaScript 胜过所有其他语言。如今市场上几乎所有的消费硬件设备都以某种方式支持这种语言。虽然这通常是通过集成 Web 浏览器应用程序来完成的，但许多设备现在也原生支持 Web 视图，作为操作系统 UI（用户界面）的一部分。
© 保留所有权利。