用途:在完成 UI 修改后,对改动进行严格的视觉质量验证,确认是否真正达成预期目标。默认假设目标尚未达成,直到有明确视觉证据证明为止。
主要能力:
- 客观描述视觉证据,先陈述观察到的颜色、位置、尺寸与状态,不依赖代码推断。
- 目标验证:针对旋转、定位、尺寸、颜色等改动逐项核对,例如确认宽高比变化、坐标差异、尺寸变化、对比度数值。
- 反向验证:主动寻找改动失败的证据,质疑“看起来不同”是否等于“看起来正确”。
- 无障碍评估:检查颜色对比度是否符合 WCAG(普通文本 4.5:1,大文本 3:1)、焦点指示是否可见、文本缩放可读性、视觉层级。
- 设计系统合规:若配置了设计系统路径则按其规范核对颜色、字体、间距、组件、状态、圆角与阴影;未配置时仅使用通用设计原则。
使用方式:通过配置项 toolbox.build_task.design_system_path 读取设计系统文件;使用浏览器工具 browser_snapshot 获取元素引用、browser_screenshot 截取目标区域,再对照目标分析截图。输出结构化验证报告,包含观察状态、目标评估表、无障碍检查、设计系统合规表、结论(达成/部分达成/未达成)、问题与建议。
适用场景:按钮对比度验证、模态遮罩是否阻断背景交互、错误提示样式是否符合设计系统、响应式导航在移动断点是否折叠、深色主题视觉层级等。
限制:判断仅基于视觉证据,不采信代码提示;资料未提供具体安装命令、收费方式、支持平台与运行环境等信息。