Files
gh-cskiro-claudex/skills/testing/playwright-e2e-automation/workflow/phase-7-fixes.md
2025-11-29 18:16:40 +08:00

73 lines
1.7 KiB
Markdown

# Phase 7: Fix Recommendation Generation
**Purpose**: Map visual issues to source code and generate actionable fixes
## Steps
### 1. Correlate issues with source code
- Use test file metadata to identify component under test
- Search codebase for relevant files (component, styles, layout)
- Match visual issues to likely code locations
### 2. Generate fix recommendations
For each issue, provide:
- **Issue description**: Natural language explanation
- **File location**: `src/components/Button.tsx:45`
- **Current code**: Snippet showing problematic code
- **Recommended fix**: Specific code change
- **Reasoning**: Why this fix addresses the issue
### 3. Prioritize fixes
- Sort by severity (critical → low)
- Group related fixes (same component, same file)
- Estimate complexity (simple CSS tweak vs. complex refactor)
### 4. Format as actionable report
```markdown
# Visual Bug Fix Recommendations
## Critical Issues (2)
### 1. Button text cut off on mobile viewport
**Location**: `src/components/Button.tsx:45`
**Screenshot**: `screenshots/current/button-mobile-1234.png`
**Current Code**:
```tsx
<button className="px-4 py-2 text-lg">
{children}
</button>
```
**Recommended Fix**:
```tsx
<button className="px-4 py-2 text-sm sm:text-lg truncate max-w-full">
{children}
</button>
```
**Reasoning**: Fixed width and font size cause overflow on narrow viewports. Added responsive text sizing and truncation.
```
## Output
fix-recommendations.md with prioritized, actionable fixes
## Common Issues
**Can't find source file**
- Ask user for component location
- Search by component name patterns
**Multiple possible fixes**
- Present options with trade-offs
- Recommend simplest solution
## Transition
Proceed to Phase 8 (Test Suite Export)