claude-code-workflow 7.2.23 → 7.2.24

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

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