SuperAPI AI 工具集

Accessibility Auditor

测试与质量

查看项目

更新于 10-16 10:11

技能介绍

用途

Accessibility Auditor 是一个专注于 WCAG 2.1 AA 合规测试的 QA 自动化技能。它的目标是把自动化无障碍扫描与手动交互测试结合起来,覆盖仅靠工具无法发现的逻辑性无障碍缺陷。资料指出,WCAG 2.1 AA 合规在许多司法管辖区属于法律要求(ADA、Section 508、EN 301 549、EAA),因此无障碍失败应与功能性缺陷同等对待。

核心原则

该技能强调若干测试原则:

  • 自动化扫描只能发现约 30%-40% 的问题。axe-core 之类的工具能检测结构性违规(缺失 alt 文本、对比度不足、缺失标签),但无法检测逻辑问题(错误的 Tab 顺序、误导性的 ARIA 标签、糟糕的焦点管理)。必须始终将自动扫描与手动交互测试结合。
  • 键盘导航是基础。如果用户无法仅用键盘操作整个应用,该应用即不可访问。每个交互元素必须能通过 Tab 到达、通过 Enter 或 Space 激活、通过 Escape 关闭。
  • ARIA 是最后手段。原生 HTML 元素(button、input、select、dialog)自带无障碍语义,只有在原生元素无法表达所需语义时才使用 ARIA 角色、状态和属性;错误的 ARIA 比没有 ARIA 更糟。
  • 焦点管理至关重要。页面发生变化时(模态框打开、内容加载、路由切换),焦点必须移动到合适的元素,焦点绝不应丢失、被困在不可见元素中或停留在令人困惑的位置。
  • 颜色绝不能是唯一指示。通过颜色传达的信息还必须通过文本、图标或图案提供,需要用模拟色盲滤镜测试每个依赖颜色的 UI 元素。
  • 内容必须能在 200% 缩放时可感知。低视力用户可能将页面放大到 200% 或更多,此时所有内容必须保持可读、功能可操作、信息不被裁剪或隐藏。

项目结构

技能给出了一套无障碍测试的目录组织方式:

tests/ accessibility/ automated/ axe-scan-global.spec.ts axe-scan-pages.spec.ts axe-scan-components.spec.ts keyboard/ tab-navigation.spec.ts focus-management.spec.ts keyboard-shortcuts.spec.ts focus-trapping.spec.ts semantic/ heading-hierarchy.spec.ts landmark-regions.spec.ts form-labels.spec.ts link-purpose.spec.ts visual/ color-contrast.spec.ts zoom-reflow.spec.ts text-spacing.spec.ts motion-preferences.spec.ts interactive/ modal-accessibility.spec.ts dropdown-accessibility.spec.ts tooltip-accessibility.spec.ts toast-accessibility.spec.ts media/ image-alt-text.spec.ts video-captions.spec.ts audio-transcripts.spec.ts fixtures/ a11y.fixture.ts axe.fixture.ts helpers/ axe-helper.ts keyboard-navigator.ts focus-tracker.ts contrast-checker.ts pages/ any-page.page.ts playwright.config.ts

测试基础设施

axe-core 集成

技能提供了基于 Playwright 的 axe-core 集成方式,核心是 AxeHelper 类。它默认使用 ['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'] 标签,即 WCAG 2.1 AA。主要能力包括:

  • scanPage(options):可传入 tags、exclude、include、disableRules,执行扫描并返回违规、通过、不完整、不适用数量。
  • scanComponent(selector):仅扫描指定选择器对应的组件。
  • getCriticalViolations():只返回 critical 与 serious 级别的违规。
  • formatViolationReport(violations):格式化输出违规报告,包含元素 HTML 与问题摘要。

键盘导航

KeyboardNavigator 类用于系统化测试键盘导航,主要能力包括:

  • getFocusedElement():获取当前聚焦元素的标签名、角色、文本、aria-label、tabIndex 和选择器。
  • tabForward(count) / tabBackward(count):按 Tab 或 Shift+Tab 前进/后退并记录聚焦元素。
  • getFullTabOrder():遍历完整 Tab 顺序(带 200 次安全上限),直到回到首个元素或 BODY。
  • pressEnter() / pressSpace() / pressEscape() / pressArrowDown() / pressArrowUp():模拟按键。
  • isElementFocusable(selector):判断元素是否可聚焦。

焦点追踪

FocusTracker 类用于跟踪整个测试过程中的焦点变化,以检测焦点丢失或意外移动:

  • startTracking():注入脚本监听 focusin 与 focusout 事件。
  • getEvents():获取记录的焦点事件。
  • hasFocusBeenLost():判断焦点是否意外转到 BODY。

测试夹具

技能定义了自定义 Playwright 夹具,提供 axe、keyboard、focusTracker 三个夹具,以及 assertNoA11yViolations 断言函数。该断言会扫描页面并过滤出 critical/serious 违规,若存在则抛出包含格式化报告的 Error。

自动化扫描用例

技能给出了全页扫描的示例,pagesToScan 列表包含首页、仪表盘、个人资料、设置、任务、搜索、登录、注册等路径。示例测试会访问每个页面并断言无 critical/serious 违规,同时包含整个应用的 WCAG 2.1 AA 扫描测试,以及对动态内容更新的扫描(比较交互前后是否有新增违规)。还给出了组件级扫描的示例(如导航组件)。

限制

资料中未提供关于计费、价格、平台支持范围或使用效果的具体信息,也未说明该技能独立于 Playwright 运行的方式。上述内容均来自技能自身的说明文档与代码示例,实际使用时需结合自身项目情况调整。