Playwright 1.59: 에이전트 테스트 API — 가이드

# Playwright 1.59: 에이전트 테스트가 표준으로 자리 잡다 — 핵심 API 분석

Playwright 1.59 릴리스는 수동 테스트 설정에서 에이전트 워크플로로의 전환을 상징합니다. 새로운 시각화 도구, 공유 세션 액세스, CLI 통합이 AI 생성 테스트와 실제 적용 사이의 간극을 메웁니다. 테크 리드들이 기존 파이프라인에 이러한 기능을 어떻게 도입할 수 있는지 자세히 살펴보겠습니다.

Screencast API: 스크린샷에서 시각적 증거로

새로운 page.screencast API는 테스트 실패 시 산발적인 스크린샷을 전체 비디오 영수증으로 대체합니다. 핵심 차이점은 내장된 액션 주석과 긴 시나리오를 정리하는 챕터입니다. 단순한 화면 녹화가 아니라—맥락이 포함된 실행 보고서입니다.

중요한 E2E 흐름에 대한 사용 예시:

await page.screencast.start({ path: 'checkout.webm' });
await page.screencast.showActions({ position: 'top-right' });
await page.locator('#add-to-cart').click();
await page.locator('#checkout').click();
await expect(page.locator('.order-confirmation')).toBeVisible();
await page.screencast.stop();

AI 비전과 통합할 때 onFrame 콜백으로 프레임을 비전 모델에 전달할 수 있습니다:

await page.screencast.start({
  onFrame: ({ data }) => sendToVisionModel(data),
  size: { width: 800, height: 600 },
});

이것은 픽셀 단위 비교 없이 시각적 검증 문제를 해결합니다. CI의 경우 단계 설명 챕터를 추가하는 것이 권장됩니다:

await page.screencast.showChapter('Authentication', {
  description: 'Test login process',
  duration: 1000,
});
// login steps
await page.screencast.showChapter('Payment', {
  description: 'Credit card validation',
});

챕터가 포함된 비디오는 텍스트 로그에 비해 실패 분석 속도를 3-4배 빠르게 합니다.

Browser Bind API: 도구 간 동기화

browser.bind() 기능은 단일 브라우저 세션에 대한 공유 액세스를 위해 WebSocket 연결을 생성합니다. 수동 테스트와 자동화 간 전환 시 중복 인증을 제거합니다.

기본 시나리오:

const { endpoint } = await browser.bind('auth-session', {
  workspaceDir: '/project',
});

CLI 연결:

playwright-cli attach auth-session
playwright-cli -s auth-session snapshot

실제 사용 사례:

• 프로세스를 중단하지 않고 AI 에이전트 실시간 디버깅
• QA와 개발자 간 인증 세션 공유
• 하이브리드 워크플로를 위한 MCP 서버 통합 (예: 에이전트가 테스트 생성, 팀이 수정)

자동 복구 테스트를 사용하는 팀에 필수적입니다: 에이전트가 바인드된 세션을 통해 변경 사항을 확인하며 시나리오를 수정할 수 있습니다.

Dashboard와 CLI 도구: GUI 없이 디버깅

playwright-cli show 명령어는 모든 바인드 세션의 실시간 모니터링 대시보드를 실행합니다. 에이전트 워크플로를 위해 두 가지 핵심 모드가 추가되었습니다:

• CLI 디버거 (--debug=cli): 터미널을 통한 단계별 디버깅

```

npx playwright test --debug=cli

playwright-cli --session tw-87b59e step-over

```

GUI 없이 에이전트가 실패를 분석할 수 있으며, 각 단계에서 DOM을 검사합니다.

• Trace 분석 (npx playwright trace): 프로그램 방식 트레이스 파싱

- 네트워크 요청 및 타이밍 추출

- 실패 순간을 정확히 지목하는 버그 보고서 자동 생성

- 분석 시스템 통합 (예: Grafana)

이러한 도구는 전통적인 디버깅 방법이 불가능한 헤드리스 CI 환경에 필수적입니다.

테크 리드들을 위한 핵심 요약

• 로그 대신 시각적 영수증: 액션 주석이 포함된 30초 비디오로 진단 속도 4배 향상
• 공유 세션으로 시간 절약: 재인증 제거로 테스트 파이프라인 오버헤드 15-20% 감소
• CLI 우선 접근: 터미널 통합으로 프로덕션 환경에서 에이전트 워크플로 실현 가능
• 직접 AI 통합: 비전 모델에 프레임 전달 및 힐러 에이전트를 통한 자동 수정 생성
• 이해관계자 투명성: 비디오 보고서로 기술 세부 사항을 명확한 증거로 변환

기존 프로세스에 도입하는 방법

팀을 위한 시작 전략:

• Screencast API부터 시작 핵심 시나리오(주문 결제, 결제)에 적용. 주요 단계에 챕터 추가—즉각적인 진단 효과를 얻습니다.

• Browser Bind 설정 공유 세션용:

```

# 설정 스크립트에서

await browser.bind('auth-state', { storageState: 'state.json' });

```

터미널에서 연결해 재로그인 없이 수동 확인.

• 대시보드 활성화 CI에서 PLAYWRIGHT_DASHBOARD=1 사용. 병렬 실행 시각적 감독 제공.

• CLI 디버거를 자동 복구 파이프라인에 통합:

```

# 힐러 에이전트 스크립트에서

if (testFailed) {

await runCLI(playwright-cli attach ${session} fix);

}

```

1.59로 업그레이드 시 코드 변경 최소화되지만 테스트 패러다임이 바뀝니다: QA 엔지니어가 "테스트 작성자"에서 에이전트 솔루션 검증자로 전환. Screencast API 도입 일주일 내 첫 효과가 나타나며, 팀은 실패 분석 시간 단축을 느낄 것입니다.

— Editorial Team