用途:用于检测 UI 视觉回归、验证界面改动,弥补功能测试无法发现布局错位、颜色变化、字体渲染、对齐、图片缺失、内容溢出等视觉缺陷。
主要能力:截图基线与新截图对比;支持像素差异、结构相似度、AI 语义三类对比算法;屏蔽动态内容(时间戳、广告、用户计数、头像);跨桌面、平板、手机视口与多浏览器测试;通过 AI 对比减少抗锯齿等噪声导致的误报;生成视觉差异报告。
使用方式:首次运行建立基线截图,后续运行与基线比对,审查并批准有意改动、回归即失败。Playwright 示例中用 expect(page).toHaveScreenshot('homepage.png') 截图对比,用 page.setViewportSize 切换视口,用 mask 参数屏蔽动态元素;也可配合 @percy/playwright 的 percySnapshot 做 AI 对比,可指定 scope 只截取某个组件。配置项包括 maxDiffPixels、maxDiffPixelRatio、threshold、animations、caret。还可通过智能体任务按页面、设备、浏览器矩阵批量执行,结果返回比较数、差异数与报告文件,并可结合 FleetManager 协调 qe-visual-tester、qe-test-executor、qe-quality-gate 等角色,记忆命名空间为 aqe/visual-testing/。
适用场景:UI 组件改动、CSS/样式修改、响应式设计验证、跨浏览器一致性检查,以及 CI/CD 中的视觉回归拦截。
限制:资料未提供具体价格、平台范围或性能数据,需自行确认;AI 对比工具需额外接入;仅靠自动批准可能漏掉真实回归,应人工审查差异。