mcpField
W
web-testing

web-testing

github.com/mrgoonie测试与质量2.2k443 次安装30 周前更新
代码仓库

关于 web-testing

面向 Web 开发者的测试指南,覆盖单元、集成、端到端、负载、安全、视觉回归和无障碍测试。提供测试策略、工具示例及 CI/CD 检查流程。

主要功能

  1. 01单元与集成测试指南
  2. 02Playwright 端到端测试
  3. 03负载与安全测试参考
  4. 04视觉回归与无障碍检查
  5. 05CI/CD 测试门禁示例

适用场景

  1. 01验证函数、模块和 API
  2. 02检查登录或结账等关键流程
  3. 03发布前评估性能与安全
  4. 04发现界面回归和无障碍问题

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/mrgoonie/claudekit-skills --skill web-testing

安装后在 Claude Code 中输入/web-testing确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

references/
accessibility-testing.md
api-testing.md
component-testing.md
cross-browser-checklist.md
e2e-testing-playwright.md
functional-testing-checklist.md
interactive-testing-patterns.md
load-testing-k6.md
mobile-gesture-testing.md
performance-core-web-vitals.md
pre-release-checklist.md
security-checklists.md
security-testing-overview.md
shadow-dom-testing.md
test-flakiness-mitigation.md
testing-pyramid-strategy.md
unit-integration-testing.md
visual-regression.md
vulnerability-payloads.md

详细介绍

Web 测试技能

全面的 Web 测试:单元测试、集成测试、端到端测试、负载测试、安全测试、视觉回归测试、无障碍测试。

快速开始

npx vitest run                    # Unit tests
npx playwright test               # E2E tests
npx playwright test --ui          # E2E with UI
k6 run load-test.js               # Load tests
npx @axe-core/cli https://example.com  # Accessibility
npx lighthouse https://example.com     # Performance

测试金字塔(70-20-10)

层级比例框架速度
单元测试70%Vitest/Jest<50ms
集成测试20%Vitest + fixtures100-500ms
端到端测试10%Playwright5-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      # Gate 1: Fast fail
      - run: npm run test:e2e       # Gate 2: After unit pass
      - run: npm run test:a11y      # Accessibility
      - run: npx lhci autorun       # Performance

评论

支持 Markdown