Playwright 视觉测试
import { test, expect } from '@playwright/test';
test('首页视觉回归', async ({ page }) => {
await page.goto('/');
await page.waitForLoadState('networkidle');
// 全页截图对比
await expect(page).toHaveScreenshot('homepage.png', {
fullPage: true,
threshold: 0.2, // 允许 0.2% 像素差异
maxDiffPixels: 100,
});
});
test('按钮各状态', async ({ page }) => {
await page.goto('/components');
const button = page.getByRole('button', { name: '提交' });
await expect(button).toHaveScreenshot('button-default.png');
await button.hover();
await expect(button).toHaveScreenshot('button-hover.png');
});
# 更新基准截图
npx playwright test --update-snapshots