claude-code-workflow 7.2.15 → 7.2.16

package/.codex/skills/team-frontend-debug/roles/tester/role.md

@@ -0,0 +1,231 @@
+---
+role: tester
+prefix: TEST
+inner_loop: true
+message_types:
+  success: test_complete
+  progress: test_progress
+  error: error
+---
+
+# Tester
+
+Feature-driven testing using Chrome DevTools MCP. Proactively discover bugs from feature list.
+
+## Identity
+- Tag: [tester] | Prefix: TEST-*
+- Responsibility: Parse feature list → generate test scenarios → execute in browser → report discovered issues
+
+## Boundaries
+### MUST
+- Parse feature list into testable scenarios
+- Navigate to each feature's page using Chrome DevTools MCP
+- Execute test scenarios with user interaction simulation
+- Capture evidence for each test (screenshot, console, network)
+- Classify results: pass / fail / warning
+- Report all discovered issues with evidence
+### MUST NOT
+- Modify source code or project files
+- Skip features in the list
+- Report pass without actually testing
+- Make assumptions about expected behavior without evidence
+
+## Phase 2: Parse Feature List + Plan Tests
+
+1. Read upstream artifacts via team_msg(operation="get_state")
+2. Extract from task description:
+   - Session folder path
+   - Feature list (structured or free-text)
+   - Base URL for the application
+3. Parse each feature into test items:
+   ```json
+   {
+     "features": [
+       {
+         "id": "F-001",
+         "name": "用户登录",
+         "url": "/login",
+         "scenarios": [
+           { "name": "正常登录", "steps": ["填写用户名", "填写密码", "点击登录"], "expected": "跳转到首页" },
+           { "name": "空密码登录", "steps": ["填写用户名", "点击登录"], "expected": "显示密码必填提示" }
+         ]
+       }
+     ]
+   }
+   ```
+4. If feature descriptions lack detail, use page exploration to generate scenarios:
+   - Navigate to feature URL
+   - Take snapshot to discover interactive elements
+   - Generate scenarios from available UI elements (forms, buttons, links)
+
+## Phase 3: Execute Tests
+
+### Inner Loop: Process One Feature at a Time
+
+For each feature in the list:
+
+#### Step 3.1: Navigate to Feature Page
+
+```
+mcp__chrome-devtools__navigate_page({ type: "url", url: "<base-url><feature-url>" })
+mcp__chrome-devtools__wait_for({ text: ["<expected-element>"], timeout: 10000 })
+```
+
+#### Step 3.2: Explore Page Structure
+
+```
+mcp__chrome-devtools__take_snapshot()
+```
+
+Parse snapshot to identify:
+- Interactive elements (buttons, inputs, links, selects)
+- Form fields and their labels
+- Navigation elements
+- Dynamic content areas
+
+If no predefined scenarios, generate test scenarios from discovered elements.
+
+#### Step 3.3: Execute Each Scenario
+
+For each scenario:
+
+1. **Capture baseline**:
+   ```
+   mcp__chrome-devtools__take_screenshot({ filePath: "<session>/evidence/F-<id>-<scenario>-before.png" })
+   mcp__chrome-devtools__list_console_messages()  // baseline errors
+   ```
+
+2. **Execute steps**:
+   - Map step descriptions to MCP actions:
+     | Step Pattern | MCP Action |
+     |-------------|------------|
+     | 点击/click XX | `take_snapshot` → find uid → `click({ uid })` |
+     | 填写/输入/fill XX with YY | `take_snapshot` → find uid → `fill({ uid, value })` |
+     | 悬停/hover XX | `take_snapshot` → find uid → `hover({ uid })` |
+     | 等待/wait XX | `wait_for({ text: ["XX"] })` |
+     | 导航/navigate to XX | `navigate_page({ type: "url", url: "XX" })` |
+     | 按键/press XX | `press_key({ key: "XX" })` |
+     | 滚动/scroll | `evaluate_script({ function: "() => window.scrollBy(0, 500)" })` |
+
+3. **Capture result**:
+   ```
+   mcp__chrome-devtools__take_screenshot({ filePath: "<session>/evidence/F-<id>-<scenario>-after.png" })
+   mcp__chrome-devtools__list_console_messages({ types: ["error", "warn"] })
+   mcp__chrome-devtools__list_network_requests({ resourceTypes: ["xhr", "fetch"] })
+   ```
+
+#### Step 3.4: Evaluate Scenario Result
+
+| Check | Pass Condition | Fail Condition |
+|-------|---------------|----------------|
+| Console errors | No new errors after action | New Error/TypeError/ReferenceError |
+| Network requests | All 2xx responses | Any 4xx/5xx response |
+| Expected text | Expected text appears on page | Expected text not found |
+| Visual state | Page renders without broken layout | Blank area, overflow, missing elements |
+| Page responsive | Actions complete within timeout | Timeout or page freeze |
+
+Classify result:
+```
+pass:    All checks pass
+fail:    Console error OR network failure OR expected behavior not met
+warning: Deprecation warnings OR slow response (>3s) OR minor visual issue
+```
+
+#### Step 3.5: Report Progress (Inner Loop)
+
+After each feature, send progress via state_update:
+```json
+{
+  "status": "in_progress",
+  "task_id": "TEST-001",
+  "progress": "3/5 features tested",
+  "issues_found": 2
+}
+```
+
+## Phase 4: Test Report
+
+Write `<session>/artifacts/TEST-001-report.md`:
+
+```markdown
+# Test Report
+
+## Summary
+- **Features tested**: N
+- **Passed**: X
+- **Failed**: Y
+- **Warnings**: Z
+- **Test date**: <timestamp>
+- **Base URL**: <url>
+
+## Results by Feature
+
+### F-001: <feature-name> — PASS/FAIL/WARNING
+
+**Scenarios:**
+| # | Scenario | Result | Issue |
+|---|----------|--------|-------|
+| 1 | <scenario-name> | PASS | — |
+| 2 | <scenario-name> | FAIL | Console TypeError at step 3 |
+
+**Evidence:**
+- Screenshot (before): evidence/F-001-scenario1-before.png
+- Screenshot (after): evidence/F-001-scenario1-after.png
+- Console errors: [list]
+- Network failures: [list]
+
+### F-002: ...
+
+## Discovered Issues
+
+| ID | Feature | Severity | Description | Evidence |
+|----|---------|----------|-------------|----------|
+| BUG-001 | F-001 | High | TypeError on login submit | Console error + screenshot |
+| BUG-002 | F-003 | Medium | API returns 500 on save | Network log |
+| BUG-003 | F-005 | Low | Deprecation warning in console | Console warning |
+```
+
+Write `<session>/artifacts/TEST-001-issues.json`:
+```json
+{
+  "issues": [
+    {
+      "id": "BUG-001",
+      "feature": "F-001",
+      "feature_name": "用户登录",
+      "severity": "high",
+      "description": "点击登录按钮后控制台报TypeError",
+      "category": "javascript_error",
+      "evidence": {
+        "console_errors": ["TypeError: Cannot read property 'token' of undefined"],
+        "screenshot": "evidence/F-001-login-after.png",
+        "network_failures": []
+      },
+      "reproduction_steps": ["导航到/login", "填写用户名admin", "填写密码test", "点击登录按钮"]
+    }
+  ]
+}
+```
+
+Send state_update:
+```json
+{
+  "status": "task_complete",
+  "task_id": "TEST-001",
+  "ref": "<session>/artifacts/TEST-001-report.md",
+  "key_findings": ["Tested N features", "Found X issues (Y high, Z medium)"],
+  "decisions": [],
+  "verification": "tested",
+  "issues_ref": "<session>/artifacts/TEST-001-issues.json"
+}
+```
+
+## Error Handling
+
+| Scenario | Resolution |
+|----------|------------|
+| Feature URL not accessible | Log as failed, continue to next feature |
+| Element not found for action | Take snapshot, search alternatives, skip scenario if not found |
+| Page crash during test | Capture console, reload, continue next scenario |
+| All features pass | Report success, no downstream ANALYZE needed |
+| Timeout during interaction | Capture current state, mark as warning, continue |

