Playwright CLI vs Playwright MCP: Claude Code와 함께 사용할 때 무엇을 선택해야 할까요?
요약
Claude Code 환경에서 Playwright MCP와 Playwright CLI 중 어떤 도구를 사용할지 비교 분석합니다. MCP는 샌드박스 환경에 적합하지만 토큰 소모가 큰 반면, CLI는 쉘 액세스가 가능하며 토큰 효율성이 매우 높습니다.
핵심 포인트
- MCP는 샌드박스 환경 및 대화형 도구 호출에 최적화됨
- CLI는 파일 시스템/쉘 접근이 가능한 에이전트 및 CI 환경에 적합
- CLI 사용 시 MCP 대비 토큰 사용량을 약 75% 이상 절감 가능
- 작업 규모와 컨텍스트 제한 여부에 따라 도구 선택 필요
만약
- 일단 등록되면, Claude는 대화 내에서 이러한 도구들을 직접 호출합니다. 별도의 쉘 (shell) 액세스가 필요하지 않습니다.
- 전체 접근성 트리 (accessibility tree) (및 종종 스크린샷)가 도구 결과의 일부로 반환되며, 이는 모델의 컨텍스트 (context)에 직접 주입됨을 의미합니다.
- 이로 인해 MCP는 샌드박스 환경 (sandboxed environments) — Claude Desktop, 커스텀 채팅 UI, 또는 터미널 액세스 권한이 없는 클라이언트 — 에 적합한 선택이 됩니다.
2단계: Playwright CLI란 무엇인가?
Playwright CLI는 이미 파일 시스템 및 쉘 (shell) 액세스 권한을 가진 코딩 에이전트(coding agents)를 위해 구축된 더 최신의 독립형 명령줄 도구입니다:
npm install -g @playwright/cli@latest
npx playwright install chromium
- 페이지 상태를 대화로 스트리밍하는 대신, 디스크에 압축된 YAML 스냅샷을 작성합니다.
- Claude는 문서 전체 대신 해당 파일에서 필요한 특정 라인만 (종종
grep을 사용하여) 읽습니다. - 단순한 쉘 (shell) 명령이기 때문에, Claude Code가 이미 실행되고 있는 곳이라면 어디든 — 로컬이든 CI(지속적 통합) 환경이든 — 작동합니다.
3단계: 동일한 테스트, 두 가지 방식
다음은 이동(navigate), 필드 입력(fill), 제출(submit), 검증(verify)이라는 동일한 로직을 각 도구를 통해 표현한 것입니다.
MCP 사용 시 (대화형 도구 사용(tool-use)으로 호출되며, 쉘 명령어가 보이지 않음):
Claude calls: browser_navigate(url="https://demo.playwright.dev/todomvc")
Claude calls: browser_snapshot()
Claude calls: browser_type(ref="e12", text="Write blog post")
...
CLI 사용 시 (실제 쉘 명령어로 실행):
playwright-cli navigate https://demo.playwright.dev/todomvc
playwright-cli snapshot
playwright-cli fill e12 "Write blog post"
...
- 단계는 동일하며, 기반이 되는 접근성 트리 참조 시스템도 동일합니다 (e12는 양쪽 모두에서 같은 의미를 가집니다).
- 차이점은 발생하는 동작이 아니라, 결과로 생성된 상태가 어디에 저장되는지, 그리고 그 상태의 어느 정도가 모델의 컨텍스트 (context)로 다시 들어가는지입니다.
4단계: 토큰 사용량 비교
이 부분은 여러분의 비용과 컨텍스트 창 (context window)에 실제로 중요한 부분입니다. 일반적인 다단계 브라우저 작업에 대한 독립적인 벤치마킹 결과는 다음과 같습니다:
| 도구 (Tool) | 다단계 UI 테스트에 필요한 대략적인 토큰 수 |
|---|---|
| Playwright MCP | ~114,000 |
| Playwright CLI | ~26,000–27,000 |
이는 동일한 작업에 대해 약 90,000 토큰의 차이가 발생하는 것과 같습니다. 이는 주로 MCP가 매 도구 호출 (tool call) 시마다 전체 페이지 상태 (page state)를 대화 내용에 다시 전송하는 반면, CLI는 해당 상태를 디스크에 유지하고 Claude가 필요한 특정 부분만을 가져오기 때문입니다.
일회성 탐색 테스트 (exploratory test)의 경우 이러한 차이는 거의 중요하지 않습니다. 하지만 전체 회귀 테스트 스위트 (regression suite)나 여러 양식을 차례로 테스트하는 긴 세션의 경우, 이는 세션을 성공적으로 마칠 수 있느냐, 아니면 중간에 컨텍스트 제한 (context limit)에 걸리느냐의 차이를 만듭니다.
5단계: 결정 표 — 어떤 것을 사용해야 할까요?
| 다음과 같은 경우 MCP를 사용하세요... | 다음과 같은 경우 CLI를 사용하세요... |
|---|---|
| 에이전트가 셸 (shell) 액세스 권한이 없는 샌드박스 환경인 경우 (Claude Desktop, 커스텀 채팅 UI) | 에이전트가 셸/파일 시스템 (shell/filesystem) 액세스 권한을 가진 경우 (Claude Code, Copilot, Cursor) |
| ... | ... |
실제로 대부분의 팀은 하나만 선택하지 않습니다. 테스트 작성 및 긴 세션을 위한 기본값으로 CLI를 유지하고, 셸을 사용하기 번거로운 상황에서 빠른 대화형 디버깅을 위한 폴백 (fallback)으로 MCP를 구성해 둡니다.
결론
Playwright MCP와 Playwright CLI는 경쟁 관계라기보다 서로 다른 상황을 위한 도구에 가깝습니다. MCP는 샌드박스 환경에서의 대화형 탐색을 위한 것이고, CLI는 이미 셸 액세스 권한을 가진 에이전트와 함께 토큰 효율적이고 반복 가능한 자동화를 위한 것입니다. 이제 트레이드오프 (tradeoffs)를 알게 되었으므로, 다음 포스트에서는 단순히 이 도구의 선택을 넘어 Claude Code 세션을 위한 일반적인 토큰 절약 습관에 대해 더 자세히 알아보겠습니다.
여러분은 이미 무엇을 사용하고 계신가요 — MCP, CLI, 아니면 둘 다인가요? 댓글로 알려주세요!
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기