Buddy Visual Tests

Buddy Visual Tests 比较渲染后的 UI 快照与已批准基线，帮助在合并前发现视觉回归。适用于 pipeline、GitHub Actions 和本地工作流，支持代码和无脚本采集。

AI测试与QA

访问网站

概述

Buddy Visual Tests 是一项视觉回归测试功能，用于捕获功能测试无法检测到的 UI 变更。它将应用的渲染快照与已批准基线进行比较，并突出显示差异以便审查，包括布局偏移、样式漂移、缺失元素以及响应式故障。

该产品面向希望在交付流水线中加入视觉检查、但又不想从头编写新的测试断言的团队。它可以在 Buddy Pipelines、GitHub Actions 或本地运行，Buddy 将该功能描述为 Preview 状态。

核心功能

基于像素的回归检测

采集渲染后的快照，并将其与已批准基线进行比较，从而在合并前暴露布局偏移、样式漂移、缺失元素和响应式故障。

基于套件的测试组织

围绕要渲染的内容和比较方式定义套件，包括浏览器与设备组合以及差异阈值。

按变体的基线

按浏览器和设备变体分别比较快照，而不只是按会话级别比较，因此可以分别审查移动端和桌面端结果。

基于批准的基线更新

审查差异并批准或拒绝已更改的快照；已批准的更改会成为该分支后续运行的新参考。

CI 和本地执行

在视觉更改经过审查前暂停 Buddy pipelines，或者在 Buddy 之外使用 GitHub Actions 和本地运行执行相同工作流。

多种采集路径

根据团队是否已有测试代码或希望进行无脚本测试，使用 URL 或 sitemap 采集、E2E 插件或 Storybook 上传。

适用场景

部署前的流水线质量闸门
当 UI 更改意外改变渲染时，使用 Visual Tests 阻止发布。批准操作可以让 Buddy pipeline 暂停，直到有人审查差异并批准或拒绝该会话。
对代理或开发者所做 UI 更改进行人工审查
对代理或开发者生成的 UI 更改执行视觉检查，并审查实际发生变化的像素。当某项更改在功能上可能是正确的，但仍引入视觉回归时，这会很有帮助。
用于线上页面的无脚本测试
当你不想在仓库中添加测试代码时，使用 URL 或 sitemap 采集。Buddy 可以直接从 URL 对线上页面进行快照，并将其与已批准基线进行比较。
现有测试和 Storybook 工作流
将 Visual Tests 接入现有的 Playwright、Cypress、Selenium 或 Puppeteer 工作流，或者上传 Storybook 构建，用于组件库和设计系统。
响应式与跨浏览器审查
比较按浏览器和设备区分的快照，以发现只会出现在移动端、平板或不同浏览器引擎中的问题。

Pros and Cons

Pros

能够捕捉功能测试可能遗漏的视觉问题，例如布局偏移或内容被隐藏/缺失。
支持多种输入路径，包括 E2E 插件、Storybook，以及 URL 或 sitemap 采集。
可与 Buddy Pipelines、GitHub Actions 和本地运行配合使用。
使用按分支感知的基线，因此在一个分支上的批准不会自动更改另一个分支的参考状态。
可在人工审查并批准会话之前暂停流水线。

Cons

该功能处于 Preview 状态，因此团队应将其视为尚未正式全面可用。
来源材料未说明 Visual Tests 的单独定价模型，只提到 Buddy 更广泛的定价方案以及 Preview 说明。

FAQ

如何设置 Visual Tests？

Visual Tests 以套件（suite）的形式设置。在 Buddy 中，你进入 TEST → Visual Tests，添加一个套件，并选择快照的采集方式：通过 E2E 测试插件、Storybook 上传，或无脚本的 URL/sitemap 采集。文档说明之后可以将该套件接入 Buddy Pipelines、GitHub Actions 或本地机器。

什么是视觉测试会话？

一次会话（session）就是一次视觉测试运行。它包含该次运行中采集到的快照，覆盖套件中启用的浏览器、系统和设备组合；如果发现差异，它会等待审查。

基线是如何确定的？

Visual Tests 会将每个快照与按快照及浏览器/设备变体解析出的基线进行比较。在功能分支上，第一次运行会与该分支祖先历史中的最新已批准基线进行比较；该分支上的后续运行则会与新批准的快照进行比较。

我可以在哪里运行 Visual Tests？

来源文档显示了 Buddy Pipelines 和 GitHub Actions，也说明 Visual Tests 可以在本地运行。首页还描述了一个基于 CLI 的工作流，使用 bdy 命令。

Visual Tests 是否有单独定价？

定价页面显示 Buddy 提供免费计划和付费计划，而 Visual Tests 页面说明 Visual Tests 在 Preview 期间是免费的。文档没有描述单独的 Visual Tests 定价或配额模型。

Quick Facts

类别: 视觉回归测试
平台: Buddy CI/CD；也支持 GitHub Actions 和本地运行
状态: Preview
主要用户: 发布 UI 更改的开发者和代理
来源域名: buddy.works
定价 संकेत: Preview 期间免费；Buddy 也提供免费和付费计划