E2E 시나리오 실행

./e2e.sh CLI를 통해 시나리오를 실행한다. (playwright-cli 기반) 디버깅은 agent-browser eval로 빠르게 확인한다.

도구 역할 분담

용도	도구
시나리오 실행	./e2e.sh run (playwright-cli 기반)
셀렉터 디버깅/DOM 확인	agent-browser eval (빠름)
iframe 디버깅	./e2e/pwc.sh eval (fallback)

워크플로우

1. 환경 확인 (setup)
2. 탭 목록 → 사용자에게 탭 번호 확인
3. 시나리오 목록 → 사용자 선택
4. --tab N으로 지정된 탭에서 시나리오 실행
5. 결과 보고 (에러 시 agent-browser eval로 디버깅)

1단계: 환경 확인

cd e2e && ./e2e.sh setup

setup이 모든 환경(Chrome Beta, agent-browser, playwright-cli, CDP 연결)을 자동 체크/설치한다. CDP 미연결이면: ./e2e.sh chrome 실행 요청.

2단계: 탭 확인

cd e2e && ./e2e.sh status

탭 목록을 사용자에게 보여주고 "몇 번 탭에서 실행할까요?" 확인.

탭 번호는 0번부터 시작한다. status 출력에서 확인. chrome:// 탭은 목록에서 제외된다. 실제 페이지 탭만 표시.

[0] 페이지 제목
        https://example.com/...
[1] NAVER
        https://www.naver.com/

[번호]가 --tab N의 N과 동일하다.

사용자가 로그인한 탭을 그대로 사용한다. 환경(local/test/prod) 구분 없음.

3단계: 시나리오 목록

cd e2e && ./e2e.sh list

4단계: 실행

cd e2e && ./e2e.sh run --tab 0 1                       # 0번 탭, 1번 시나리오
cd e2e && ./e2e.sh run --tab 0 1-3                     # 1~3번 순차
cd e2e && ./e2e.sh run --tab 0 all                     # 전체
cd e2e && ./e2e.sh run 1                               # 탭 미지정 → 자동 탐지

--tab N은 CDP 조회 후 URL로 변환되어 E2E_TAB_URL 환경변수로 lib/connect.js에 전달된다. 탭 미지정 시 첫 번째 비-chrome 페이지 탭이 자동 선택된다.

빈 브라우저 주의: Chrome Beta에 chrome:// 탭만 있고 페이지 탭이 없으면 connect.js가 에러를 발생시킨다. 이 경우 먼저 페이지 탭을 열어야 한다:

agent-browser connect 9222
agent-browser tab new "https://www.google.com"

또는 시나리오 내에서 직접 탭을 열도록 작성한다.

5단계: 결과 보고 + 디버깅

• ✨ 완료! → 성공 보고
• ❌ 에러: → agent-browser eval로 빠르게 디버깅:
• CDP error: Session with given id not found → 세션 끊김 복구:

  agent-browser connect 9222
  agent-browser tab list
  agent-browser tab N       # 올바른 탭 번호
  agent-browser eval "document.title"  # 복구 확인 후 재실행
  

# CDP 연결 (1회)
agent-browser connect 9222

# 현재 URL 확인
agent-browser eval "location.href"

# 셀렉터 존재 여부
agent-browser eval "document.querySelector('.target') !== null"

# 버튼 목록
agent-browser eval "JSON.stringify(Array.from(document.querySelectorAll('button')).map(function(b){return b.innerText}))"

# 요소 개수
agent-browser eval "document.querySelectorAll('tr').length"

iframe 내부 디버깅은 agent-browser로 불가 → playwright-cli fallback:

./e2e/pwc.sh eval "document.querySelector('iframe[src*=target]').contentDocument.querySelector('#element').innerText"

native dialog 시나리오 규칙

• native dialog가 있는 시나리오는 지역 recorder 패턴 사용. 전역 page.on('dialog', dialog.accept()) 기본 탑재 금지.
• window.alert/confirm override 시 finally에서 반드시 원복.
• page.on('dialog', handler) 필요 시 특정 단계 전후로만 설치 → page.off('dialog', handler) 해제.
• process.exit(0) 고정 종료 금지 → try/catch/finally + exitCode 패턴 사용.
• 페이지 상태 의존 로직은 클릭 전에 명시적 대기 (예: window.json_data.pay_method === 'point' 확인 후 결제 버튼 클릭).

상세: peach-e2e-browse/references/native-dialog-주의사항.md 참조

외부 서비스 전환

외부 사이트(Google, Gmail 등) 진입은 load + 2초 지연 + 직접 이동 fallback 패턴 사용. 상세: peach-e2e-browse/references/외부서비스-링크전환-패턴.md 참조

탭 선택 규칙

• 일반 실행: --tab N (빠른 실행용)
• 디버깅/재현/장애분석: E2E_TAB_ID 우선 (인덱스 드리프트 방지)

# targetId 조회
curl -s http://127.0.0.1:9222/json | jq -r '.[] | select(.type=="page" and (.url|startswith("chrome")|not)) | [.id,.title,.url] | @tsv'

# targetId로 실행
cd e2e && E2E_TAB_ID=<targetId> ./e2e.sh run '시나리오/대상.js'

상세: peach-e2e-browse/references/탭-선택-패턴.md 참조