npx claudepluginhub an8079/take-skills# /qa - 自动化测试与修复 对 Web 应用进行系统性 QA 测试,找到 bug 后修复代码并原子提交,最后重新验证。生成带证据的结构化报告。 ## 使用方式 ## 测试层级 | 层级 | 覆盖范围 | |------|---------| | Quick | Critical + High 严重级别 | | Standard | + Medium 严重级别(默认) | | Exhaustive | + Low / Cosmetic 严重级别 | --- ## Phase 1: 初始化 **检测项目运行时:** **检测测试框架:** **创建输出目录:** --- ## Phase 2: 目标 URL **优先从用户请求中解析 URL:** - 用户提供了 URL → 直接使用 - 用户未提供 URL → 检查本地端口(`localhost:3000/4000/8080`) - 无法检测 → 询问用户 **检查 git 分支(diff-aware 模式):** 如果提供了 URL 但在特性分支上,优先测试受分支变更影响的页面。 --- ## Phase 3: 探索 ### Orient - 应用地图 1. 访问目标 URL 2. 获取导航结构(`links` 或 `snapshot -i`) 3. 检查控制台错误...
对 Web 应用进行系统性 QA 测试,找到 bug 后修复代码并原子提交,最后重新验证。生成带证据的结构化报告。
/qa # 标准 QA 测试
/qa https://example.com # 测试指定 URL
/qa --quick # 快速冒烟测试(30秒)
/qa --exhaustive # 穷举测试(包含 low/cosmetic)
| 层级 | 覆盖范围 |
|---|---|
| Quick | Critical + High 严重级别 |
| Standard | + Medium 严重级别(默认) |
| Exhaustive | + Low / Cosmetic 严重级别 |
检测项目运行时:
[ -f package.json ] && echo "RUNTIME:node"
[ -f Gemfile ] && echo "RUNTIME:ruby"
[ -f requirements.txt ] || [ -f pyproject.toml ] && echo "RUNTIME:python"
[ -f go.mod ] && echo "RUNTIME:go"
[ -f Cargo.toml ] && echo "RUNTIME:rust"
检测测试框架:
ls jest.config.* vitest.config.* playwright.config.* .rspec pytest.ini pyproject.toml phpunit.xml 2>/dev/null
ls -d test/ tests/ spec/ __tests__/ cypress/ e2e/ 2>/dev/null
创建输出目录:
mkdir -p .claude-studio/qa-reports/screenshots
优先从用户请求中解析 URL:
localhost:3000/4000/8080)检查 git 分支(diff-aware 模式):
git branch --show-current
git diff main...HEAD --name-only
git log main..HEAD --oneline
如果提供了 URL 但在特性分支上,优先测试受分支变更影响的页面。
links 或 snapshot -i)__next → Next.jscsrf-token → Railswp-content → WordPress每个页面:
screenshot)console --errors)优先级: 核心功能(首页、仪表盘、结账、搜索)多花时间,次要页面(关于页、条款页)少花时间。
仅访问首页 + 顶部 5 个导航目标。检查:页面加载?控制台错误?可见的失效链接?无详细问题文档。
每个问题立即记录,不要批量。
截图证据要求:
使用 Read 工具展示截图给用户。
计算各类别分数(0-100),取加权平均。
| 类别 | 权重 |
|---|---|
| Console | 15% |
| Links | 10% |
| Visual | 10% |
| Functional | 20% |
| UX | 15% |
| Performance | 10% |
| Content | 5% |
| Accessibility | 15% |
每类初始 100 分,按问题扣减:
最终分数: score = Σ (category_score × weight)
按严重程度排序,从最高开始修复。
6a. 定位源码
grep -r "错误信息" src/
glob "**/*组件名*"
6b. 修复
6c. 原子提交
git add <仅改动的文件>
git commit -m "fix(qa): ISSUE-NNN — 简短描述"
6d. 重新测试
snapshot -D 验证修复效果6e. 分类
git revert HEAD → 标记为 deferred写入 .claude-studio/qa-reports/qa-report-{domain}-{YYYY-MM-DD}.md
# QA Report: {APP_NAME}
| Field | Value |
|-------|-------|
| **Date** | {DATE} |
| **URL** | {URL} |
| **Branch** | {BRANCH} |
| **Health Score** | {SCORE}/100 |
| **Issues Found** | {N} |
| **Fixes Applied** | {M} |
## Top 3 Things to Fix
1. **{ISSUE-NNN}**: {title} — {一句话描述}
2. **{ISSUE-NNN}**: {title} — {一句话描述}
3. **{ISSUE-NNN}**: {title} — {一句话描述}
## Console Health
| Error | Count | First seen |
|-------|-------|------------|
| {error} | {N} | {URL} |
## Summary
| Severity | Count |
|----------|-------|
| Critical | 0 |
| High | 0 |
| Medium | 0 |
| Low | 0 |
| **Total** | **0** |
## Issues
### ISSUE-001: {Short title}
| Field | Value |
|-------|-------|
| **Severity** | critical / high / medium / low |
| **Category** | visual / functional / ux / content / performance / console / accessibility |
| **URL** | {page URL} |
**Description:** {What's wrong, expected vs actual.}
**Repro Steps:**
1. Navigate to {URL}

2. {Action}

3. **Observe:** {what goes wrong}

## Fixes Applied
| Issue | Fix Status | Commit | Files Changed |
|-------|-----------|--------|---------------|
| ISSUE-NNN | verified / best-effort / reverted / deferred | {SHA} | {files} |
### Before/After
#### ISSUE-NNN: {title}
**Before:** 
**After:** 
| 级别 | 定义 | 示例 |
|---|---|---|
| Critical | 阻断核心流程、数据丢失或崩溃 | 表单提交报错页、结账流程断裂 |
| High | 主要功能损坏且无 workaround | 搜索返回错误结果、文件上传静默失败 |
| Medium | 功能可用但有明显问题 | 加载慢(>5s)、表单验证缺失 |
| Low | 轻微的 cosmetic 问题 | 页脚错字、1px 对齐问题 |
布局断裂、图片失效、字体/颜色不一致、动画故障、对齐问题
失效链接、死按钮、表单验证缺陷、重定向错误、状态不持久、搜索结果错误
导航困惑、缺少加载指示器、交互慢(>500ms 无反馈)、错误信息不清晰
错字语法错误、过时文本、占位符文本残留、标签错误
页面加载慢(>3s)、滚动卡顿、布局偏移(CLS)、大图未优化
JavaScript 异常、请求失败(4xx/5xx)、CORS 错误、混合内容警告
图片缺 alt 文本、表单无标签、键盘导航断裂、颜色对比度不足
[REDACTED]