- 어떤 페이지에서 시작하는가?
- 어떤 인터랙션이 필요한가? (클릭, 입력, 네비게이션)
- 성공 조건은 무엇인가? (URL 변경, 텍스트 표시, 상태 변화)
- 엣지 케이스는? (빈 입력, 에러 응답)

# package.json에서 dev/start 스크립트 확인
cat package.json | grep -A 5 '"scripts"'

# 앱 실행 (백그라운드)
npm run dev &
sleep 5  # 앱 준비 대기

# 프로젝트에 기존 E2E 설정 확인
ls e2e/ 2>/dev/null || ls tests/e2e/ 2>/dev/null || ls __tests__/e2e/ 2>/dev/null

# 기존 E2E 프레임워크 확인 (Playwright, Cypress, agent-browser)
cat package.json | grep -E "playwright|cypress|agent-browser"

#!/bin/bash
set -e
cleanup() { agent-browser close 2>/dev/null || true; }
trap cleanup EXIT

agent-browser open http://localhost:3000

# 스냅샷으로 요소 확인
agent-browser snapshot -i

# 피처 플로우 실행
agent-browser fill @email-input "test@example.com"
agent-browser click @submit-btn
agent-browser wait text "Success"

echo "PASS: Feature E2E test"

import { test, expect } from '@playwright/test';

test('피처명: 사용자 플로우', async ({ page }) => {
  await page.goto('/');
  await page.fill('[data-testid="email"]', 'test@example.com');
  await page.click('[data-testid="submit"]');
  await expect(page.locator('.success')).toBeVisible();
});

describe('피처명', () => {
  it('사용자 플로우를 완료한다', () => {
    cy.visit('/');
    cy.get('[data-testid="email"]').type('test@example.com');
    cy.get('[data-testid="submit"]').click();
    cy.contains('Success').should('be.visible');
  });
});

# agent-browser
bash e2e/test_feature.sh

# Playwright
npx playwright test e2e/feature.spec.ts

# Cypress
npx cypress run --spec "cypress/e2e/feature.cy.ts"

# 스크린샷 캡처
agent-browser screenshot ./e2e/debug.png

# headed 모드로 재실행
agent-browser open http://localhost:3000 --headed

# 콘솔 에러 확인
agent-browser console --error