译者 | 陈峻

审校 | 孙淑娟

在敏捷式的开发场景中，由于业务需求和技术环境时常发生变化，为了优化DevOps和QA工作流，项目团队往往需要通过部署最新的系统架构，以合理的成本和速度，去管理和实现既定的业务目标。近年来出现的自动化的可视化测试，简化了产品验证的关键环节。作为测试软件应用是否满足生产环境的主要工具，此类测试已变得越来越流行。

顾名思义，自动化的可视化测试是通过关注软件应用程序的可视化组件，来测试软件应用程序的自动化过程。对于大多数质量保证（QA）团队而言，虽然此类测试是他们日常测试策略中的一部分，但是在实现方式和使用工具上存在着巨大差异。

https://www.browserstack.com/state-of-visual-testing-report

软件测试的主要挑战

在继续讨论可视化测试之前，让我们先来了解软件测试所面临的常见挑战：

• 自动化与手动：任何涉及到大量人工操作的测试策略，都会耗费团队大量的资源和时间，其中也包括在测试运行和报告更新过程中的人际交流。而自动化的实现则需要测试团队对待部署的框架具有深入的理解。同时，频繁变化的业务需求，也会给自动化测试计划的维护与更新，带来一定的挑战。
• 测试环境：为了在近乎实际的情况下开展测试，测试团队需要能够在一组相关的设备、浏览器、网络环境中，执行各项操作，以便在受控的环境中复刻真实的使用状况。
• 完成时间：在软件项目中开发新的功能需要时间，开展测试同样也需要时间。为此，测试团队需要通过优化测试，来压缩项目的总时间，进而在最短的时间内，获得尽可能全面的结果。团队可以通过采用CI/CD，来自动化应用程序的构建、以及测试的触发，并且通过仪表板来跟踪软件的总体状态。不过，在从手动迁移到自动化的过程中，他们可能因为无法理解核心业务，从而导致测试脚本虽然能够快速执行，但是其执行的测试并不完整。
• 白盒与黑盒测试：白盒测试通常由开发人员完成，而黑盒测试则由测试人员实施。而这可能会导致两组人员之间缺乏沟通，进而让同步性测试变得困难重重。例如，由于白盒测试往往会比黑盒测试更为详细和具体，因此会导致在相同区域的测试覆盖程度上不尽相同。此外，由于白盒测试通常是在开发或分段环境中运行的，而黑盒测试则在类生产环境中开展的，这也导致了测试结果的复制和问题的调试，也会变得困难重重。
• 文档和报告：当在应用程序中检测到错误时，测试团队应当按照既定的格式，记录下所有与测试相关的元数据和步骤，以保持再现性和更深入的分析。同时，测试团队需要在特性与模块级别，去记录应用程序的行为，其中包括：重新创建的步骤、预期的行为、以及观察到的行为等。通常，在手动场景中，测试团队为了能够将检测到的问题，及时作为任务反馈并分配给开发人员。他们需要使用诸如Jira、Trello等bug跟踪工具，来记录所有的细节，并与其他团队共享。不过，这往往要求测试人员能够清楚地说明、并将事件记录到bug跟踪器中。而在此过程中，就可能会出现表述不清等人为的差错。

https://www.browserstack.com/state-of-visual-testing-report

可见，理解上述提到的各项挑战，将有助于我们掌握软件开发和测试过程中的各种复杂性，也便于我们运用正确的工具去解决可能碰到的问题。

自动化的可视化测试的特点和优势

自动化的可视化测试、或称可视化回归测试，是针对软件执行白盒产品验证测试的高级方法。鉴于不同的测试团队能够达到的自动化程度各不相同，我们在此将一个典型的可视化自动化测试框架的特点罗列如下：

• 能够将不同的设备、浏览器和操作系统，组合配置为一个测试套件，并添加到测试环境中。
• 支持设计良好、且高效的脚本语言，并能编写出各种测试用例。
• 能够通过SDK集成诸如React、Angular等应用程序开发平台，以及诸如Ember、Cypress等端到端的测试框架。
• 能够在本地开发、测试和生产环境之间顺利地同步各项工作。
• 能够记录带有I/O和屏幕输出的各种测试运行会话。
• 能够发现和记录应用程序版本之间的差异。
• 应该具有轻量级和成本效益的特点。

