agent-browser, Claude Code가 브라우저를 명령 한 줄씩 다루게 하는 Vercel CLI

Claude Code에 내 사이트를 확인해 달라고 하면, 화면을 볼 수 없으니 코드만 보고 짐작할 때가 많습니다. vercel-labs/agent-browser는 에이전트가 셸 명령 한 줄씩 브라우저를 열고, 읽고, 누를 수 있게 해 주는 러스트 CLI입니다. 2026-11-09 기준 깃허브 스타 47,540개, 이번 주 트렌딩에서 일주일 사이 1,476개가 늘었습니다. 라이선스는 Apache-2.0입니다.

쓰는 방식

agent-browser open example.com
agent-browser snapshot -i       # 누를 수 있는 요소마다 번호(ref)
agent-browser click @e1         # 그 번호로 누르기
agent-browser get url           # 결과 확인
agent-browser close

snapshot은 페이지를 짧은 글자 목록으로 돌려주고, 요소마다 @e1 같은 번호를 붙입니다. 에이전트는 번호로 누르고 다시 스냅샷을 찍어 결과를 확인합니다. 페이지가 바뀌면 번호도 바뀌니 새로 찍어야 합니다. CSS 선택자, 글자, 역할로 찾는 방법도 됩니다(agent-browser find role button click --name "Submit").

브라우저는 명령 사이에도 열려 있어서 한 단계가 짧은 셸 호출 하나입니다. 처음 명령에 백그라운드 데몬이 뜨고, 명령이 한 시간 없으면 스스로 닫힙니다.

누른 척하지 않는다

README가 짚는 차이점이 있습니다. 누를 대상이 숨어 있거나, 비활성이거나, 화면 밖이거나, 쿠키 동의 배너 같은 다른 요소에 가려져 있으면 클릭은 성공이라고 보고하지 않고 실패합니다. 에이전트는 가린 요소를 닫고 다시 스냅샷을 찍어 재시도하면 됩니다. “눌렀다고 했는데 아무 일도 없었다”는 헛다리가 줄어듭니다.

설치

npm install -g agent-browser
agent-browser install    # Chrome for Testing 받기 (처음 한 번)

홈브루는 brew install agent-browser 후 agent-browser install. 설치 없이 npx agent-browser open example.com도 됩니다. 맥(ARM64·x64), 리눅스, 윈도 바이너리가 있습니다.

Claude Code에 붙이기

CLI 안에 버전에 맞는 스킬이 들어 있습니다.

agent-browser skills get core          # 기본 사용법
agent-browser skills list              # electron, slack 같은 특화 스킬
npx skills add vercel-labs/agent-browser   # 에이전트에 찾기용 스킬 설치

또는 AGENTS.md(Claude Code는 CLAUDE.md)에 “브라우저 자동화는 agent-browser를 쓰고, 처음 쓰기 전에 agent-browser skills get core를 실행해 따르라”고 적어 두면 됩니다. MCP가 필요하면 agent-browser mcp로 stdio MCP 서버를 띄웁니다.

참고

• vercel-labs/agent-browser README · agent-browser.dev (2026-11-09 확인)