peach-e2e-run

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

E2E 시나리오 실행

E2E场景运行

./e2e.sh

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

通过

./e2e.sh

CLI执行场景（基于playwright-cli）。可通过agent-browser eval快速完成调试验证。

도구 역할 분담

工具职责分工

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

用途	工具
运行场景	`./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. 环境检查（setup）
2. 获取标签页列表 → 向用户确认要使用的标签页编号
3. 展示场景列表 → 用户选择要执行的场景
4. 在--tab N指定的标签页中运行场景
5. 结果报告（出现错误时通过agent-browser eval调试）

1단계: 환경 확인

第1步：环境检查

bash

cd e2e && ./e2e.sh setup

setup

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

./e2e.sh chrome

실행 요청.

bash

cd e2e && ./e2e.sh setup

setup

命令会自动检查/安装所有依赖环境（Chrome Beta、agent-browser、playwright-cli、CDP连接）。如果CDP未连接：请求执行

./e2e.sh chrome

命令。

2단계: 탭 확인

第2步：确认标签页

bash

cd e2e && ./e2e.sh status

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

탭 번호는 0번부터 시작한다. status 출력에서 확인.
chrome://
탭은 목록에서 제외된다. 실제 페이지 탭만 표시.
[0] 페이지 제목
        https://example.com/...
[1] NAVER
        https://www.naver.com/
[번호]
가
--tab N
의 N과 동일하다.

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

bash

cd e2e && ./e2e.sh status

将标签页列表展示给用户，并询问**「要在几号标签页运行？」**

标签页编号从0开始计数，可在status输出中确认。
chrome://
开头的标签页会被排除，仅展示实际页面标签页。
[0] 페이지 제목
        https://example.com/...
[1] NAVER
        https://www.naver.com/
[编号]
和
--tab N
中的N完全对应。

直接使用用户已登录的标签页，无需区分环境（本地/测试/生产）。

3단계: 시나리오 목록

第3步：获取场景列表

bash

cd e2e && ./e2e.sh list

bash

cd e2e && ./e2e.sh list

4단계: 실행

第4步：执行场景

bash

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가 에러를 발생시킨다. 이 경우 먼저 페이지 탭을 열어야 한다:
bash
agent-browser connect 9222
agent-browser tab new "https://www.google.com"
또는 시나리오 내에서 직접 탭을 열도록 작성한다.

bash

cd e2e && ./e2e.sh run --tab 0 1                       # 0号标签页，运行1号场景
cd e2e && ./e2e.sh run --tab 0 1-3                     # 0号标签页，顺序运行1~3号场景
cd e2e && ./e2e.sh run --tab 0 all                     # 0号标签页，运行全部场景
cd e2e && ./e2e.sh run 1                               # 未指定标签页 → 自动检测选择

--tab N
会在查询CDP后转换为对应的URL，作为
E2E_TAB_URL
环境变量传递给
lib/connect.js
。未指定标签页时，会自动选择第一个非chrome协议的页面标签页。

注意空浏览器问题：如果Chrome Beta中只有
chrome://
开头的标签页，没有实际页面标签页，connect.js会抛出错误。这种情况下需要先打开一个页面标签页：
bash
agent-browser connect 9222
agent-browser tab new "https://www.google.com"
或者在场景代码中直接编写打开标签页的逻辑。

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

第5步：结果报告 + 调试

```
✨ 완료!
```
→ 성공 보고
```
❌ 에러:
```
→ agent-browser eval로 빠르게 디버깅:

bash

undefined

```
✨ 完成!
```
→ 报告执行成功
```
❌ 에러:
```
→ 通过agent-browser eval快速调试：

bash

undefined

CDP 연결 (1회)

CDP连接（仅需执行1次）

agent-browser connect 9222

현재 URL 확인

查看当前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:
> ```bash
> ./e2e/pwc.sh eval "document.querySelector('iframe[src*=target]').contentDocument.querySelector('#element').innerText"
> ```

agent-browser eval "document.querySelectorAll('tr').length"


> iframe内部调试无法通过agent-browser完成 → fallback到playwright-cli：
> ```bash
> ./e2e/pwc.sh eval "document.querySelector('iframe[src*=target]').contentDocument.querySelector('#element').innerText"
> ```