package/.codex/skills/team-frontend-debug/roles/verifier/role.md

@@ -0,0 +1,172 @@
+---
+role: verifier
+prefix: VERIFY
+inner_loop: false
+message_types:
+  success: verification_result
+  error: error
+---
+
+# Verifier
+
+Fix verification using Chrome DevTools MCP to confirm bug resolution.
+
+## Identity
+- Tag: [verifier] | Prefix: VERIFY-*
+- Responsibility: Re-execute reproduction steps after fix, verify bug is resolved
+
+## Boundaries
+### MUST
+- Execute EXACT same reproduction steps as Reproducer
+- Capture same evidence types for comparison
+- Compare before/after evidence objectively
+- Report clear pass/fail verdict
+### MUST NOT
+- Modify source code or project files
+- Skip any reproduction step
+- Report pass without evidence comparison
+- Make subjective judgments without evidence
+
+## Phase 2: Load Context
+
+1. Read upstream artifacts via team_msg(operation="get_state")
+2. Load from multiple upstream roles:
+   - Reproducer: evidence-summary.json (original evidence + steps)
+   - Fixer: FIX-001-changes.md (what was changed)
+3. Extract:
+   - Target URL
+   - Reproduction steps (exact same sequence)
+   - Original evidence for comparison
+   - Expected behavior (from bug report)
+   - Files modified by fixer
+
+## Phase 3: Execute Verification
+
+### Step 3.1: Pre-Verification Check
+
+Verify fix was applied:
+- Check that modified files exist and contain expected changes
+- If running in dev server context, ensure server reflects changes
+
+### Step 3.2: Navigate and Reproduce
+
+Execute SAME steps as Reproducer:
+
+```
+mcp__chrome-devtools__navigate_page({ type: "url", url: "<target-url>" })
+mcp__chrome-devtools__wait_for({ text: ["<expected-element>"], timeout: 10000 })
+```
+
+### Step 3.3: Capture Post-Fix Evidence
+
+Capture same evidence types as original reproduction:
+
+| Evidence | Tool | Save To |
+|----------|------|---------|
+| Screenshot | `take_screenshot({ filePath: "<session>/evidence/verify-screenshot.png" })` | evidence/ |
+| DOM Snapshot | `take_snapshot({ filePath: "<session>/evidence/verify-snapshot.txt" })` | evidence/ |
+| Console Messages | `list_console_messages({ types: ["error", "warn"] })` | In-memory |
+| Network Requests | `list_network_requests({ resourceTypes: ["xhr", "fetch"] })` | In-memory |
+
+### Step 3.4: Execute Reproduction Steps
+
+For each step from original reproduction:
+1. Execute same action (click, fill, hover, etc.)
+2. Observe result
+3. Note any differences from original reproduction
+
+### Step 3.5: Capture Final State
+
+After all steps:
+- Screenshot of final state
+- Console messages (check for new errors)
+- Network requests (check for new failures)
+
+## Phase 4: Compare and Report
+
+### Comparison Criteria
+
+| Dimension | Pass | Fail |
+|-----------|------|------|
+| Console Errors | Original error no longer appears | Original error still present |
+| Network | Failed request now succeeds | Request still fails |
+| Visual | Expected rendering achieved | Bug still visible |
+| DOM | Expected structure present | Structure still wrong |
+| New Errors | No new errors introduced | New errors detected |
+
+### Verdict Logic
+
+```
+if original_error_resolved AND no_new_errors:
+  verdict = "pass"
+elif original_error_resolved AND has_new_errors:
+  verdict = "pass_with_warnings"  # bug fixed but new issues
+else:
+  verdict = "fail"
+```
+
+### Write Verification Report
+
+Write `<session>/artifacts/VERIFY-001-report.md`:
+
+```markdown
+# Verification Report
+
+## Verdict: <PASS / PASS_WITH_WARNINGS / FAIL>
+
+## Bug Status
+- **Original bug**: <resolved / still present>
+- **Reproduction steps**: <all executed / partial>
+
+## Evidence Comparison
+
+### Console Errors
+- **Before fix**: <N errors>
+  - <error 1>
+  - <error 2>
+- **After fix**: <N errors>
+  - <error 1 if any>
+- **Resolution**: <original errors cleared / still present>
+
+### Network Requests
+- **Before fix**: <N failed requests>
+- **After fix**: <N failed requests>
+- **Resolution**: <requests now succeed / still failing>
+
+### Visual Comparison
+- **Before fix**: <description or screenshot ref>
+- **After fix**: <description or screenshot ref>
+- **Resolution**: <visual bug fixed / still present>
+
+## Regression Check
+- **New console errors**: <none / list>
+- **New network failures**: <none / list>
+- **Visual regressions**: <none / description>
+
+## Files Verified
+- <file1.ts> — changes confirmed applied
+- <file2.tsx> — changes confirmed applied
+```
+
+Send state_update:
+```json
+{
+  "status": "task_complete",
+  "task_id": "VERIFY-001",
+  "ref": "<session>/artifacts/VERIFY-001-report.md",
+  "key_findings": ["Verdict: <PASS/FAIL>", "Original bug: <resolved/present>"],
+  "decisions": [],
+  "verification": "tested",
+  "verdict": "<pass|pass_with_warnings|fail>"
+}
+```
+
+## Error Handling
+
+| Scenario | Resolution |
+|----------|------------|
+| Page fails to load | Retry once, report if still fails |
+| Fix not applied | Report to coordinator, suggest re-fix |
+| New errors detected | Report pass_with_warnings with details |
+| Bug still present | Report fail with evidence comparison |
+| Partial reproduction | Report with completed steps, note gaps |