https://www.browserstack.com/state-of-visual-testing-report

以下是实施自动化的可视化测试的关键优势：

• 分离的技术和业务级测试：通过可视化各个单独的应用程序版本之间的差异，您可以清楚地划分运行单元、集成、系统和验收测试的各项团队职责。同时，通过将测试集成到CI/CD工作流中，您可以在每次应用发布之前，提供一个无缝的业务验证层。
• 节省时间和资源：显然，自动化可以减少甚至消除手动测试的需要，帮助您节省上文提到的时间和资源。而自动化的可视化测试还可以协助团队确保测试用例的正确运行和一致性。
• 提高效率：自动化的可视化测试可以通过提供更可靠且一致性的结果，来提高测试的覆盖率和准确性。先进的镜像处理功能则提供了多种方法（如先进的AI/ML技术），能够更加精确地自动记录问题，并发现其中的差异。可以说，一个“训练有素”的镜像处理网络，绝对能胜过一支人类团队。
• 最少量的人为干预：自动化核心分析既能够减少人为错误的可能性，又能够在保留团队成员对于关键过程的控制权的基础上，提供潜在问题的尽早反馈，以协助提高软件的整体质量。

Percy自动化的可视化测试

由BrowserStack推出的Percy，是一个一体化的可视化测试与审查分析的平台。它能够通过可视化整个回归测试的过程，提供对于构建、差异、快照、以及大量其他功能的访问。

作为BrowserStack套件的一部分，Percy可与Live和Live Automate等其他工具联合使用，为您的各种可视化测试需求，提供全面的覆盖。下面让我们来简单了解其执行的步骤：

• 首先，你需要在​​Percy​​处完成注册。
• 接着，请在​​Percy应用仪表板​​上创建项目。
• 请遵循适合您当前编程框架的​​集成指南​​，并使用由其提供的可用于链接和验证帐户的令牌。
• 根据指南在本地环境中安装项目的依赖项，以便向应用执行脚本写入​​Percy命令​​，并制作快照。
• 构建并运行应用程序，通过检查日志，以获取快照事件的更新。
• 在生成完毕后，您可返回​​仪表板​​处，并查看到自己的构建列表。
• 只要您单击任意条目，都将进入review部分。在此，您可以看到浏览器与Percy仪表板的其他功能之间的区别。

在Percy的仪表板上预览构建

一旦在仪表板上出现了您的构建，您便可以通过调整项目，来添加诸如webhook、slack、各种存储库集成，以及在快照中更换浏览器等更多功能。同时，您可以添加团队成员，并针对生产环境进行配置，以评估每个构建的可视化差异，并让团队针对审查开展协作。

在整个设置完成之后，您将获得如下优势：

全面的可视化测试和针对审批的工作流程

• 易于集成
• 实时结果
• 跨浏览器支持
• 强大的分析工具
• 灵活定价

基于云端的测试是未来

基于云端的测试能够给我们带来各种好处。其中最重要的是由它提供的快速、成本效益、以及全面的覆盖率。云端测试工具能够让企业通过提供与生产环境完全相同的、近乎真实测试环境，以节省大量的时间和资金。测试人员只需通过注册，并选择其用于测试的真实设备，便可开始标记bug。

除了速度和成本效益，云端测试还能够提供全面的覆盖率。据此，测试团队和QA经理可以更快地实现更高的准确性、以及更小的投入等目标。可以说，云端可视化测试不但简单、快速、实用，而且能够提高技术和业务方面的精确程度。就其目前的实际发展趋势和本身的优势，我们可以有把握地说，未来各种业务关键型软件的测试将主要是由基于云端的、高度自动化的可视化测试平台来实现。

译者介绍

陈峻 （Julian Chen），51CTO社区编辑，具有十多年的IT项目实施经验，善于对内外部资源与风险实施管控，专注传播网络与信息安全知识与经验。

原文标题：​​Is Visual Comparison Testing the Future?​​​，作者：Vivek Mannotr​