用途:对 UI 源码做静态代码分析(非截图),检查 UI 质量、无障碍违规与性能反模式,输出带文件与行号的发现项,并给出修复建议。可与基于截图的工具(visual-validator、ui-ux-designer)互补。
输入:path(要审计的文件或目录,默认 src/ 或 app/)、tech_stack(来自配置,如 ["react","rails"])、focus(可选:accessibility、performance、all)。
主要能力:先检测技术栈,再加载规则(始终读取 resources/generic-rules.md;若含 react 读取 resources/react-rules.md,若含 rails 读取 resources/rails-rules.md)。随后查找 UI 文件,例如 React/JS 用 find . -name ".tsx" -o -name ".jsx" | head -100,Rails 用 find . -name ".erb" -o -name ".html.erb" | head -100,CSS/Tailwind 用 find . -name ".css" -name ".scss" | head -50。逐文件读取内容、套用规则,记录文件路径与行号、严重级别(Critical、Serious、Moderate、Minor)、问题描述、WCAG 引用(如适用)与修复建议。
输出:生成 UI Code Audit Summary,给出 Verdict: PASS 或 FAIL,以及文件数、各级别问题计数;Critical 大于 0 即 FAIL。报告按 Critical、Serious、Moderate 分级列出表格(File:Line、Issue、WCAG、Fix),并附 Recommendations。严重级别定义:Critical 阻断无障碍(键盘/屏幕阅读器不可用)导致 FAIL;Serious 显著降低辅助技术用户体验,为警告;Moderate 违反最佳实践、影响较小,为警告;Minor 打磨机会、无功能影响,为信息。
WCAG 速查覆盖:1.1.1 非文本内容(缺 alt)、1.3.1 信息与关系(缺表单标签)、2.1.1 键盘(仅点击处理)、2.1.2 无键盘陷阱(模态无退出)、2.4.3 焦点顺序(tabindex > 0)、2.4.7 焦点可见(outline: none)、2.5.5 目标尺寸(触控目标 < 44px)、4.1.2 名称角色值(缺 ARIA)。
质量门集成:被 quality-gate 调用时返回 Verdict: PASS 或 Verdict: FAIL,存在 Critical 即 FAIL,并包含汇总计数供聚合。
边界情况:无 UI 文件时返回 PASS 并提示“No UI files to audit”;tech_stack 未配置时仅用通用规则;栈规则加载失败时记录警告并继续用通用规则;文件无法解析时跳过并在报告中注明;多个 tech_stack 时分别加载规则、合并发现并去重。
限制:资料未提供安装命令、收费与价格、支持平台、运行环境要求及具体性能指标,暂未提供。