# Playwright MCP - LLM을 위한 웹 브라우저 자동화용 MCP 서버

> Clean Markdown view of GeekNews topic #19987. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=19987](https://news.hada.io/topic?id=19987)
- GeekNews Markdown: [https://news.hada.io/topic/19987.md](https://news.hada.io/topic/19987.md)
- Type: GN+
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2025-03-27T10:13:35+09:00
- Updated: 2025-03-27T10:13:35+09:00
- Original source: [github.com/microsoft](https://github.com/microsoft/playwright-mcp)
- Points: 20
- Comments: 4

## Summary

Playwright MCP 서버는 LLM이 웹 페이지와 상호작용할 수 있도록 구조화된 접근성 스냅샷을 제공하여 빠르고 가벼운 웹 자동화를 구현합니다. 이 서버는 스크린샷이나 비전 모델 없이 구조화된 텍스트 기반 데이터만을 사용하며, 웹 페이지 탐색, 폼 자동 작성, 데이터 추출, 자동화 테스트, 일반 웹 브라우저 제어 등의 용도로 활용됩니다. 다양한 도구 목록을 통해 URL 이동, 요소 클릭, 텍스트 입력, 스냅샷 캡처 등 다양한 웹 브라우저 작업을 수행할 수 있습니다.

## Topic Body

- Playwright를 기반으로 동작하는 MCP(Model Context Protocol) 서버  
- LLM이 웹 페이지와 상호작용할 수 있도록 구조화된 접근성 스냅샷을 제공하여 **빠르고 가벼움**  
- 스크린샷이나 비전 모델 없이 구조화된 텍스트 기반 데이터만으로 웹 자동화를 구현  
- **용도** : 웹 페이지 탐색 및 폼 자동 작성, 구조화된 콘텐츠에서의 데이터 추출, LLM 기반 자동화 테스트, 에이전트 기반 일반 웹 브라우저 제어  
  
### 설치   
- config   
  ```js  
  {  
    "mcpServers": {  
      "playwright": {  
        "command": "npx",  
        "args": [  
          "@playwright/mcp@latest"  
        ]  
      }  
    }  
  }  
  ```  
- VSCode에 바로 설치 가능 : [Install in VS Code Insiders](https://insiders.vscode.dev/redirect?url=vscode-insiders%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522-y%2522%252C%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D)  
  - 설치 후, VSCode의 GitHub Copilot 에이전트에서 Playwright MCP를 사용할 수 있음  
  
### Snapshot Mode 도구 목록  
  
- **browser_navigate**: URL로 이동  
- **browser_go_back / go_forward**: 뒤로/앞으로 이동  
- **browser_click / hover / drag**: 요소 클릭, 호버, 드래그  
- **browser_type**: 입력란에 텍스트 입력 (옵션: `submit`)  
- **browser_select_option**: 드롭다운 선택  
- **browser_press_key**: 키보드 키 입력  
- **browser_snapshot**: 접근성 스냅샷 캡처  
- **browser_save_as_pdf**: 페이지를 PDF로 저장  
- **browser_wait**: 지정 시간 대기 (`time`은 최대 10초)  
- **browser_close**: 페이지 닫기  
  
### Vision Mode 도구 목록  
  
- **browser_navigate / go_back / go_forward**  
- **browser_screenshot**: 스크린샷 캡처  
- **browser_move_mouse / click / drag**: 좌표 기반 마우스 제어  
- **browser_type**: 좌표 위치에 텍스트 입력  
- **browser_press_key**  
- **browser_save_as_pdf**  
- **browser_wait**  
- **browser_close**

## Comments



### Comment 37428

- Author: yangeok
- Created: 2025-04-21T14:11:46+09:00
- Points: 1

cursor에 playwright mcp 연결해봤는데, 나무위키 페이지는 아예 읽지 못하네요..

### Comment 37431

- Author: asheswook
- Created: 2025-04-21T15:36:34+09:00
- Points: 1
- Parent comment: 37428
- Depth: 1

아마 봇 차단때문에 그런 것 같습니다.

### Comment 36434

- Author: crawler
- Created: 2025-03-28T08:36:24+09:00
- Points: 2

어제 봤을 땐 몰랐는데 마이크로소프트네요 ㄷㄷ 써봐야겠다

### Comment 36402

- Author: neo
- Created: 2025-03-27T10:13:35+09:00
- Points: 1

###### [Hacker News 의견](https://news.ycombinator.com/item?id=43485740) 
* 이 도구는 매우 좋음. Claude Code와 함께 사용하여 큰 성공을 거두고 있음
  - CLAUDE.md에 Playwright로 변경 사항을 검증하라는 지시를 남겨둠
  - 자동으로 개발 서버를 시작하고, 변경된 페이지로 이동하여 변경 사항이 작동하는지 검증함
  - 예기치 않은 것이 있으면 스스로 수정함
  - 정말 뛰어난 중급 엔지니어와 함께 일하는 것 같음
  - 지금이 정말 놀라운 시대임

* ariaSnapshot를 사용하여 DOM의 접근 가능한 표현을 제공함
  - 그러나 Gmail 같은 곳으로 이동하면 모델 컨텍스트가 빠르게 소진됨
  - 더 간결한 페이지의 텍스트 표현을 실험 중임
  - 자신의 크롬 세션을 사용하고 큰 컨텍스트 크기가 필요하지 않음
  - CDP에 사용할 수 있는 aria 인터페이스로 리팩토링할 수도 있음

* JIRA MCP와 결합하여 버그 티켓의 "재현 단계"를 읽고 실제로 재현할 수 있는지 확인할 예정임
  - MCP에 대한 비판을 이해하지 못하겠음
  - "커넥터"의 캄브리아 폭발을 보는 것은 정말 흥미로움
  - 이는 OpenAI의 커스텀 GPTs가 되지 못했던 모델의 "앱 스토어"가 될 것임

* Microsoft의 새로운 도구는 MCP-Playwright의 경쟁자로 보임
  - Microsoft의 도구가 더 간단해 보이며, 다른 도구는 더 많은 기능을 가짐

* 훌륭한 릴리스임. 그러나 왜 원래의 Playwright API를 지원하지 않고 행동의 하위 집합만 지원하는지 궁금함

* Playwright를 모르지만, Puppeteer와 어떻게 다른지 궁금함
  - Puppeteer의 문제는 쿠키 동의 배너 수락과 같은 간단한 작업을 완료하기 위한 올바른 자바스크립트를 즉시 얻지 못할 때가 있음

* 여러 번 제출했으며 더 많은 이야기를 듣고 싶음
  - Fetch-MCP도 있으며, 이는 Playwright 기반으로 배치를 지원함. 비교해보면 흥미로울 것임

* Capybara를 위한 MCP가 필요함. LLMs가 나의 Rails 시스템 테스트를 작성하고 작동하지 않을 때 디버그할 수 있도록

* "code --add-mcp"
  - Vscode에 내장된 MCP 클라이언트가 있는지 궁금함

* 이 도구는 테스트 자동화를 위한 것인지, 아니면 에이전트에서 "Operator"로 Playwright를 사용하는 것인지 궁금함
