Auto TDD E2E Phase v2.0

병렬 처리를 활용한 고속 E2E 테스트 워크플로우입니다.

Workflow Overview

┌─────────────────────────────────────────────────────────────────────────┐
│                     E2E Test Phase (Parallel)                           │
├─────────────────────────────────────────────────────────────────────────┤
│                                                                         │
│  1. Unit Tests Pass                                                     │
│         │                                                               │
│         ▼                                                               │
│  2. Playwright Test PLANNER                                             │
│     (Create comprehensive test scenarios)                               │
│         │                                                               │
│         ▼                                                               │
│  3. GROUPING: Analyze Dependencies                                      │
│     (Group scenarios by independence for parallel execution)            │
│         │                                                               │
│         ├─────────────┬─────────────┬─────────────┐                    │
│         ▼             ▼             ▼             ▼                    │
│  4. GENERATOR     GENERATOR     GENERATOR     GENERATOR                │
│     (Group A)     (Group B)     (Group C)     (Group D)                │
│     [Parallel]    [Parallel]    [Parallel]    [Parallel]               │
│         │             │             │             │                    │
│         └─────────────┴─────────────┴─────────────┘                    │
│                       │                                                 │
│                       ▼                                                 │
│  5. Run ALL E2E Tests                                                   │
│         │                                                               │
│         ├─── ALL PASS ──▶ 6. Complete Phase ✅                          │
│         │                                                               │
│         └─── SOME FAIL ──▶ 7. HEALER (Parallel)                        │
│                               │                                         │
│                    ┌──────────┼──────────┐                             │
│                    ▼          ▼          ▼                             │
│                 HEALER     HEALER     HEALER                           │
│                 (File1)    (File2)    (File3)                          │
│                 [Parallel] [Parallel] [Parallel]                       │
│                    │          │          │                             │
│                    └──────────┴──────────┘                             │
│                               │                                         │
│                               ▼                                         │
│  8. Re-run & Verify ──────────────────────────────────────────────────┘│
│                                                                         │
└─────────────────────────────────────────────────────────────────────────┘

Phase 1: Verify Unit Tests Pass

echo "🧪 Verifying Unit Tests..."
npm test || { echo "❌ Unit tests must pass first"; exit 1; }
echo "✅ Unit tests passed"

Phase 2: Generate Test Plan (Planner)

playwright-test-planner 에이전트로 테스트 시나리오를 작성합니다.

Launch Task tool with subagent_type="playwright-test-planner":

"특정 페이지/기능에 대한 E2E 테스트 시나리오를 작성해주세요.

