🔧MCP
AI 코딩 에이전트를 위한 Chrome DevTools MCP 서버
AI 코딩 어시스턴트가 Chrome 브라우저를 제어하고 디버깅할 수 있게 해주는 MCP 서버
↗ 원본 링크#Chrome DevTools#MCP#브라우저 자동화#퍼포먼스 분석
개요
chrome-devtools-mcp는 Gemini, Claude, Cursor, Copilot 같은 AI 코딩 에이전트가 실행 중인 Chrome 브라우저를 제어하고 검사할 수 있게 해주는 MCP(Model Context Protocol) 서버입니다.
주요 기능
1. 성능 분석
▸Chrome DevTools를 활용해 성능 트레이스 기록
▸실행 가능한 성능 개선 인사이트 추출
2. 고급 브라우저 디버깅
▸네트워크 요청 분석
▸스크린샷 캡처
▸브라우저 콘솔 메시지 확인 (소스맵 스택 트레이스 지원)
3. 안정적인 자동화
▸Puppeteer 기반의 Chrome 자동화
▸작업 결과를 자동으로 대기하여 안정성 확보
특징
▸
간편한 통합: MCP 프로토콜을 통해 AI 어시스턴트와 쉽게 연결
▸
CLI 지원: MCP 없이도 커맨드라인으로 사용 가능
▸
전체 DevTools 기능: Chrome DevTools의 모든 기능을 AI 에이전트에 제공
주의사항
⚠️ 보안: 브라우저의 모든 데이터가 MCP 클라이언트에 노출될 수 있으므로, 민감한 정보는 공유하지 않도록 주의해야 합니다.
⚠️ 지원 브라우저: Google Chrome과 Chrome for Testing만 공식 지원하며, 다른 Chromium 기반 브라우저는 예상치 못한 동작이 발생할 수 있습니다.
설치
bash
npm install chrome-devtools-mcp사용 사례
▸웹 애플리케이션 성능 최적화
▸자동화된 브라우저 테스트
▸실시간 디버깅 및 문제 해결
▸AI 기반 웹 개발 워크플로우 구축