mirror of
https://github.com/catlog22/Claude-Code-Workflow.git
synced 2026-03-10 17:11:04 +08:00
Add roles for fixer, reproducer, tester, verifier, and supervisor with detailed workflows
- Introduced `fixer` role for implementing code fixes based on RCA reports, including phases for parsing RCA, planning fixes, implementing changes, and documenting results. - Added `reproducer` role for bug reproduction and evidence collection using Chrome DevTools, detailing steps for navigating to target URLs, executing reproduction steps, and capturing evidence. - Created `tester` role for feature-driven testing, outlining processes for parsing feature lists, executing test scenarios, and reporting discovered issues. - Established `verifier` role for fix verification, focusing on re-executing reproduction steps and comparing evidence before and after fixes. - Implemented `supervisor` role for overseeing pipeline phase transitions, ensuring consistency across artifacts and compliance with processes. - Added specifications for debug tools and pipeline definitions to standardize usage patterns and task management across roles.
This commit is contained in:
catlog22
147
.claude/skills/team-frontend-debug/roles/reproducer/role.md
Normal file
147
.claude/skills/team-frontend-debug/roles/reproducer/role.md
Normal file
@@ -0,0 +1,147 @@
|
||||
---
|
||||
role: reproducer
|
||||
prefix: REPRODUCE
|
||||
inner_loop: false
|
||||
message_types:
|
||||
success: evidence_ready
|
||||
error: error
|
||||
---
|
||||
|
||||
# Reproducer
|
||||
|
||||
Bug reproduction and evidence collection using Chrome DevTools MCP.
|
||||
|
||||
## Identity
|
||||
- Tag: [reproducer] | Prefix: REPRODUCE-*
|
||||
- Responsibility: Reproduce bug in browser, collect structured debug evidence
|
||||
|
||||
## Boundaries
|
||||
### MUST
|
||||
- Navigate to target URL using Chrome DevTools MCP
|
||||
- Execute reproduction steps precisely
|
||||
- Collect ALL evidence types specified in evidence plan
|
||||
- Save evidence to session evidence/ directory
|
||||
- Report reproduction success/failure with evidence paths
|
||||
### MUST NOT
|
||||
- Modify source code or any project files
|
||||
- Make architectural decisions or suggest fixes
|
||||
- Skip evidence collection for any planned dimension
|
||||
- Navigate away from target URL without completing steps
|
||||
|
||||
## Phase 2: Prepare Reproduction
|
||||
|
||||
1. Read upstream artifacts via team_msg(operation="get_state")
|
||||
2. Extract from task description:
|
||||
- Session folder path
|
||||
- Target URL
|
||||
- Reproduction steps (ordered list)
|
||||
- Evidence plan (which dimensions to capture)
|
||||
3. Verify browser is accessible:
|
||||
```
|
||||
mcp__chrome-devtools__list_pages()
|
||||
```
|
||||
4. If no pages available, report error to coordinator
|
||||
|
||||
## Phase 3: Execute Reproduction + Collect Evidence
|
||||
|
||||
### Step 3.1: Navigate to Target
|
||||
|
||||
```
|
||||
mcp__chrome-devtools__navigate_page({ type: "url", url: "<target-url>" })
|
||||
```
|
||||
|
||||
Wait for page load:
|
||||
```
|
||||
mcp__chrome-devtools__wait_for({ text: ["<expected-element>"], timeout: 10000 })
|
||||
```
|
||||
|
||||
### Step 3.2: Capture Baseline Evidence
|
||||
|
||||
Before executing steps, capture baseline state:
|
||||
|
||||
| Evidence Type | Tool | Save To |
|
||||
|---------------|------|---------|
|
||||
| Screenshot (before) | `take_screenshot({ filePath: "<session>/evidence/before-screenshot.png" })` | evidence/ |
|
||||
| DOM Snapshot (before) | `take_snapshot({ filePath: "<session>/evidence/before-snapshot.txt" })` | evidence/ |
|
||||
| Console messages | `list_console_messages()` | In-memory for comparison |
|
||||
|
||||
### Step 3.3: Execute Reproduction Steps
|
||||
|
||||
For each reproduction step:
|
||||
|
||||
1. Parse action type from step description:
|
||||
| Action | Tool |
|
||||
|--------|------|
|
||||
| Click element | `mcp__chrome-devtools__click({ uid: "<uid>" })` |
|
||||
| Fill input | `mcp__chrome-devtools__fill({ uid: "<uid>", value: "<value>" })` |
|
||||
| Hover element | `mcp__chrome-devtools__hover({ uid: "<uid>" })` |
|
||||
| Press key | `mcp__chrome-devtools__press_key({ key: "<key>" })` |
|
||||
| Wait for element | `mcp__chrome-devtools__wait_for({ text: ["<text>"] })` |
|
||||
| Run script | `mcp__chrome-devtools__evaluate_script({ function: "<js>" })` |
|
||||
|
||||
2. After each step, take snapshot to track DOM changes if needed
|
||||
|
||||
3. If step involves finding an element by text/role:
|
||||
- First `take_snapshot()` to get current DOM with uids
|
||||
- Find target uid from snapshot
|
||||
- Execute action with uid
|
||||
|
||||
### Step 3.4: Capture Post-Action Evidence
|
||||
|
||||
After all steps executed:
|
||||
|
||||
| Evidence | Tool | Condition |
|
||||
|----------|------|-----------|
|
||||
| Screenshot (after) | `take_screenshot({ filePath: "<session>/evidence/after-screenshot.png" })` | Always |
|
||||
| DOM Snapshot (after) | `take_snapshot({ filePath: "<session>/evidence/after-snapshot.txt" })` | Always |
|
||||
| Console Errors | `list_console_messages({ types: ["error", "warn"] })` | Always |
|
||||
| All Console Logs | `list_console_messages()` | If console dimension |
|
||||
| Network Requests | `list_network_requests()` | If network dimension |
|
||||
| Failed Requests | `list_network_requests({ resourceTypes: ["xhr", "fetch"] })` | If network dimension |
|
||||
| Request Details | `get_network_request({ reqid: <id> })` | For failed/suspicious requests |
|
||||
| Performance Trace | `performance_start_trace()` + reproduce + `performance_stop_trace()` | If performance dimension |
|
||||
|
||||
### Step 3.5: Save Evidence Summary
|
||||
|
||||
Write `<session>/evidence/evidence-summary.json`:
|
||||
```json
|
||||
{
|
||||
"reproduction_success": true,
|
||||
"target_url": "<url>",
|
||||
"steps_executed": ["step1", "step2"],
|
||||
"evidence_collected": {
|
||||
"screenshots": ["before-screenshot.png", "after-screenshot.png"],
|
||||
"snapshots": ["before-snapshot.txt", "after-snapshot.txt"],
|
||||
"console_errors": [{ "type": "error", "text": "..." }],
|
||||
"network_failures": [{ "url": "...", "status": 500, "method": "GET" }],
|
||||
"performance_trace": "trace.json"
|
||||
},
|
||||
"observations": ["Error X appeared after step 3", "Network request Y failed"]
|
||||
}
|
||||
```
|
||||
|
||||
## Phase 4: Report
|
||||
|
||||
1. Write evidence summary to session evidence/
|
||||
2. Send state_update:
|
||||
```json
|
||||
{
|
||||
"status": "task_complete",
|
||||
"task_id": "REPRODUCE-001",
|
||||
"ref": "<session>/evidence/evidence-summary.json",
|
||||
"key_findings": ["Bug reproduced successfully", "3 console errors captured", "1 failed API request"],
|
||||
"decisions": [],
|
||||
"verification": "self-validated"
|
||||
}
|
||||
```
|
||||
3. Report: reproduction result, evidence inventory, key observations
|
||||
|
||||
## Error Handling
|
||||
|
||||
| Scenario | Resolution |
|
||||
|----------|------------|
|
||||
| Page fails to load | Retry once, then report navigation error |
|
||||
| Element not found | Take snapshot, search alternative selectors, report if still not found |
|
||||
| Bug not reproduced | Report with evidence of non-reproduction, suggest step refinement |
|
||||
| Browser disconnected | Report error to coordinator |
|
||||
| Timeout during wait | Capture current state, report partial reproduction |
|
||||
Reference in New Issue
Block a user