# Buddy Visual Tests 在 CI/CD 中捕获渲染后的界面，与已批准基线进行视觉回归对比并审核变更，支持无脚本 URL、E2E 测试和 Storybook 构建。 - Findings24: - 网站: - 价格: Freemium - 分类: 商业软件 ## 什么是 Buddy Visual Tests？ Buddy Visual Tests 是一项视觉回归测试功能，可捕获渲染后的网页界面，并将每个快照与已批准的基线进行比较。它关注浏览器中的实际输出，而不是底层代码，有助于识别功能断言可能无法发现的布局偏移、样式变化、元素缺失和响应式显示问题。 测试按套件组织，用于定义要渲染的内容以及比较方式。每次运行都会创建一个包含其快照的会话。审阅者可以查看突出显示的差异，并批准或拒绝变更；获批准的快照会成为后续会话的参考。该功能支持无脚本的 URL 或站点地图捕获、现有 E2E 测试和 Storybook 构建，也可以放入 CI/CD 流程中作为审核门禁。 Visual Tests 目前处于预览阶段。产品页面说明，它可以在 Buddy CI/CD、GitHub Actions 或本地运行，并且在预览期间免费。 ## Buddy Visual Tests 能做什么？ ### 渲染像素对比 捕获浏览器中渲染的界面，并显示标出差异的基线图像和当前图像，帮助发现布局移动、样式变化、元素缺失和响应式问题。 ### 无脚本和 E2E 捕获模式 无需添加测试套件，即可从 URL 或站点地图捕获页面；也可以连接 Playwright、Cypress、Selenium 或 Puppeteer 运行。Storybook 提供专用操作。 ### 浏览器和设备变体 套件可以定义浏览器、系统和设备分辨率。每个变体都有自己的基线，因此移动端特有的变更会与桌面端输出独立比较。 ### 分支感知的基线和会话 每个分支都可以与自己的已批准基线进行比较。会话会保留一次运行中的快照，获批准的变更会成为后续比较的参考。 ### 审阅和流水线批准 审阅者可以批准或拒绝视觉变更，而“批准 Visual Tests 会话”操作会暂停 Buddy 流水线，直到审阅完成。被拒绝的变更会停止流水线。 ### 身份验证和动态页面支持 对于需要登录的页面，套件设置可以提供请求标头、Cookie 或本地存储值。差异阈值以及 CSS 或 XPath 选择器可以将有意变化的区域排除在比较之外。 ## 使用场景 ### 审阅代理或开发者生成的界面变更 对每项变更运行视觉检查，在合并或部署变更前向审阅者提供像素级差异，为人工编写和代理编写的更新提供共同检查点。 ### 无需测试代码即可测试营销和内容页面 将 CLI 指向 URL 或站点地图，以捕获可能没有传统端到端断言的页面，例如价格、注册或其他面向公众的页面。 ### 为从预发布环境到生产环境的发布设置门禁 在 Buddy 流水线中捕获预发布应用，添加批准操作，并仅在视觉会话完成审阅后允许继续部署到生产环境。 ### 检查响应式组件库 在配置的浏览器和设备分辨率下运行 Storybook 或基于浏览器的检查，以检测仅在移动端、平板电脑或特定浏览器中出现的变更。 ### 验证需要身份验证的应用界面 通过请求标头、Cookie 或本地存储提供适用的测试身份验证数据，或让 E2E 测试建立登录状态后再获取快照。 ## 常见问题 ### Buddy Visual Tests 是否需要测试套件或测试代码？ 不一定。无脚本测试可以通过 Buddy CLI 捕获 URL 或站点地图。你也可以封装现有的 Playwright、Cypress、Selenium 或 Puppeteer 运行，或使用专用的 Storybook 工作流。 ### 如何审阅视觉变更？ 每次运行都会创建一个包含其快照的会话。发现变更后，系统会显示基线渲染和当前渲染，并突出显示差异。审阅者可以批准变更，使其成为新的参考，也可以拒绝变更。 ### 视觉审阅可以阻止部署吗？ 可以。在 Buddy Pipelines 中，将“批准 Visual Tests 会话”操作添加到创建会话的操作之后。流水线会等待审阅；批准后继续，拒绝则停止。 ### 如何测试需要身份验证的页面？ 套件设置支持请求标头、Cookie 和本地存储值，也可以按快照指定。对于 E2E 会话，测试可以执行登录，捕获快照时会使用浏览器状态。建议使用权限最小化的专用测试凭据。 ### Buddy Visual Tests 是否已正式发布，费用是多少？ 产品文档和页面显示，Visual Tests 目前处于预览阶段。产品页面称预览期间免费；预览结束后的可用性和定价可能会发生变化。 ## 快速信息 - **类别**: 视觉回归测试 - **提供商**: Buddy - **执行方式**: Buddy CI/CD、GitHub Actions 或本地 CLI - **输入模式**: URL 或站点地图、E2E 运行和 Storybook 构建 - **当前状态**: 预览中 - **审阅模式**: 支持批准和拒绝的快照会话