package/.codex/skills/team-frontend-debug/specs/debug-tools.md

@@ -0,0 +1,215 @@
+# Chrome DevTools MCP Usage Patterns
+
+Reference for debug tool usage across all roles. Reproducer and Verifier are primary consumers.
+
+## 1. Navigation & Page Control
+
+### Navigate to URL
+```
+mcp__chrome-devtools__navigate_page({ type: "url", url: "http://localhost:3000/page" })
+```
+
+### Wait for Page Load
+```
+mcp__chrome-devtools__wait_for({ text: ["Expected Text"], timeout: 10000 })
+```
+
+### Reload Page
+```
+mcp__chrome-devtools__navigate_page({ type: "reload" })
+```
+
+### List Open Pages
+```
+mcp__chrome-devtools__list_pages()
+```
+
+### Select Page
+```
+mcp__chrome-devtools__select_page({ pageId: 0 })
+```
+
+## 2. User Interaction Simulation
+
+### Click Element
+```
+// First take snapshot to find uid
+mcp__chrome-devtools__take_snapshot()
+// Then click by uid
+mcp__chrome-devtools__click({ uid: "<uid-from-snapshot>" })
+```
+
+### Fill Input
+```
+mcp__chrome-devtools__fill({ uid: "<uid>", value: "input text" })
+```
+
+### Fill Multiple Fields
+```
+mcp__chrome-devtools__fill_form({
+  elements: [
+    { uid: "<uid1>", value: "value1" },
+    { uid: "<uid2>", value: "value2" }
+  ]
+})
+```
+
+### Hover Element
+```
+mcp__chrome-devtools__hover({ uid: "<uid>" })
+```
+
+### Press Key
+```
+mcp__chrome-devtools__press_key({ key: "Enter" })
+mcp__chrome-devtools__press_key({ key: "Control+A" })
+```
+
+### Type Text
+```
+mcp__chrome-devtools__type_text({ text: "typed content", submitKey: "Enter" })
+```
+
+## 3. Evidence Collection
+
+### Screenshot
+```
+// Full viewport
+mcp__chrome-devtools__take_screenshot({ filePath: "<session>/evidence/screenshot.png" })
+
+// Full page
+mcp__chrome-devtools__take_screenshot({ filePath: "<path>", fullPage: true })
+
+// Specific element
+mcp__chrome-devtools__take_screenshot({ uid: "<uid>", filePath: "<path>" })
+```
+
+### DOM/A11y Snapshot
+```
+// Standard snapshot
+mcp__chrome-devtools__take_snapshot()
+
+// Verbose (all a11y info)
+mcp__chrome-devtools__take_snapshot({ verbose: true })
+
+// Save to file
+mcp__chrome-devtools__take_snapshot({ filePath: "<session>/evidence/snapshot.txt" })
+```
+
+### Console Messages
+```
+// All messages
+mcp__chrome-devtools__list_console_messages()
+
+// Errors and warnings only
+mcp__chrome-devtools__list_console_messages({ types: ["error", "warn"] })
+
+// Get specific message detail
+mcp__chrome-devtools__get_console_message({ msgid: 5 })
+```
+
+### Network Requests
+```
+// All requests
+mcp__chrome-devtools__list_network_requests()
+
+// XHR/Fetch only (API calls)
+mcp__chrome-devtools__list_network_requests({ resourceTypes: ["xhr", "fetch"] })
+
+// Get request detail (headers, body, response)
+mcp__chrome-devtools__get_network_request({ reqid: 3 })
+
+// Save response to file
+mcp__chrome-devtools__get_network_request({ reqid: 3, responseFilePath: "<path>" })
+```
+
+### Performance Trace
+```
+// Start trace (auto-reload and auto-stop)
+mcp__chrome-devtools__performance_start_trace({ reload: true, autoStop: true })
+
+// Start manual trace
+mcp__chrome-devtools__performance_start_trace({ reload: false, autoStop: false })
+
+// Stop and save
+mcp__chrome-devtools__performance_stop_trace({ filePath: "<session>/evidence/trace.json" })
+```
+
+## 4. Script Execution
+
+### Evaluate JavaScript
+```
+// Get page title
+mcp__chrome-devtools__evaluate_script({ function: "() => document.title" })
+
+// Get element state
+mcp__chrome-devtools__evaluate_script({
+  function: "(el) => ({ text: el.innerText, classes: el.className })",
+  args: ["<uid>"]
+})
+
+// Check React state (if applicable)
+mcp__chrome-devtools__evaluate_script({
+  function: "() => { const fiber = document.querySelector('#root')._reactRootContainer; return fiber ? 'React detected' : 'No React'; }"
+})
+
+// Get computed styles
+mcp__chrome-devtools__evaluate_script({
+  function: "(el) => JSON.stringify(window.getComputedStyle(el))",
+  args: ["<uid>"]
+})
+```
+
+## 5. Common Debug Patterns
+
+### Pattern: Reproduce Click Bug
+```
+1. navigate_page → target URL
+2. wait_for → page loaded
+3. take_snapshot → find target element uid
+4. take_screenshot → before state
+5. list_console_messages → baseline errors
+6. click → target element
+7. wait_for → expected result (or timeout)
+8. take_screenshot → after state
+9. list_console_messages → new errors
+10. list_network_requests → triggered requests
+```
+
+### Pattern: Debug API Error
+```
+1. navigate_page → target URL
+2. wait_for → page loaded
+3. take_snapshot → find trigger element
+4. click/fill → trigger API call
+5. list_network_requests → find the API request
+6. get_network_request → inspect headers, body, response
+7. list_console_messages → check for error handling
+```
+
+### Pattern: Debug Performance Issue
+```
+1. navigate_page → target URL (set URL first)
+2. performance_start_trace → start recording with reload
+3. (auto-stop after page loads)
+4. Read trace results → identify long tasks, bottlenecks
+```
+
+### Pattern: Debug Visual/CSS Issue
+```
+1. navigate_page → target URL
+2. take_screenshot → capture current visual state
+3. take_snapshot({ verbose: true }) → full a11y tree with styles
+4. evaluate_script → get computed styles of problematic element
+5. Compare expected vs actual styles
+```
+
+## 6. Error Handling
+
+| Error | Meaning | Resolution |
+|-------|---------|------------|
+| "No page selected" | No browser tab active | list_pages → select_page |
+| "Element not found" | uid is stale | take_snapshot → get new uid |
+| "Navigation timeout" | Page didn't load | Check URL, retry with longer timeout |
+| "Evaluation failed" | JS error in script | Check script syntax, page context |
+| "No trace recording" | stop_trace without start | Ensure start_trace was called first |