1. 개발 서버 접속 (http://localhost:3000)
2. 모든 인터랙티브 요소와 사용자 플로우 탐색
3. 다음을 포함하는 테스트 시나리오 작성:
   - Happy path 사용자 여정
   - 에러 핸들링 케이스
   - Edge case 및 경계값
4. 테스트 계획 저장: specs/test.plan.md

planner_setup_page 도구로 시작,
browser_* 도구로 탐색,
planner_save_plan으로 저장."

Phase 3: Group Test Scenarios (Critical Step)

의존성 분석 후 병렬 처리 가능한 그룹으로 분리합니다.

테스트 시나리오를 분석하여 다음 기준으로 그룹화:

GROUPING CRITERIA:
1. 의존성이 겹치지 않는 시나리오끼리 묶기
2. 같은 페이지/컴포넌트라도 완전히 다른 기능은 분리
3. 각 그룹은 독립적으로 실행 가능해야 함
4. 순차 실행 필요한 것과 병렬 처리 가능한 것 구분

예시 그룹화 결과:
┌─────────────────────────────────────────────────────────────┐
│ Group A (Auth)           │ Group B (Products)              │
│ - Login flow             │ - Product listing               │
│ - Logout flow            │ - Product search                │
│ - Password reset         │ - Product filtering             │
├─────────────────────────────────────────────────────────────┤
│ Group C (Cart)           │ Group D (User Profile)          │
│ - Add to cart            │ - View profile                  │
│ - Remove from cart       │ - Edit profile                  │
│ - Checkout flow          │ - Settings management           │
└─────────────────────────────────────────────────────────────┘

OUTPUT: specs/test-groups.json
{
  "groups": [
    {
      "name": "Group A - Authentication",
      "tests": ["login-valid", "login-invalid", "logout", "password-reset"],
      "dependencies": ["none"],
      "canParallel": true
    },
    {
      "name": "Group B - Products",
      "tests": ["product-list", "product-search", "product-filter"],
      "dependencies": ["none"],
      "canParallel": true
    }
  ],
  "sequentialGroups": [
    {
      "name": "Sequential - Checkout",
      "tests": ["add-to-cart", "checkout", "payment"],
      "reason": "Depends on cart state"
    }
  ]
}

Grouping Prompt

Read the test plan from specs/test.plan.md and analyze dependencies.

"테스트 시나리오 분석해서 테스트 코드 병렬로 작성 가능하도록
의존성이 겹치지 않는 시나리오를 그룹화 해줘.

같은 페이지나 컴포넌트라도 완전히 다른 기능을 테스트하는 경우는
병렬 처리가 가능하도록 분리해줘.

Output: specs/test-groups.json with structure above."

Phase 4: Parallel Test Generation (Generators)

그룹별로 Generator 에이전트를 병렬로 실행합니다.

# 병렬 Generator 실행 - Task tool을 동시에 여러 개 호출

Launch MULTIPLE Task tools IN PARALLEL with subagent_type="playwright-test-generator":

# === PARALLEL TASK 1: Group A ===
Task 1: "Generate E2E tests for Group A (Authentication)

<test-suite>Authentication</test-suite>
<seed-file>tests/seed.spec.ts</seed-file>

Tests to generate:
1. tests/auth/login-valid.spec.ts
2. tests/auth/login-invalid.spec.ts
3. tests/auth/logout.spec.ts
4. tests/auth/password-reset.spec.ts

Use generator_setup_page, perform steps with browser_* tools,
read log with generator_read_log, write with generator_write_test."

# === PARALLEL TASK 2: Group B ===
Task 2: "Generate E2E tests for Group B (Products)

<test-suite>Products</test-suite>
<seed-file>tests/seed.spec.ts</seed-file>

Tests to generate:
1. tests/products/list.spec.ts
2. tests/products/search.spec.ts
3. tests/products/filter.spec.ts

Use generator_setup_page, perform steps with browser_* tools,
read log with generator_read_log, write with generator_write_test."

# === PARALLEL TASK 3: Group C ===
Task 3: "Generate E2E tests for Group C (Cart)
..."

# === PARALLEL TASK 4: Group D ===
Task 4: "Generate E2E tests for Group D (User Profile)
..."

Parallel Execution Pattern

// Task tool 병렬 호출 패턴
// 하나의 메시지에서 여러 Task tool을 동시에 호출

// 메인 에이전트가 서브 에이전트들을 병렬로 띄움
// 각 서브 에이전트는 독립적인 컨텍스트 윈도우 사용
// → 토큰 제한 문제 해결 + 속도 10배 향상

/*
 * CRITICAL: Use a SINGLE message with MULTIPLE Task tool calls
 * to achieve true parallel execution
 */

Phase 5: Run All E2E Tests

echo "🎭 Running ALL E2E tests..."

# Ensure dev server is running
if ! curl -s http://localhost:3000 > /dev/null 2>&1; then
    echo "⚠️ Starting dev server..."
    npm run dev &
    sleep 5
fi

# Run Playwright tests and capture results
npx playwright test --reporter=json --output-file=test-results.json 2>&1 | tee playwright-output.log

EXIT_CODE=${PIPESTATUS[0]}

if [ $EXIT_CODE -eq 0 ]; then
    echo "✅ ALL_E2E_TESTS_PASSED"
else
    echo "❌ SOME_E2E_TESTS_FAILED"
    # Extract failed test files for parallel healing
    grep -E "FAILED|Error:" playwright-output.log | grep -oE "tests/[^:]+\.spec\.ts" | sort -u > failed-tests.txt
    echo "📋 Failed tests saved to: failed-tests.txt"
    cat failed-tests.txt
fi

exit $EXIT_CODE

Phase 6: Parallel Test Healing (Healers)

실패한 테스트 파일별로 Healer 에이전트를 병렬로 실행합니다.

# 실패한 테스트 파일 목록 읽기
FAILED_TESTS=$(cat failed-tests.txt)

# 각 실패한 테스트에 대해 병렬로 Healer 실행

Launch MULTIPLE Task tools IN PARALLEL with subagent_type="playwright-test-healer":

# === PARALLEL HEALER 1 ===
Task 1: "Fix failing test: tests/auth/login-valid.spec.ts

1. Run test_debug to identify the exact failure point
2. Capture browser_snapshot to see page state
3. Analyze error (selector changed? timing issue? logic error?)
4. Edit the test file to fix
5. Verify with test_run

DO NOT mark as test.fixme() unless truly unfixable after 3 attempts."

# === PARALLEL HEALER 2 ===
Task 2: "Fix failing test: tests/products/search.spec.ts

1. Run test_debug to identify the exact failure point
2. Capture browser_snapshot to see page state
3. Analyze error (selector changed? timing issue? logic error?)
4. Edit the test file to fix
5. Verify with test_run

DO NOT mark as test.fixme() unless truly unfixable after 3 attempts."

# === PARALLEL HEALER 3 ===
Task 3: "Fix failing test: tests/cart/checkout.spec.ts
..."

# 모든 Healer가 완료될 때까지 대기
# 각 Healer는 독립적인 컨텍스트에서 실행

Healer Parallel Pattern

// 실패한 테스트 수만큼 Healer 에이전트 병렬 실행
//
// 예: 5개 테스트 실패 → 5개 Healer 동시 실행
//
// 각 Healer:
// 1. test_debug로 에러 지점 파악
// 2. browser_snapshot으로 페이지 상태 확인
// 3. 에러 분석 (셀렉터 변경? 타이밍? 로직?)
// 4. 테스트 파일 수정
// 5. test_run으로 검증

Phase 7: Final Verification Loop

/ralph-loop "E2E Parallel Test Phase

CONTEXT: bd show $ISSUE_ID

WORKFLOW:
1. Run: npx playwright test
2. If ALL PASS → Complete
3. If FAIL → Launch parallel Healer agents for each failed file
4. Wait for all Healers to complete
5. Retry from step 1

PARALLEL HEALING:
- Read failed-tests.txt
- Launch Task tool for EACH failed test with subagent_type=playwright-test-healer
- Use SINGLE message with MULTIPLE Task calls for true parallelism

QUALITY GATE:
- All E2E tests pass
- Run 3 consecutive times without failure (no flaky)
- All critical user paths covered

ON SUCCESS:
git add tests/
git commit -m 'E2E: Add/fix Playwright tests (parallel generation)'
<promise>E2E_PHASE_COMPLETE</promise>

AFTER 10 ITERATIONS:
Mark remaining failures as test.fixme() with reason
<promise>E2E_PHASE_COMPLETE</promise>
" --max-iterations 15 --completion-promise "E2E_PHASE_COMPLETE"

Quick Reference: Parallel Execution Commands

Generator 병렬 실행

"Playwright 테스트 제너레이터 에이전트를 활용해서
그룹별로 병렬로 에이전트를 띄워서 테스트 코드를 작성해줘.

Groups:
- Group A: [test1, test2, test3]
- Group B: [test4, test5, test6]
- Group C: [test7, test8, test9]

Use SINGLE message with MULTIPLE Task tool calls."

Healer 병렬 실행

"실패한 테스트 케이스에 대해서는 Playwright 테스트 힐러 에이전트 사용해서 수정해줘.
힐러 에이전트는 병렬로 띄워서 처리해줘.

Failed tests:
- tests/auth/login.spec.ts
- tests/products/search.spec.ts
- tests/cart/checkout.spec.ts

Each Healer runs independently in parallel."

Performance Comparison

Approach	50 Tests Generation	10 Failed Tests Healing
Sequential	~50 min	~20 min
Parallel (5 agents)	~10 min	~4 min
Parallel (10 agents)	~5 min	~2 min

Benefits:

• 10x faster test generation
• Independent context windows per agent
• No token limit issues
• Better error isolation

Success Criteria

• All Playwright tests pass
• Tests cover critical user journeys
• No flaky tests (3 consecutive passes)
• Test execution time < 2 minutes
• Parallel agents used for generation and healing

Output

On success:

<promise>E2E_PHASE_COMPLETE</promise>