用途:用于 Langflow 的前端可访问性检查,适用于 src/frontend 下涉及 UI 组件、页面、路由、对话框、抽屉、弹出层、下拉菜单、标签页、折叠面板、表格、表单、导航或画布控件的改动,以及 ARIA、标签、角色、焦点管理、Tab 顺序、键盘交互、禁用/加载/错误状态等场景。可配合 frontend-testing(Jest/RTL)、e2e-testing(Playwright)、frontend-i18n、ibm-a11y-automation、ibm-a11y-level1-audit 使用。
主要能力:要求同时运行两套引擎,axe-core 用于 Jest jsdom 快速检查对比度、标签、角色与基础 ARIA;IBM Equal Access 更严格,检查 ARIA 结构与键盘语义,可通过 Playwright 的 page.runA11yScan(label) 扫描活动 DOM(含打开的弹窗、菜单、选中/编辑状态),或用 scripts/a11y/a11y_scan.py 扫描默认加载页面。检查遵循 POUR:文本对比度≥4.5:1、非文本≥3:1;键盘可达可操作、焦点可见、顺序合理、无键盘陷阱、禁用控件不在 Tab 顺序;输入有程序化标签且可见标签与可访问名称一致;交互元素具有正确角色、名称与状态。
使用方式:Jest 侧用 axe(container) 断言无违规;Playwright 侧在 tests/a11y/<feature>.a11y.spec.ts 中调用 page.runA11yScan。运行命令:cd src/frontend 后执行 RUN_A11Y=true RUN_A11Y_ASSERT=true npx playwright test tests/a11y/<feature>.a11y.spec.ts --project=chromium --workers=5;Python 扫描器需先执行 uv run --with playwright playwright install chromium,再运行 uv run --with playwright python scripts/a11y/a11y_scan.py --url http://localhost:3000 --routes /settings/<route> --out /tmp/a11y.json --markdown /tmp/a11y.md --timeout-ms 45000。仅 RUN_A11Y=true 时扫描为信息性,加 RUN_A11Y_ASSERT=true 才会因新违规失败。已知框架级问题可通过 tests/a11y/baselines 下的基线记录为技术债务。
限制:修改共享组件后需重新扫描所有使用该组件的页面;表格/树/列表/菜单等复合控件必须用 IBM 扫描;jsdom 下 axe 禁用颜色对比检查;基线按 DOM 路径精确匹配,可能因其他 <body> 级 portal(如 toast)而失效。