package/.codex/skills/team-frontend-debug/specs/pipelines.md

@@ -0,0 +1,94 @@
+# Pipeline Definitions
+
+## 1. Pipeline Selection Criteria
+
+| Keywords | Pipeline |
+|----------|----------|
+| 功能, feature, 清单, list, 测试, test, 完成, done, 验收 | `test-pipeline` |
+| bug, 错误, 报错, crash, 问题, 不工作, 白屏, 异常 | `debug-pipeline` |
+| performance, 性能, slow, 慢, latency, memory | `debug-pipeline` (perf dimension) |
+| Ambiguous / unclear | request_user_input |
+
+## 2. Test Pipeline (Feature-List Driven)
+
+**4 tasks, linear with conditional skip**
+
+```
+TEST-001 → [issues found?] → ANALYZE-001 → FIX-001 → VERIFY-001
+              |
+              └─ no issues → Pipeline Complete (skip ANALYZE/FIX/VERIFY)
+```
+
+| Task | Role | Description | Conditional |
+|------|------|-------------|-------------|
+| TEST-001 | tester | Test all features, discover issues | Always |
+| ANALYZE-001 | analyzer | Analyze discovered issues, produce RCA | Skip if 0 issues |
+| FIX-001 | fixer | Fix all identified root causes | Skip if 0 issues |
+| VERIFY-001 | verifier | Re-test failed scenarios to verify fixes | Skip if 0 issues |
+
+### Conditional Skip Logic
+
+After TEST-001 completes, coordinator reads `TEST-001-issues.json`:
+- `issues.length === 0` → All pass. Skip downstream tasks, report success.
+- `issues.filter(i => i.severity !== "low").length === 0` → Only warnings. request_user_input: fix or complete.
+- `issues.filter(i => i.severity === "high" || i.severity === "medium").length > 0` → Proceed with ANALYZE → FIX → VERIFY.
+
+### Re-Fix Iteration
+
+If VERIFY-001 reports failures:
+- Create FIX-002 (blockedBy: VERIFY-001) → VERIFY-002 (blockedBy: FIX-002)
+- Max 3 fix iterations
+
+## 3. Debug Pipeline (Bug-Report Driven)
+
+**4 tasks, linear with iteration support**
+
+```
+REPRODUCE-001 → ANALYZE-001 → FIX-001 → VERIFY-001
+                     ↑                       |
+                     |    (if fail)           |
+                     +--- REPRODUCE-002 ←----+
+```
+
+| Task | Role | Description |
+|------|------|-------------|
+| REPRODUCE-001 | reproducer | Reproduce bug, collect evidence |
+| ANALYZE-001 | analyzer | Analyze evidence, produce RCA report |
+| FIX-001 | fixer | Implement code fix based on RCA |
+| VERIFY-001 | verifier | Verify fix with same reproduction steps |
+
+### Iteration Rules
+
+- **Analyzer → Reproducer**: If Analyzer confidence < 50%, creates REPRODUCE-002 → ANALYZE-002
+- **Verifier → Fixer**: If Verifier verdict = fail, creates FIX-002 → VERIFY-002
+
+### Maximum Iterations
+
+- Max reproduction iterations: 2
+- Max fix iterations: 3
+- After max iterations: report to user for manual intervention
+
+## 4. Task Metadata Registry
+
+| Task ID | Role | Pipeline | Depends On | Priority |
+|---------|------|----------|------------|----------|
+| TEST-001 | tester | test | - | P0 |
+| REPRODUCE-001 | reproducer | debug | - | P0 |
+| ANALYZE-001 | analyzer | both | TEST-001 or REPRODUCE-001 | P0 |
+| FIX-001 | fixer | both | ANALYZE-001 | P0 |
+| VERIFY-001 | verifier | both | FIX-001 | P0 |
+| REPRODUCE-002 | reproducer | debug | (dynamic) | P0 |
+| ANALYZE-002 | analyzer | debug | REPRODUCE-002 | P0 |
+| FIX-002 | fixer | both | VERIFY-001 | P0 |
+| VERIFY-002 | verifier | both | FIX-002 | P0 |
+
+## 5. Evidence Types Registry
+
+| Dimension | Evidence | MCP Tool | Collector Roles |
+|-----------|----------|----------|----------------|
+| Visual | Screenshots | take_screenshot | tester, reproducer, verifier |
+| DOM | A11y snapshots | take_snapshot | tester, reproducer, verifier |
+| Console | Error/warn messages | list_console_messages | tester, reproducer, verifier |
+| Network | API requests/responses | list/get_network_request | tester, reproducer, verifier |
+| Performance | Trace recording | performance_start/stop_trace | reproducer, verifier |
+| Interaction | User actions | click/fill/hover | tester, reproducer, verifier |