SuperAPI AI 工具集

accessibility-audit

测试与质量

查看项目

更新于 10-16 05:50

技能介绍

用途:审计前端代码的无障碍(a11y)合规性,适用于需要检查 WCAG、键盘导航与屏幕阅读器问题的场景。当用户要求“check accessibility”“audit a11y”“check WCAG”等时使用。

主要能力与流程:

  1. 从 package.json 检测框架(React、Vue、Svelte)。
  2. 静态分析:对 JSX/TSX/HTML 文件进行 grep 检查,覆盖缺失 img 的 alt、图标按钮缺少 aria-label、无 label 的输入、非语义交互元素(如 div/span 上的 onClick)、label 缺少 htmlFor/for、标题层级跳跃(h1 → h3)、缺少地标角色(main、nav、header)等违规。
  3. 若开发服务器正在运行,可选运行 axe-core CLI:npx @axe-core/cli@4 http://localhost:3000。
  4. 按严重程度分组报告发现的问题,并给出修复建议。

输出格式:按 WCAG 标准分组——Critical(WCAG A,阻碍辅助技术用户)、Serious(WCAG AA,显著影响可用性)、Suggestions(最佳实践改进)。使用 file:line 引用,并为每个发现附上修复方式。

规则:报告 file:line + 违规 + WCAG 标准 + 建议修复;从不自动修复,始终说明要改什么及原因;优先处理键盘导航和屏幕阅读器问题。

错误处理:若 axe-core CLI 失败(无运行中的开发服务器),则仅回退到静态分析,并注明 axe 扫描被跳过;若未找到 JSX/HTML 文件,报告项目结构不兼容并停止;若框架未检测到,则扫描所有 .html、.jsx、.tsx、.vue 文件。

限制:该技能只做静态分析与可选 axe 扫描,不自动修改代码;依赖可读的前端源文件与开发服务器(若需 axe 扫描)。其他收费、平台与效果信息暂未提供。