claude-code-workflow 7.2.23 → 7.2.24

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

@@ -1,215 +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 |
+# 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

@@ -1,94 +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 |
+# 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 |