创建免费账号
Vision SDK抢先体验

您的 Playwright 测试，由 Delta-QA 校验。每个要校验的页面只需一行。

@delta-qa/vision 会把您的 Playwright 测试检查的每个页面发送给 Delta-QA。Delta-QA 将其与基准逐元素比较，告诉您哪个元素发生了变化。用代码编写的回归测试和无需代码录制的场景位于同一工作区：同样的基准，同样的审阅，同样的报告。

申请使用 Vision创建免费账号

Vision SDK 首先以抢先体验方式提供：联系我们，即可在您的 Playwright 测试中使用。

在测试中只需三步

  1. 创建 API 密钥：在 Delta-QA 工作区中创建，并存入 CI 的密钥变量。SDK 从 DELTAQA_API_KEY 读取；工作区即密钥所属的工作区。
  2. 添加一个 check：在测试需要校验页面的位置写 vision.check("Payment")。它的名称将其与基准对应。
  3. 推送。首次运行时，每个测试都是“新建”：第一张截图成为基准。第二次运行时，如果网站未变，不会报告任何差异。
import { test } from "@playwright/test";
import { Vision } from "@delta-qa/vision";

const vision = new Vision(); // reads DELTAQA_API_KEY

test("Checkout", async ({ page }) => {
  await vision.open(page, { id: "checkout", name: "Checkout" });
  await page.goto("https://shop.example.com/checkout");
  await vision.check("Payment");
  await vision.close(); // fails the test on an unreviewed difference
});

SDK 只提供 Delta-QA 实际应用的设置：不会接受任何无效设置。标签和参考标签是可选的；未提供时，SDK 会自动推断。

逐元素比较，而不是像素

每次检查，SDK 都会发送页面（HTML 和视口）以及浏览器加载的资源。Delta-QA 重新打开页面，并像场景步骤一样将其元素与基准的元素比较：报告会告诉您哪个元素发生了变化，例如“支付”按钮由蓝变绿，而不是一块像素区域。

尚未审阅的差异会使 Playwright 测试失败，CI 日志会给出批次链接。您打开该步骤，阅读报告并做出判断：“预期行为”或“Bug”。

每个资源都按其哈希值识别：工作区已有的资源不会再次发送。套件第二次运行时，若网站未变化，只会发送 HTML 和哈希值。

每个分支一份基准，不自动合并

  • 标签自动推断，来自您的 git 分支或 CI，参考标签则取自 PR 的目标分支，否则为 main。新分支从首次运行起就与 main 比较，批次会显示“与 main 比较”。
  • “预期行为”作用于您勾选的标签，默认仅限“此标签”：其他分支不会看到任何变化。
  • 测试的历史可按环境和标签筛选；任何一次扫描都可以设为基准，作用于您勾选的标签。
  • 同一次 CI 运行的测试组成一个批次，由并行运行的多台机器共享；批次列表的呈现方式与您的 CI 一致。

借助 AI 智能体创建场景：MCP 服务器

关于 Vision SDK 的问题

Vision SDK 支持哪些框架？
支持 TypeScript 和 JavaScript 的 Playwright，运行于 Chromium。Cypress、WebdriverIO、Firefox 和 WebKit 将陆续支持。您无需代码录制的场景在同一个 Delta-QA 工作区中校验。
需要重写我的 Playwright 测试吗？
不需要：只需在要校验页面的位置添加一个 check，测试的其余部分保持不变。check 的名称将其与基准对应：同一测试中出现两个同名 check 时，运行会失败并指出重复项。
SDK 会发送哪些数据？
被测页面（HTML、视口）以及浏览器加载的资源，视频和音频除外。这些数据仅用于比较，并保留在您的工作区中。请勿在含个人数据的生产环境上测试：这一选择由您决定。
我无需代码的场景会有变化吗？
不会：录制、回放和报告保持不变。现在，场景可以在某个标签下运行，“预期行为”作用于您勾选的标签。
可以在其他语言中使用吗？
SDK 将使用 TypeScript 和 JavaScript。如果用户有需求，将增加其他语言。

让 Delta-QA 校验您的 Playwright 测试

如需使用 Vision，请联系我们：它首先以抢先体验方式提供。告诉我们您想校验哪些测试，我们会为您开通访问。

申请使用 Vision创建免费账号