Playwright

项目概览

Playwright 是微软开源的 Web 自动化与测试框架，核心卖点是用同一套 API 驱动 Chromium、Firefox 和 WebKit 三大浏览器内核。它既可作为端到端测试运行器，也可作为浏览器自动化库，还提供面向 AI Agent 的 CLI 与 MCP 服务。

主要形态

测试能力亮点

自动等待与 web-first 断言

无需人为设置超时，框架会等待元素可操作，断言也会自动重试直到条件满足。

语义化定位器

定位方式贴近用户视角，比 CSS/XPath 更稳定：

page.getByRole('button', { name: 'Submit' })
page.getByLabel('Email')
page.getByPlaceholder('Search...')
page.getByTestId('login-form')

测试隔离与登录态复用

每个测试运行在独立的浏览器上下文中，相当于全新的浏览器配置；登录状态可保存后跨用例复用：

await page.context().storageState({ path: 'auth.json' });
test.use({ storageState: 'auth.json' });

Trace 回放

失败时记录执行轨迹、截图与视频，可在 Trace Viewer 中逐帧查看操作、DOM 快照、网络请求与控制台输出：

export default defineConfig({
  use: { trace: 'on-first-retry' },
});

npx playwright show-trace trace.zip

面向 AI Agent 的两种入口

• Playwright CLI：命令行式浏览器自动化，比 MCP 更省 token，避免把庞大的工具 schema 与可访问性树塞进上下文；支持 playwright-cli show 查看所有会话的实时画面。
• Playwright MCP：通过 Model Context Protocol 让 Agent 以结构化可访问性快照操作页面，无需视觉模型或截图，元素引用如 e5、e10 可确定性地点击与输入。

作为库使用

不依赖测试运行器时，可直接用 playwright 包做截图、PDF 导出、网页采集等：

import { chromium } from 'playwright';

const browser = await chromium.launch();
const page = await browser.newPage();
await page.goto('https://playwright.dev/');
await page.screenshot({ path: 'screenshot.png' });
await browser.close();

使用建议

• 首次安装需下载浏览器二进制，CI 中建议缓存 ~/.cache/ms-playwright。
• 优先使用语义化定位器，减少对 DOM 结构的依赖。
• 在 CI 中开启 trace 与失败重试，便于排查偶发失败。
• 需要跨语言时注意官方绑定以 Node.js/TypeScript 为主，其他语言生态相对滞后。