用途
testing-ui 用于浏览器端的 UI 测试，围绕 Playwright、Puppeteer、Cypress 以及无障碍审计工具展开，覆盖浏览器自动化、视觉回归、截图和可访问性审计等场景。
主要能力
- 浏览器自动化测试：使用 Playwright 运行测试，可指定测试文件、浏览器项目（chromium、firefox、webkit）、有头模式与调试检查器。
- 测试生成：通过 Playwright codegen 从 URL 录制交互并生成测试代码，可指定输出文件与视口尺寸。
- 截图：对 URL 进行整页截图，并支持指定视口尺寸。
- 视觉回归：通过 Playwright 的快照比对（--update-snapshots、toHaveScreenshot）进行视觉回归，并可用 show-report 查看视觉差异报告。
- Cypress 测试：支持交互式运行器、无头运行、指定 spec 文件与指定浏览器。
- 无障碍审计：使用 axe-core CLI 对 URL 进行审计，可按 wcag2a、wcag2aa 等规则筛选；也可结合 @axe-core/playwright 在 Playwright 测试中执行无障碍检查。
使用方式
安装 Playwright 与浏览器：
npm init playwright@latest
npx playwright install --with-deps
仅安装指定浏览器：
npx playwright install chromium
运行 Playwright 测试：
npx playwright test
npx playwright test tests/login.spec.ts
npx playwright test --headed
npx playwright test --project=chromium
npx playwright test --project=firefox
npx playwright test --project=webkit
npx playwright test --debug
从 URL 生成测试：
npx playwright codegen https://example.com
npx playwright codegen --output tests/generated.spec.ts https://example.com
npx playwright codegen --viewport-size=1280,720 https://example.com
页面截图：
npx playwright screenshot --full-page https://example.com screenshot.png
npx playwright screenshot --viewport-size=1280,720 https://example.com screenshot.png
视觉回归：
npx playwright test --update-snapshots
npx playwright test tests/visual.spec.ts
npx playwright show-report
运行 Cypress 测试：
npx cypress open
npx cypress run
npx cypress run --spec cypress/e2e/login.cy.ts
npx cypress run --browser chrome
使用 axe-core 进行无障碍审计：
npm install -g @axe-core/cli
npx @axe-core/cli https://example.com
npx @axe-core/cli https://example.com --rules wcag2a,wcag2aa
npx playwright test tests/accessibility.spec.ts
适用场景
- 需要对 Web 界面进行端到端自动化测试。
- 需要跨 Chromium、Firefox、WebKit 等浏览器验证 UI 行为。
- 需要从现有页面快速录制并生成测试脚本。
- 需要做页面截图与视觉回归比对。
- 需要按 WCAG 规则执行无障碍审计。
限制
资料未提供 Puppeteer 的具体命令与用法细节，也未说明各工具的版本要求、运行环境依赖、收费情况或性能表现，这些内容暂未提供。