name: Web测试 description: 使用Playwright、Vitest、k6进行Web测试。端到端/单元/集成/负载/安全/视觉/可访问性测试。用于测试自动化、减少不稳定性、核心Web指标、移动手势、跨浏览器测试。 license: Apache-2.0 version: 2.0.0

Web测试技能

全面的Web测试：单元测试、集成测试、端到端测试、负载测试、安全测试、视觉回归测试、可访问性测试。

快速开始

npx vitest run                    # 单元测试
npx playwright test               # 端到端测试
npx playwright test --ui          # 带UI的端到端测试
k6 run load-test.js               # 负载测试
npx @axe-core/cli https://example.com  # 可访问性测试
npx lighthouse https://example.com     # 性能测试

测试金字塔（70-20-10）

层级	比例	框架	速度
单元	70%	Vitest/Jest	<50ms
集成	20%	Vitest + 固定装置	100-500ms
端到端	10%	Playwright	5-30s

使用场景

单元测试：函数、实用工具、状态逻辑
集成测试：API端点、数据库操作、模块
端到端测试：关键流程（登录、结账、支付）
负载测试：发布前性能验证
安全测试：部署前漏洞扫描
视觉测试：UI回归检测

参考文档

核心测试

./references/unit-integration-testing.md - 单元/集成测试模式
./references/e2e-testing-playwright.md - Playwright端到端工作流
./references/component-testing.md - React/Vue/Angular组件测试
./references/testing-pyramid-strategy.md - 测试比例、优先级矩阵

跨浏览器与移动端

./references/cross-browser-checklist.md - 浏览器/设备矩阵
./references/mobile-gesture-testing.md - 触摸、滑动、方向
./references/shadow-dom-testing.md - Web组件测试

交互与表单

./references/interactive-testing-patterns.md - 表单、键盘、拖放
./references/functional-testing-checklist.md - 功能测试

性能与质量

./references/performance-core-web-vitals.md - LCP/CLS/INP、Lighthouse CI
./references/visual-regression.md - 截图比较
./references/test-flakiness-mitigation.md - 稳定性策略

可访问性

./references/accessibility-testing.md - WCAG清单、axe-core

安全测试

./references/security-testing-overview.md - OWASP Top 10、工具
./references/security-checklists.md - 认证、API、头部
./references/vulnerability-payloads.md - SQL/XSS/CSRF负载

API与负载

./references/api-testing.md - API测试模式
./references/load-testing-k6.md - k6负载测试模式

清单

./references/pre-release-checklist.md - 完整发布清单

CI/CD集成

jobs:
  test:
    steps:
      - run: npm run test:unit      # 门控1：快速失败
      - run: npm run test:e2e       # 门控2：单元测试通过后
      - run: npm run test:a11y      # 可访问性测试
      - run: npx lhci autorun       # 性能测试