testing-strategy

测试策略技能

无障碍测试的决策框架——何时使用自动化工具与手动测试、应测试哪些屏幕阅读器 + 浏览器组合，以及如何编写无障碍验收标准。

---

自动化测试与手动测试的覆盖范围

自动化工具可发现的问题（约 30-40%）	需要手动测试的问题（约 60-70%）
图片缺少替代文本	替代文本的质量和准确性
表单缺少标签	标签是否清晰且有帮助
色彩对比度比率（计算值）	上下文中的色彩对比度（渐变、图片）
缺少 lang 属性	语言识别是否正确
ID 重复	阅读顺序是否合理
自定义控件缺少 ARIA 角色	交互模式对应的 ARIA 角色是否正确
标题层级违规	标题文本是否有意义
链接和按钮为空	链接 / 按钮文本是否能清楚描述其用途
表格缺少表头	表格标题和表头关联质量
ARIA 语法错误	屏幕阅读器播报是否正确

浏览器 + 屏幕阅读器兼容性矩阵

首要测试组合（必测）

屏幕阅读器	浏览器	操作系统	优先级
NVDA	Firefox	Windows	必须测试
NVDA	Chrome	Windows	必须测试
JAWS	Chrome	Windows	必须测试
VoiceOver	Safari	macOS	必须测试
VoiceOver	Safari	iOS	必须测试
TalkBack	Chrome	Android	建议测试

次要组合（有则更好）

屏幕阅读器	浏览器	操作系统
Narrator	Edge	Windows
JAWS	Edge	Windows

测试决策树

Is it a new component or page?
├── Yes → Full test coverage (automated + manual)
│   ├── Run axe-core / Lighthouse scan
│   ├── Keyboard-only navigation test
│   ├── Screen reader announcement test (NVDA + VoiceOver minimum)
│   └── Visual check at 200% zoom
└── No → What changed?
    ├── Colors/styling → Contrast check + visual review
    ├── Interactive behavior → Keyboard + screen reader test
    ├── Content/text → Screen reader announcement check
    ├── Layout/order → Reading order + focus order test
    └── Dependencies updated → Regression scan (axe-core)

回归测试模式

CI 流水线无障碍门禁

1. axe-core 扫描：在每个 PR 上运行。发现新的严重 / 高严重性违规时失败。
2. 基线管理：在 .a11y-baseline.json 中存储已知问题。仅对新问题失败。
3. Lighthouse 分数阈值：设置最低无障碍分数（例如，90）。分数回退时失败。
4. 视觉回归：在 200% 缩放下截取屏幕截图。对比焦点指示器和布局变化。

防止回归

• 在现有组件测试中添加无障碍断言（参见 testing-accessibility.instructions.md）
• 在 E2E 测试套件中加入键盘导航
• 长期跟踪无障碍分数趋势（而不仅仅是通过 / 失败）

验收标准模板

用户故事

Given [context],
When [action by keyboard/mouse/screen reader],
Then [accessible outcome]:

- [ ] Component has an accessible name (via label, aria-label, or aria-labelledby)
- [ ] Component has the correct ARIA role
- [ ] Component is reachable and operable by keyboard (Tab, Enter, Space, Escape, Arrows as appropriate)
- [ ] Focus is visible when the component receives focus
- [ ] State changes are announced to screen readers (aria-expanded, aria-selected, aria-checked, etc.)
- [ ] Error messages are associated with their inputs (aria-describedby or aria-errormessage)
- [ ] Content is readable at 200% zoom without horizontal scrolling
- [ ] Color is not the only means of conveying information

常用测试工具

工具	类型	最适合
axe-core / @axe-core/cli	自动化	CI/CD 集成、广泛扫描违规
Lighthouse	自动化	性能 + 无障碍综合评分
WAVE	半自动化	无障碍功能 / 问题的可视化叠加层
Accessibility Insights	半自动化	FastPass（自动化）+ Assessment（引导式手动测试）
pa11y	自动化	CI/CD、HTML CodeSniffer 规则
jest-axe	单元测试	在 jest 中进行组件级 axe 扫描
cypress-axe	E2E 测试	在 Cypress 中进行页面级 axe 扫描
playwright + @axe-core/playwright	E2E 测试	在 Playwright 中进行页面级 axe 扫描

屏幕阅读器测试速查表

NVDA（Windows）

按键	操作
Insert + Space	切换焦点 / 浏览模式
Tab	移至下一个可聚焦元素
H	下一个标题
D	下一个地标
F	下一个表单字段
T	下一个表格
Insert + F7	元素列表（链接、标题、地标）

VoiceOver（macOS）

按键	操作
VO (Ctrl+Option) + Right	移至下一个元素
VO + Space	激活当前元素
VO + U	打开转子（按类型导航）
VO + Cmd + H	下一个标题