playwright-cli
microsoft/playwright-cli
브라우저 상호작용을 자동화하고, 웹 페이지를 테스트하며, Playwright 테스트를 활용하세요.
...모든 것을 확장하십시오소개 playwright-cli
'playwright-cli' 스킬은 브라우저 상호작용을 자동화하고, 웹 페이지를 테스트하며, Playwright 테스트와 효율적이고 스크립트 기반의 방식으로 통합되도록 설계되었습니다. 이를 통해 개발자와 테스터는 명령줄 인터페이스(CLI)에서 직접 클릭, 입력, 탐색, 페이지 요소와의 상호작용과 같은 사용자 동작을 시뮬레이션할 수 있습니다. 이를 통해 복잡한 코드 설정이 필요 없어지므로 테스트 실행 속도가 빨라지고, 지속적 테스트 워크플로우와의 통합이 원활해집니다. 강력한 명령어 세트를 제공함으로써 브라우저 자동화 작업을 간소화하는 동시에, 브라우징 환경에 대한 높은 정밀도와 제어력을 보장합니다.
자주 묻는 질문
'playwright-cli'로 무엇을 할 수 있나요?
'playwright-cli'을 사용하면 브라우저 상호작용을 자동화하고, 페이지를 탐색하며, 요소와 상호작용하고, 스크린샷을 찍고, 저장소를 조작하는 등 다양한 작업을 수행할 수 있습니다. 이 도구는 마우스, 키보드 동작, 네트워크 라우팅 등을 위한 다양한 명령어를 지원합니다.
'playwright-cli'를 사용하기 위한 필수 조건은 무엇인가요?
'playwright-cli'는 명령어를 실행하기 위한 환경으로 Bash가 필요합니다. 또한 일부 작업에는 'npx' 및 'npm'과 같은 도구가 필요하므로, 컴퓨터에 Node.js와 필요한 패키지가 설치되어 있어야 합니다.
'playwright-cli'는 여러 브라우저 탭을 관리할 수 있나요?
네, 'playwright-cli'에는 새 탭 열기, 탭 닫기, 탭 간 전환, 활성화된 모든 탭 나열과 같은 탭 관리 명령어가 포함되어 있습니다. 간단한 CLI 명령어를 사용하여 여러 브라우저 탭을 동시에 손쉽게 제어할 수 있습니다.
'playwright-cli'는 쿠키와 로컬 스토리지를 어떻게 처리하나요?
'playwright-cli'을 사용하면 데이터 열거, 설정, 조회 및 삭제 명령어를 통해 쿠키, localStorage 및 sessionStorage를 관리할 수 있습니다. 이를 통해 상태 유지 브라우징 세션이 포함된 테스트 시나리오를 구현할 수 있습니다.
'playwright-cli'의 제한 사항은 무엇인가요?
'playwright-cli'는 주로 자동화된 테스트 및 브라우저 상호 작용을 위해 설계되었습니다. Playwright의 모든 기능을 지원하지 않을 수 있으며, 더 복잡하고 프로그래밍 작업이 많은 워크플로에는 적합하지 않을 수 있습니다. 또한, 이 도구는 명령줄 사용을 위해 제작되었으므로 사용 환경에 따라 추가 설정이 필요할 수 있습니다.
Browser Automation with playwright-cli
Quick start
# open new browserplaywright-cli open# navigate to a pageplaywright-cli goto https://playwright.dev# interact with the page using refs from the snapshotplaywright-cli click e15playwright-cli type "page.click"playwright-cli press Enter# take a screenshot (rarely used, as snapshot is more common)playwright-cli screenshot# close the browserplaywright-cli close
Commands
Core
playwright-cli open# open and navigate right awayplaywright-cli open https://example.com/playwright-cli goto https://playwright.devplaywright-cli type "search query"playwright-cli click e3playwright-cli dblclick e7# --submit presses Enter after filling the elementplaywright-cli fill e5 "[email protected]" --submitplaywright-cli drag e2 e8# drop files or data onto an element (from outside the page)playwright-cli drop e4 --path=./image.pngplaywright-cli drop e4 --data="text/plain=hello world"playwright-cli hover e4playwright-cli select e9 "option-value"playwright-cli upload ./document.pdfplaywright-cli check e12playwright-cli uncheck e12playwright-cli snapshotplaywright-cli eval "document.title"playwright-cli eval "el => el.textContent" e5# get element id, class, or any attribute not visible in the snapshotplaywright-cli eval "el => el.id" e5playwright-cli eval "el => el.getAttribute('data-testid')" e5playwright-cli dialog-acceptplaywright-cli dialog-accept "confirmation text"playwright-cli dialog-dismissplaywright-cli resize 1920 1080playwright-cli close
Navigation
playwright-cli go-backplaywright-cli go-forwardplaywright-cli reload
Keyboard
playwright-cli press Enterplaywright-cli press ArrowDownplaywright-cli keydown Shiftplaywright-cli keyup Shift
Mouse
playwright-cli mousemove 150 300playwright-cli mousedownplaywright-cli mousedown rightplaywright-cli mouseupplaywright-cli mouseup rightplaywright-cli mousewheel 0 100
Save as
playwright-cli screenshotplaywright-cli screenshot e5playwright-cli screenshot --filename=page.pngplaywright-cli pdf --filename=page.pdf
Tabs
playwright-cli tab-listplaywright-cli tab-newplaywright-cli tab-new https://example.com/pageplaywright-cli tab-closeplaywright-cli tab-close 2playwright-cli tab-select 0
Storage
playwright-cli state-saveplaywright-cli state-save auth.jsonplaywright-cli state-load auth.json# Cookiesplaywright-cli cookie-listplaywright-cli cookie-list --domain=example.complaywright-cli cookie-get session_idplaywright-cli cookie-set session_id abc123playwright-cli cookie-set session_id abc123 --domain=example.com --httpOnly --secureplaywright-cli cookie-delete session_idplaywright-cli cookie-clear# LocalStorageplaywright-cli localstorage-listplaywright-cli localstorage-get themeplaywright-cli localstorage-set theme darkplaywright-cli localstorage-delete themeplaywright-cli localstorage-clear# SessionStorageplaywright-cli sessionstorage-listplaywright-cli sessionstorage-get stepplaywright-cli sessionstorage-set step 3playwright-cli sessionstorage-delete stepplaywright-cli sessionstorage-clear
Network
playwright-cli route "**/*.jpg" --status=404playwright-cli route "https://api.example.com/**" --body='{"mock": true}'playwright-cli route-listplaywright-cli unroute "**/*.jpg"playwright-cli unroute
DevTools
playwright-cli consoleplaywright-cli console warningplaywright-cli requestsplaywright-cli request 5playwright-cli run-code "async page => await page.context().grantPermissions(['geolocation'])"playwright-cli run-code --filename=script.jsplaywright-cli tracing-startplaywright-cli tracing-stopplaywright-cli video-start video.webmplaywright-cli video-chapter "Chapter Title" --description="Details" --duration=2000playwright-cli video-stop# annotate each subsequent action (click, type, ...) with a callout naming the action and highlighting the targetplaywright-cli video-show-actions --duration=600 --position=top-rightplaywright-cli video-hide-actions# launch the dashboard for UI review / design feedback — user annotates the page, you receive the annotated screenshot, snapshot, and notesplaywright-cli show --annotate# generate a Playwright locator for an element from its ref or selectorplaywright-cli generate-locator e5 --raw# show a persistent highlight overlay for an element, optionally with a custom styleplaywright-cli highlight e5playwright-cli highlight e5 --style="outline: 3px dashed red"# hide a single element highlight, or all page highlights when no target is givenplaywright-cli highlight e5 --hideplaywright-cli highlight --hide
Raw output
The global --raw option strips page status, generated code, and snapshot sections from the output, returning only the result value. Use it to pipe command output into other tools. Commands that don't produce output return nothing.
playwright-cli --raw eval "JSON.stringify(performance.timing)" | jq '.loadEventEnd - .navigationStart'playwright-cli --raw eval "JSON.stringify([...document.querySelectorAll('a')].map(a => a.href))" > links.jsonplaywright-cli --raw snapshot > before.ymlplaywright-cli click e5playwright-cli --raw snapshot > after.ymldiff before.yml after.ymlTOKEN=$(playwright-cli --raw cookie-get session_id)playwright-cli --raw localstorage-get theme
For structured output wrapping every reply as JSON, pass --json
playwright-cli list --json
Open parameters
# Use specific browser when creating sessionplaywright-cli open --browser=chromeplaywright-cli open --browser=firefoxplaywright-cli open --browser=webkitplaywright-cli open --browser=msedge# Use persistent profile (by default profile is in-memory)playwright-cli open --persistent# Use persistent profile with custom directoryplaywright-cli open --profile=/path/to/profile# Connect to browser via Playwright Extensionplaywright-cli attach --extension=chrome# Connect to a running Chrome or Edge by channel nameplaywright-cli attach --cdp=chromeplaywright-cli attach --cdp=msedge# Connect to a running browser via CDP endpointplaywright-cli attach --cdp=http://localhost:9222# Start with config fileplaywright-cli open --config=my-config.json# Close the browserplaywright-cli close# Detach from an attached browser (leaves the external browser running)playwright-cli -s=msedge detach# Delete user data for the default sessionplaywright-cli delete-data
URLs with & on Windows
On Windows, cmd.exe and PowerShell treat & as a command separator, so URLs with multiple query parameters get truncated before playwright-cli runs. Escape & with ^& in cmd.exe, or use --% in PowerShell:
playwright-cli goto "https://example.com/?a=1^&b=2"
playwright-cli --% goto "https://example.com/?a=1&b=2"
Snapshots
After each command, playwright-cli provides a snapshot of the current browser state.
> playwright-cli goto https://example.com### Page- Page URL: https://example.com/- Page Title: Example Domain### Snapshot[Snapshot](.playwright-cli/page-2026-02-14T19-22-42-679Z.yml)
You can also take a snapshot on demand using playwright-cli snapshot command. All the options below can be combined as needed.
# default - save to a file with timestamp-based nameplaywright-cli snapshot# save to file, use when snapshot is a part of the workflow resultplaywright-cli snapshot --filename=after-click.yaml# snapshot an element instead of the whole pageplaywright-cli snapshot "#main"# limit snapshot depth for efficiency, take a partial snapshot afterwardsplaywright-cli snapshot --depth=4playwright-cli snapshot e34# include each element's bounding box as [box=x,y,width,height]playwright-cli snapshot --boxes
Targeting elements
By default, use refs from the snapshot to interact with page elements.
# get snapshot with refsplaywright-cli snapshot# interact using a refplaywright-cli click e15
You can also use css selectors or Playwright locators.
# css selectorplaywright-cli click "#main > button.submit"# role locatorplaywright-cli click "getByRole('button', { name: 'Submit' })"# test idplaywright-cli click "getByTestId('submit-button')"
Browser Sessions
# create new browser session named "mysession" with persistent profileplaywright-cli -s=mysession open example.com --persistent# same with manually specified profile directory (use when requested explicitly)playwright-cli -s=mysession open example.com --profile=/path/to/profileplaywright-cli -s=mysession click e6playwright-cli -s=mysession close # stop a named browserplaywright-cli -s=mysession delete-data # delete user data for persistent sessionplaywright-cli list# Close all browsersplaywright-cli close-all# Forcefully kill all browser processesplaywright-cli kill-all
Installation
If global playwright-cli command is not available, try a local version via npx playwright-cli:
npx --no-install playwright-cli --version
When local version is available, use npx playwright-cli in all commands. Otherwise, install playwright-cli as a global command:
npm install -g @playwright/cli@latest
Example: Form submission
playwright-cli open https://example.com/formplaywright-cli snapshotplaywright-cli fill e1 "[email protected]"playwright-cli fill e2 "password123"playwright-cli click e3playwright-cli snapshotplaywright-cli close
Example: Multi-tab workflow
playwright-cli open https://example.complaywright-cli tab-new https://example.com/otherplaywright-cli tab-listplaywright-cli tab-select 0playwright-cli snapshotplaywright-cli close
Example: Debugging with DevTools
playwright-cli open https://example.complaywright-cli click e4playwright-cli fill e7 "test"playwright-cli consoleplaywright-cli requestsplaywright-cli closeplaywright-cli open https://example.complaywright-cli tracing-startplaywright-cli click e4playwright-cli fill e7 "test"playwright-cli tracing-stopplaywright-cli closeExample: Interactive session
Ask the user for UI review or design feedback. The user draws boxes on the live page and types comments; you receive the annotated screenshot, the snapshot of the marked region, and the user's notes. Use this whenever the user asks for "UI review", "design feedback", or to "ask the user what they think / want / mean":
playwright-cli open https://example.complaywright-cli show --annotate
Specific tasks
- Running and Debugging Playwright tests references/playwright-tests.md
- Request mocking references/request-mocking.md
- Running Playwright code references/running-code.md
- Browser session management references/session-management.md
- Spec-driven testing (plan / generate / heal) references/spec-driven-testing.md
- Storage state (cookies, localStorage) references/storage-state.md
- Test generation references/test-generation.md
- Tracing references/tracing.md
- Video recording references/video-recording.md
- Inspecting element attributes references/element-attributes.md
모든 파일
10개 파일playwright-cli 설치
스킬 파일을 다운로드하여 .claude/skills/ 디렉터리에 압축을 풀어주세요.
ZIP 다운로드저장소를 클론하고 스킬 파일을 프로젝트에 복사하세요.
git clone https://github.com/microsoft/playwright-cli/blob/main/skills/playwright-cli/SKILL.md # Copy SKILL.md to your .claude/skills/ directory
복사





집
