SmartUI 视觉回归测试

要解决什么问题

前端改样式、动布局或升级组件库时，肉眼很难覆盖所有页面与断点；漏掉的像素级差异往往在上线后才暴露。SmartUI 视觉回归把「截图 → 对比 → 人审」串成可重复流程，而不是每次发版临时补几张图。

技能如何工作

技能围绕 LambdaTest SmartUI 与常见自动化栈组织说明，核心模式包括：

• Playwright + SmartUI SDK 与 Selenium + SmartUI，在真实浏览器里抓图并上传对比
• CLI：通过 smartui.config.json 定义要测的 URL、视口与执行命令，用 smartui exec 包一层跑测试
• Storybook：对组件故事做隔离截图，减少整页噪声

典型 审批工作流 是：首次运行生成基准截图；之后每次运行与基准比对；差异在 SmartUI 仪表板高亮；团队在仪表板里批准或拒绝；已批准结果成为新基准。云侧需配置 PROJECT_TOKEN（CLI）或 LT_USERNAME / LT_ACCESS_KEY（Selenium 云）。

适用边界与注意点

| 不好的做法 | 更稳妥的做法 |
|----------|--------------|
| 无视口 | 配置多个视口，覆盖响应式 |
| 不等待渲染 | 使用 waitForPageRender 等，避免截到半成品 |
| 全站全量截图 | 聚焦关键页面或组件 |
| 跳过审批 | 在仪表板审查差异，避免误把回归当基准 |

高级 CI/CD、调试与 playbook 细节见技能内 reference/playbook.md，本介绍不展开安装与命令清单。