无障碍性实用程序 —— 自动化测试您的 Web 应用程序
在现代 Web 开发中，Web 应用程序的无障碍性 (Accessibility) 越来越受到重视。无障碍性指的是让 Web 应用程序可访问和可使用，不论用户是否有身体或认知方面的障碍。为了实现一个无障碍性的 Web 应用程序，必须确保其 UI/UX 设计、交互、标记和代码均包含无障碍性的最佳实践。
在这个过程中，自动化测试是非常有用的工具。自动化测试可以在代码改变时检测错误和无障碍性问题，从而减少手动测试的工作量，并提高代码质量。
本文将介绍一些自动化测试工具，以及如何使用它们来确保 Web 应用程序的无障碍性。
一、Accessibility Insights
Accessibility Insights 是一个可靠的无障碍性检查和调试工具，可以用来验证数字产品的无障碍性并确定任何违反 WCAG 2.0 的规则或技术。该工具可在 Windows、Linux 和 macOS 上使用，可通过 Chrome、Edge、Firefox、IE 和 Selenium 来运行。
该工具使用了自己的扫描引擎（Accessibility Insights Engine），可以扫描您的 Web 应用程序中的无障碍性规则，并标识出可访问性错误和提供修复建议。该工具还提供了一个轻量级浏览器扩展，可以用来诊断 Page Accessibility Issues 和 Element Accessibility Issues。
使用 Accessibility Insights，您可以很容易地发现细微的无障碍性问题，例如不正确的语义 HTML、缺少语音导航功能、对键盘无法使用、颜色对视觉障碍者影响等等。
以下是一个示例标识可访问性错的 Accessibility Insights 报告：
二、Axe 随机器
Axe 随机器 (axe-core) 是一个流行的无障碍性检测引擎，可帮助开发人员验证 Web 应用程序的可访问性，并发现无障碍性不良实践。Axe 随机器通过使用 JavaScript 对输入的 HTML 和 DOM 元素进行检查来完成检测。
Axe 随机器提供的可访问性问题的类别非常广泛，例如：页面标题与文档语言是否合乎逻辑、是否使用有意义、可访问的标题、是否满足对键盘的支持、是否阅读器友好、是否使用图像的有意义的替代品代替等等。
Axe 随机器还提供了一个简单直接的 API，它能以 JSON 格式输出问题和修复方案，并可以与多个框架和工具集成，例如 React、Jest、WebdriverIO 和 Puppeteer。
以下是一个 Axe 随机器输出的示例：
三、Pa11y
Pa11y 是一个可执行的命令行工具，提供了一个轻量级、可配置的无障碍性检测方案。Pa11y 支持多种输出格式（JSON、HTML、CSV 和 Markdown）和多种配置方式（命令行参数、配置文件、代码 API）。
Pa11y 使用 PhantomJS（已过时）或 Headless Chrome 来对指定的 Web 页面进行检查，并输出详细的测试结果，可以评估页面的标记、交互设计和可用性。
以下是一个 Pa11y 报告的示例：
总结
在本文中，我们介绍了三个有用的自动化测试工具，它们可以帮助您确保您的 Web 应用程序具有出色的无障碍性。使用这些工具，您可以快速、高效地发现并解决无障碍性问题，从而提高用户体验。
如果您希望为您的无障碍性测试工具箱添加其他工具，请查看 IDEA 团队的 GitHub 存储库。这个存储库包含了许多其他有用的无障碍性工具，并允许您提出问题或捐赠代码改进。
最后，我们强烈鼓励所有开发人员确保他们的 Web 应用程序具有最佳的无障碍性实践，因为无障碍性是一个人人有责的问题，我们需要一起努力，让 Web 更加友好和可达。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645dcaeb968c7c53b002d195