custom-chrome-dev-mcp
Custom Chrome Dev MCP
로컬 전용 MCP(Model Context Protocol) 서버로, MCP 클라이언트(Claude Code 또는 MCP를 말할 수 있는 다른 무엇이든)가 사용자의 실제 Chrome 브라우저를 사람이 하듯이 조작할 수 있게 해줍니다. 원격 측정(telemetry)도, 타사 서비스도, 클라우드도 없습니다. 모든 것이 공유 토큰 뒤에서 사용자 머신에서만 실행됩니다.
45개의 도구를 탐색, 탭, 인식, 상호작용, 신뢰 입력, 관찰 가능성, 캡처 영역에 걸쳐 제공합니다.
이 프로젝트의 유래
이 프로젝트는 Chrome의 공식 브라우저 MCP에서 영감을 받았습니다 - Chrome DevTools 팀이 배포한 Chrome DevTools MCP 서버가 바로 그것이며, AI 에이전트가 스크랩한 HTML이 아닌 DevTools 프로토콜을 통해 브라우저를 조작해야 한다는 주장을 처음으로 제기했습니다.
우리는 그 아이디어를 복제하고 모방하는 것이지, 그대로 배포하는 것이 아닙니다. 우리가 차용한 것:
전제 - 브라우저를 MCP 도구 집합으로 에이전트에 노출.
접근성 우선 인식 - 원시 HTML 벽 대신 안정적인 요소 참조가 포함된 간결한 a11y 개요를 모델에 전달.
입력 계층으로서의 Chrome DevTools 프로토콜 - 페이지가 감지하고 무시할 수 있는 합성 이벤트 대신 실제 신뢰할 수 있는 이벤트.
이 프로젝트가 의도적으로 갈라서는 부분:
Chrome DevTools MCP | Custom Chrome Dev MCP | |
브라우저 | 기본적으로 전용 user-data-dir로 자체 Chrome을 실행하며, | 오직 사용자가 이미 열어 둔 Chrome만 조작함 |
연결 방식 | DevTools 프로토콜 엔드포인트를 통해 브라우저에 연결 | 브라우저 내부에 살아 있는 Chrome 확장 프로그램이 선택한 탭을 가리킴 |
주요 목표 | 페이지 디버깅, 검사, 프로파일링 | 그 페이지를 사용하는 인간처럼 행동하기 |
마지막 행이 이 저장소의 전부입니다. Chrome DevTools MCP는 우연히 브라우저를 조작하는 디버깅 도구이고, 이것은 우연히 디버깅에 유용한 사람-흉내 도구입니다.
⚠️ Google 또는 Chrome 팀과 제휴, 보증, 지원 관계가 아닙니다. 이것은 그들의 설계를 배우고 모방하기 위해 만들어진 독립적인 재구현입니다. 지원되는 것을 원한다면 공식 서버를 사용하세요.
Related MCP server: monkeysee
의도적으로 인간의 스타일을 유지합니다
대부분의 브라우저 자동화는 쉽게 감지됩니다: isTrusted=false인 합성 이벤트, 실제로 움직이지 않는 포커스, 한 번에 모두 나타나는 필드 텍스트, 기록이 없는 깨끗한 자동화 프로필. 이 모든 것이 신호입니다.
이 프로젝트는 이러한 신호를 제거하려고 합니다:
사용자의 실제 프로필. 이미 사용 중인 Chrome에서 작업이 실행됩니다 - 쿠키, 로그인, 확장 프로그램, 기록까지. "새 자동화"로 지문 인식될 것이 없습니다.
신뢰할 수 있는 입력.
realClick,realType,press,hover,drag는 DevTools 프로토콜을 통해 전달되므로 페이지는isTrusted=true인 이벤트를 받습니다 - 물리적 마우스와 키보드가 만드는 것과 동일한 플래그입니다.진짜 포커스. 필드를 클릭하여 포커스하면 페이지 몰래
.value를 할당하는 대신 실제로 순서대로 포커스가 이동합니다.실제 키 입력.
press는 올바른 키 코드와 수정자를 가진 적절한rawKeyDown/char/keyUp시퀀스를 발생시킵니다. 단일 합성input이벤트가 아닙니다.읽기-확인 검증.
fill은 필드가 실제로 텍스트를 보유하고 있는지 확인하므로, 페이지가 입력을 조용히 거부했을 때 에이전트가 사람처럼 알아차립니다.
목표: 페이지가 에이전트에게 키보드 앞에 앉은 사람에게 행동하는 것과 정확히 동일하게 행동해야 합니다.
빠른 합성 도구(click, type)도 여전히 있습니다 - 더 빠르고 대부분의 사이트에서 작동합니다. 페이지가 무시하면 신뢰할 수 있는 동등 도구를 사용하세요.
작동 방식
하나의 전송 방식입니다. MCP 클라이언트는 stdio를 통해 서버와 통신하고, 서버는 작고 오래 지속되는 허브 프로세스가 소유한 로컬 WebSocket을 통해 Chrome 확장 프로그램으로 중계합니다.
MCP client 1 (Claude) <-stdio-> bin/custom-chrome-dev-mcp.js ─┐
MCP client 2 (Claude) <-stdio-> bin/custom-chrome-dev-mcp.js ─┼─ src/hub.js (127.0.0.1:9876)
MCP client N (Claude) <-stdio-> bin/custom-chrome-dev-mcp.js ─┘ │
│ WebSocket
▼
Chrome extension -> active tab별도의 허브 프로세스가 필요한 이유. 하나의 프로세스만 포트 9876을 소유할 수 있지만, 여러 Claude 세션이 열려 있고 모두 브라우저를 원할 수 있습니다. 그래서 소켓은 어떤 단일 세션 내부가 아닌 src/hub.js에 있습니다. 각 세션은 role:"mcp"로 허브에 연결하고, 확장 프로그램은 role:"extension"으로 연결하며, 허브는 그들 사이에서 다중화합니다. 첫 번째 세션이 시작되면 허브를 분리된(detached) 상태로 생성하므로 그 세션보다 오래 지속됩니다. 이후 세션은 이미 수신 대기 중인 허브를 찾습니다.
확장 프로그램 내부에는 세 가지 계층이 있습니다:
Walker (
page/walker.js) - 페이지의 ISOLATED world에 주입됩니다. 요소 해석, 안정적인eN참조 맵, 빠른 합성 DOM 작업을 담당합니다.CDP (
cdp/) - 신뢰 입력, 페이지 컨텍스트evaluate, 전체 페이지 스크린샷, 콘솔/네트워크 버퍼를 위한chrome.debugger.Recording (
recording/) - 오프스크린 문서의MediaRecorder가.webm으로 인코딩하는 CDP 스크린캐스트 프레임.
🔒 확장 프로그램은 공유 토큰(
AUTH_TOKEN,src/config.js와extension/src/config.js에 동일하게 있음)으로 허브에 인증합니다. 허브는 다른 값을 제시하는 피어를 연결 해제합니다.
사전 요구 사항
요구 사항 | 확인 방법 | |
Node.js | 18 이상 (22에서 개발됨) |
|
Chrome | Google Chrome 또는 Chromium, 최신 버전이면 충분 |
|
MCP 클라이언트 | Claude Code 또는 stdio로 MCP를 말할 수 있는 다른 무엇이든 |
|
전역 설치도, 빌드 단계도, 가입할 서비스도 없습니다. 런타임 의존성 두 개(@modelcontextprotocol/sdk와 ws)뿐이고 모든 것이 127.0.0.1에 유지됩니다.
로컬 설정
네 단계, 그리고 검증 절차. 5분이면 충분합니다.
1. 클론 및 설치
git clone <your-fork-url> custom-chrome-dev-mcp
cd custom-chrome-dev-mcp
npm installChrome에 연결하기 전에 트리가 정상인지 확인하세요 - 오프라인 경로는 브라우저가 필요 없고 1초도 걸리지 않습니다:
npm test22 passed가 보이면 됩니다. 실패하면 계속하기 전에 고치세요. 이후의 모든 것은 작동하지 않습니다.
2. Chrome에 확장 프로그램 로드
chrome://extensions를 엽니다.개발자 모드(오른쪽 상단 토글)를 켭니다.
압축 해제된 확장 프로그램 로드를 클릭하고
extension/폴더를 선택합니다 - 폴더 자체를 선택해야 하며, 그 안의manifest.json이 아닙니다.Custom-chrome-dev-mcp가 목록에 나타납니다.
⚠️ 실제로 사용하는 Chrome 프로필에 로드하세요. Chrome은 확장 프로그램을 프로필별로 유지하므로 "Profile 4"에 로드된 확장 프로그램은 "Default"로 실행 중인 창에는 보이지 않습니다. 나중에 도구가 탭이 없다고 보고하거나 허브가
extension connected를 기록하지 않으면 이것이 가장 먼저 확인할 사항입니다.chrome://version에 활성 프로필 경로가 표시됩니다.
확장 프로그램 ID는 extension/manifest.json의 공개 key에 의해 고정되므로 모든 머신에서 동일합니다 - 설정 간에 복사할 것이 없습니다.
3. MCP 서버를 클라이언트에 등록
CLI를 사용하세요 - 저장소를 클론한 절대 경로로 대체하세요(프로젝트 루트에서 pwd를 실행하면 출력됩니다):
claude mcp add -s user custom-chrome-dev-mcp -- node /ABSOLUTE/PATH/TO/custom-chrome-dev-mcp/bin/custom-chrome-dev-mcp.js-s user는 모든 프로젝트에 등록하고,-s local은 이 프로젝트로만 제한합니다.bin/custom-chrome-dev-mcp.js를 등록하세요 - 이 파일이 진입점입니다.src/server.js를 가리키면 작동하지 않습니다.경로는 절대 경로여야 합니다. 상대 경로는 클라이언트가 우연히 시작한 디렉터리를 기준으로 해석됩니다.
claude mcp list로 확인하세요 - 옆에✔ Connected가 보이면 됩니다.
⚠️
~/.claude.json을 직접 편집하지 마세요. 파일이 크고, 쉼표 하나 잘못 두면 Claude Code 전체가 깨집니다. 위 명령이 안전하게 편집합니다.
mcpServers 아래에 서버를 추가하세요:
{
"mcpServers": {
"custom-chrome-dev-mcp": {
"command": "node",
"args": ["/ABSOLUTE/PATH/TO/custom-chrome-dev-mcp/bin/custom-chrome-dev-mcp.js"]
}
}
}4. MCP 클라이언트 재시작
MCP 클라이언트는 시작 시 도구를 한 번만 열거합니다 - 세션 중간에 등록된 서버는 재시작할 때까지 보이지 않습니다. Claude를 재시작하면 45개의 도구가 나타납니다.
재시작 시 클라이언트가 서버를 실행하고, 서버는 127.0.0.1:9876에서 수신 대기 중인 것이 없으면 src/hub.js를 생성합니다.
5. 체인의 세 링크 모두 검증
스택은 클라이언트 → 서버 → 허브 → 확장 프로그램 → 탭입니다. 어느 링크가 끊어졌는지 추측하지 말고 끝에서 끝까지 확인하세요.
# The hub is up, and the extension found it:
tail -f "$TMPDIR/custom-chrome-dev-mcp-hub.log"
# [hub] listening on 127.0.0.1:9876
# [hub] extension connected <- this line is the handshake succeeding
# Who owns the port (should be src/hub.js from THIS repo):
lsof -nP -iTCP:9876 -sTCP:LISTEN그런 다음 클라이언트에 listTabs 를 요청하세요. 열린 탭의 JSON 배열이 반환되면 모든 링크가 작동하는 것입니다. 이어서 screenshot 을 요청하세요 - PNG가 ~/Downloads에 저장되고 그리고 인라인으로도 돌아옵니다.
확장 프로그램 자체 콘솔은: chrome://extensions → Custom-chrome-dev-mcp → 서비스 워커 → Inspect입니다. 확장 프로그램 측 오류가 표시되는 곳이며, MCP 클라이언트에는 절대 도달하지 않습니다.
6. 실제 사용 전에 공유 토큰 변경
AUTH_TOKEN은 기본값과 함께 제공되며 src/config.js 와 extension/src/config.js 에 동일하게 정의되어 있습니다. 이것이 사용자 머신의 다른 프로세스가 로그인된 브라우저를 조작하는 것을 막는 유일한 수단입니다. 자신만의 값으로 바꾸고 두 파일 모두에서 변경한 다음(오프라인 테스트가 일치 여부를 확인합니다), 확장 프로그램을 다시 로드하세요.
코드를 변경한 후
두 부분은 다르게 다시 로드되며, 이걸 잘못하면 이 프로젝트에서 다른 무엇보다 시간을 낭비하게 됩니다:
수정한 곳 | 반영 방법 |
|
|
| MCP 클라이언트를 재시작하세요. 서버 프로세스는 오래 지속되며 이전 도구 스키마를 보유하고 있습니다. |
|
|
문제 해결
| Symptom(증상) | 원인 | 해결 | | ... |
도구 | 인자 | 설명 |
| target / | 신뢰된(Trusted) 클릭. 우클릭과 더블클릭 포함. |
| target?, | 신뢰된 텍스트 입력. target이 주어지면 먼저 포커스함. |
|
| 신뢰된 키 및 조합: |
| target / | 실제 마우스를 요소 위로 이동하여 |
|
| 신뢰된 누르기-이동-놓기 드래그 앤 드롭. |
|
| OS 파일 선택기를 우회하여 |
|
| 반응형 확인을 위한 뷰포트/기기 에뮬레이션. |
|
| 다음 |
| - | 디버거를 분리하고 배너를 제거. 다음 CDP 호출 시 다시 연결됨. |
관측성 - CDP, 탭별 버퍼링
디버거가 연결될 때 캡처가 시작되므로, 로드 시점 활동을 원한다면 첫 CDP 호출 후 페이지를 새로고침하세요.
도구 | 인자 | 설명 |
|
| 버퍼링된 콘솔 로그, 경고, 오류 및 처리되지 않은 예외. |
|
| 버퍼링된 요청: 메서드, URL, 상태, 유형, 타이밍. |
|
| 단일 요청 전체; |
|
| CDP를 통해 페이지의 실제 컨텍스트에서 JS 실행 - |
캡처
캡처 디렉터리(~/Downloads가 기본값 - Configuration 참조)에 저장됨.
도구 | 인자 | 설명 |
|
| 보이는 뷰포트를 PNG/JPEG로 - 디스크에 저장되고 인라인으로 반환되며 |
|
| CDP를 통해 뷰포트 너머의 전체 스크롤 가능한 페이지. |
|
|
|
path는 캡처 디렉터리 내부의 파일명 또는 경로. 누락된 하위 폴더는 생성되며,
디렉터리 밖으로 해석되는 모든 경로는 거부됨.
첫 실제 실행
설정 5단계는 연결이 되었는지 증명합니다. 이번에는 흥미로운 부분, 즉 페이지가 스크립트가 아닌 사람을 보는지 증명합니다. 클라이언트를 아무 페이지에 연결하고 다음을 요청하세요:
snapshotA11y-eN참조가 포함된 간결한 개요.realClick {ref:"e3"}- 신뢰된 클릭. 탭에 노란색 "being debugged" 배너가 나타납니다. 이것이 CDP 연결이며, 의도된 가시적 신호입니다.evaluate {expression:"'ok'"}- 콘텐츠 스크립트 CSP를 우회하는 페이지 컨텍스트 JS.screenshot- 캡처 디렉터리의 PNG 그리고 인라인 반환.record {action:"start"}…record {action:"stop", path:"clip.webm"}- 탭의.webm녹화. 툴바 클릭이나 사용자 제스처 불필요; 툴바 아이콘은 설계상 비활성이며 아무것도 시작하지 않음.detach- 배너 제거.
신뢰된 경로가 만드는 차이를 보려면 리스너를 설치하고 비교하세요:
// via evaluate
window.__e = []; document.querySelector("button")
.addEventListener("click", e => window.__e.push(e.isTrusted));click은 false를 보고하고 realClick은 true를 보고합니다. 이 대비가 이 프로젝트의
핵심이며, 브라우저 테스트 레인은 이를 직접 검증합니다.
테스트 실행
테스트 스위트에는 두 개의 레인이 있으며, 그 분리가 핵심입니다.
오프라인 레인 - 브라우저 없음, CI에서 실행
npm test # node test/run.mjs --lane=offline1초 미만으로 완료되며 Node만 필요합니다. src/server.js에 대해 인프로세스 실제 MCP
핸드셰이크를 실행하므로(SDK의 인메모리 전송 사용), 서버가 실제로 게시하는 표면을 검증합니다:
게시된 모든 도구에 확장 핸들러가 있고 그 반대도 성립 - 미러링된 아키텍처가 초대하는 실패
어떤 도구 이름도 두 핸들러 그룹이 주장하지 않음(스프레드로 병합되므로 중복은 조용히 손실됨)
모든 도구에 실제 설명과 공통
tabId/frameId/expectUrl범위가 있음모든 도구가 최소 하나의 테스트로 실행됨 - 테스트 없이 도구를 추가하면 브라우저 없이도 CI 실패
캡처 경로 허용 목록이 실제로
.., 깊은.., 절대 경로 및 심볼릭 링크 탈출을 거부하는지 실제 리졸버로 테스트금지 목록은 동작으로 검사 - 주장하는 것을 차단하고 일반 사이트를 과도하게 차단하지 않음
허브는 루프백만 바인딩, 양쪽 토큰 일치, 매니페스트가 과도한 권한을 요청하지 않음, 툴바 아이콘은 비활성,
*.pem은 커밋되지 않음
브라우저 레인 - 실제 Chrome 구동
# 1. Disconnect the MCP client (close Claude Code, or disable this server for the run)
# 2. Free port 9876 - the hub is long-lived and outlives the session that spawned it
pkill -f src/hub.js
# 3. Start the suite; it binds 9876 itself and waits for the extension
npm run test:browser
# 4. Reload the extension in chrome://extensions so it connects to the suite⚠️ 1단계는 선택 사항이 아닙니다. 연결된 MCP 클라이언트는 소켓이 사라진 것을 발견할 때마다 약 1.2초마다 허브를 다시 생성하므로, 포트 9876을 즉시 되찾아 스위트가
EADDRINUSE로 죽습니다. 클라이언트가 아직 연결된 상태에서 허브를 죽여도 소용없습니다 - 클라이언트가 다른 허브를 시작할 뿐입니다.
스위트는 픽스처 서버와 실제 허브와 동일한 와이어 프로토콜을 사용하는 브리지를 구성하므로, 통과하는 실행은 실제 메시지 계약을 검증합니다. 각 스위트는 도구 그룹을 미러링하며, 모든 테스트는 리셋된 픽스처 페이지에서 시작합니다 - 어떤 테스트도 다른 테스트의 변경을 상속하지 않습니다.
끝에는 도구 커버리지를 출력하고 45개 도구 중 하나라도 실행되지 않으면 실패합니다.
옵션
명령 | 효과 |
| 오프라인 레인만 - CI 게이트 |
| 브라우저 레인만 |
| 둘 다 |
| 실행 없이 모든 스위트와 테스트 나열 |
| 스위트/이름이 일치하는 테스트만 |
테스트 구조
test/
├── run.mjs # CLI: lanes, filtering, coverage, reporting
├── lib/
│ ├── runner.js # suite registry, isolation, timeouts
│ ├── assert.js # assertions with diagnostic messages
│ ├── wait.js # eventually() - polling, not fixed sleeps
│ ├── mcp-probe.js # real in-process MCP handshake
│ ├── bridge.js # stands in for the hub; tracks tool coverage
│ ├── fixture-server.js # serves the fixture pages
│ └── page.js # the browser session + per-test reset
├── fixtures/
│ ├── index.html # the fixture page (a real file, with __reset())
│ └── frame.html # child frame, for frameId targeting
└── suites/
├── 01-contract.suite.js # offline
├── 02-security.suite.js # offline
├── 10-navigation.suite.js
├── 20-tabs.suite.js
├── 30-perception.suite.js
├── 40-interaction.suite.js
├── 50-trusted-input.suite.js
├── 60-observability.suite.js
└── 70-capture.suite.js보안 참고 사항
이 확장 프로그램은 로그인된 브라우저를 제어할 수 있습니다. 이 섹션을 읽으세요.
루프백 전용. 허브는
127.0.0.1에 바인딩되므로 LAN에서는 접근 불가 - 이 머신의 프로세스만 접근 가능.토큰 핸드셰이크. 피어는 연결 시
AUTH_TOKEN을 제시해야 하며, 그렇지 않으면 허브가 연결을 끊습니다. 기본 제공 값(src/config.js와extension/src/config.js의 동일한 상수)에서 변경하세요 - 이것이 다른 로컬 프로세스가 브라우저를 제어하는 것을 막는 수단입니다.파일 쓰기는 캡처 디렉터리로 제한됨.
src/capture/capture-path.js는 모든 요청 경로를 해석하고..탐색 및 심볼릭 링크된 하위 디렉터리를 통한 탈출을 포함해 그 밖의 모든 것을 거부합니다. 이는 보기보다 중요합니다: 임의 경로 쓰기는 사실상 코드 실행입니다.호스트 금지 목록.
extension/src/config.js의BANLIST는 민감한 도메인(은행, PayPal, Gmail)에 대한 탐색 및 스크립팅을 차단합니다. 필요에 따라 조정하세요. 참고: 스크린샷과 녹화는 렌더링된 픽셀을 캡처하며 금지 목록의 필터를 받지 않습니다.디버거 배너는 기능입니다. CDP 도구는
chrome.debugger를 연결하여 지속적인 노란색 "being debugged" 바를 표시합니다. 이것은 무언가가 탭을 제어하고 있다는 가시적 신호입니다.detach가 이를 제거합니다.evaluate는 페이지의 실제 컨텍스트에서 임의 JS를 실행합니다.내부 페이지는 제한됨 - 확장 프로그램은
chrome://또는chrome-extension://URL을 스크립팅할 수 없습니다.서명 키는 이 저장소에 없습니다. 확장 프로그램 ID는
extension/manifest.json의 공개key로 고정됩니다. 일치하는 개인 키는 버전 관리 밖에 있어야 합니다 (.gitignore가*.pem을 차단). 동일한 ID로.crx를 다시 패키징할 때만 필요하며, 압축 해제 로드는 이를 사용하지 않습니다.
아키텍처
서버와 확장 프로그램은 미러링되어 있습니다. src/tools/의 모든 도구 그룹에는
extension/src/handlers/에 동일한 이름의 핸들러 파일이 있습니다. 도구를 추가한다는 것은
정확히 그 쌍을 수정한다는 뜻입니다 - 한쪽에는 스키마와 문서, 다른 쪽에는 구현.
그룹 | 서버(스키마 + 문서) | 확장 프로그램(구현) |
navigation |
|
|
tabs |
|
|
perception |
|
|
interaction |
|
|
trusted input |
|
|
observability |
|
|
capture |
|
|
그 외 모든 것은 지원 인프라입니다:
bin/custom-chrome-dev-mcp.js- MCP 클라이언트에 등록하는 실행 파일입니다. 서버를 시작하는 것 외에는 아무것도 하지 않습니다.src/config.js/extension/src/config.js- 조정 가능한 모든 설정이 각 측에 하나의 파일로 있습니다.AUTH_TOKEN과 포트는 양쪽에서 일치해야 합니다.src/relay/hub-client.js-role:"mcp"로 허브에 연결하고, 허브가 없으면 생성하며, 각 도구 호출을 소켓을 통한 요청/응답으로 변환합니다.src/hub.js-ws://127.0.0.1:9876을 소유하는 장수명 릴레이입니다. 하나의 확장 프로그램 소켓과 모든 세션의 클라이언트를 보유하고 그 사이에서 멀티플렉싱합니다. 전선상의 id를 다시 태깅하고(세션 간 충돌할 수 있음) 이미 허브가 포트를 소유하고 있으면 자체 종료합니다.src/capture/capture-path.js- 쓰기 허용 목록입니다. 모든 캡처 경로가 이를 통과합니다.extension/src/connection.js- 허브 소켓과 하트비트입니다. MV3 서비스 워커는 약 30초 유휴 후 종료되어 소켓을 조용히 끊습니다. 30초 미만의 하트비트가 둘 다 유지하고, 알람이 강제 종료 후 워커를 부활시킵니다.extension/src/tabs.js- 호출이 작동하는 탭(명시적tabId> 고정 탭 > 활성 탭),expectUrl가드, 금지 목록 확인입니다.extension/src/walker-bridge.js+extension/src/page/walker.js- 안정적인 요소 참조 시스템을 갖춘 주입된 ISOLATED-world 스크립트이자, 그곳에 도달하는 방법을 아는 유일한 모듈입니다.extension/src/cdp/-session.js(연결/해제,cdp(), 요소 중심점),keyboard.js(키 이름 → CDP 키 이벤트),dialogs.js(네이티브 대화상자 정책),buffers.js(콘솔 + 네트워크 링 버퍼, 탭당 500개로 제한).extension/src/recording/-chrome.tabCapture는 MCP 호출에는 없는 사용자 제스처가 필요하므로, 녹화는 대신 CDP 스크린캐스트를 사용합니다. JPEG 프레임이 오프스크린MediaRecorder로 중계됩니다(서비스 워커에는 DOM이 없음).test/- 두 갈래 스위트입니다. 브라우저가 필요 없는 오프라인 CI 게이트와 실제 Chrome을 구동하는 브라우저 갈래입니다. 테스트 실행을 참조하세요.
프로젝트 구조
.
├── bin/
│ └── custom-chrome-dev-mcp.js # executable entry - register THIS with your client
├── src/
│ ├── server.js # composes config + relay + tool registry
│ ├── config.js # port, token, capture dir, timeouts
│ ├── hub.js # long-lived relay owning :9876
│ ├── relay/
│ │ └── hub-client.js # session -> hub socket; call()
│ ├── capture/
│ │ └── capture-path.js # write allowlist for screenshots/recordings
│ └── tools/ # ONE FILE PER TOOL GROUP - the public surface
│ ├── index.js # the registry
│ ├── schemas.js # shared arg shapes + passthrough helper
│ ├── navigation.js
│ ├── tabs.js
│ ├── perception.js
│ ├── interaction.js
│ ├── trusted-input.js
│ ├── observability.js
│ └── capture.js
├── extension/ # Chrome MV3 extension
│ ├── manifest.json
│ └── src/
│ ├── background.js # service worker entry - wiring only
│ ├── config.js # token, banlist, buffer caps, asset paths
│ ├── connection.js # hub socket + MV3 keepalive heartbeat
│ ├── tabs.js # tab resolution, pinning, ban check
│ ├── walker-bridge.js # channel to the injected page script
│ ├── cdp/
│ │ ├── session.js # attach/detach, cdp(), element centres
│ │ ├── keyboard.js # key names -> CDP key events
│ │ ├── dialogs.js # native alert/confirm/prompt policy
│ │ └── buffers.js # console + network ring buffers
│ ├── recording/
│ │ ├── recorder.js # CDP screencast -> offscreen encoder
│ │ ├── offscreen.html
│ │ └── offscreen.js # MediaRecorder host
│ ├── page/
│ │ └── walker.js # injected DOM driver (ISOLATED world)
│ └── handlers/ # MIRRORS src/tools/ - one file per group
│ ├── index.js # the handler table + dispatch
│ ├── navigation.js
│ ├── tabs.js
│ ├── perception.js
│ ├── interaction.js
│ ├── trusted-input.js
│ ├── observability.js
│ └── capture.js
└── test/ # two lanes: offline (CI) + browser
├── run.mjs # CLI entry
├── lib/ # runner, assertions, bridge, fixtures, session
├── fixtures/ # the fixture pages, as real files
└── suites/ # one suite per tool group크레딧
Chrome DevTools MCP에서 영감을 받았습니다. Chrome DevTools 팀의 작품입니다. 독립적인 재구현이며, Google과 제휴, 보증, 지원 관계가 아닙니다.
라이선스
MIT. 저작권 (c) 2026 Haba Andrei.
사용하고, 포크하고, 배포하세요. 유일한 조건은 저작권 고지와 허가 고지가 실질적인 복사본과 함께 전달되어야 한다는 것입니다.
This server cannot be installed
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- AlicenseNot gradedqualityCmaintenanceEnables MCP clients to control and interact with the user's real Chrome browser session, leveraging existing logins, cookies, and extensions for AI-driven automation.5MIT
- AlicenseNot gradedqualityBmaintenanceEnables MCP clients to drive a real, logged-in Chrome browser for web automation tasks like navigation, clicking, typing, and screenshotting.11MIT
- FlicenseNot gradedqualityCmaintenanceDrive your real, signed-in Chrome browser from any MCP client, enabling browser automation such as navigation, clicking, typing, and screenshots through standard MCP tools.1
- AlicenseCqualityAmaintenanceMCP server for browser automation that drives Chrome via an extension, preserving login state and offering 45 tools for navigation, interaction, scraping, and screenshots.534MIT
Related MCP Connectors
Browser MCP for logged-in tasks. Uses your Chrome — credentials stay local. Zero-token replay.
Hosted real Google Chrome MCP with per-user persistent state. Navigate, click, type, screenshot.
Stealth web browser for agents: search, fetch, click, download and type in persistent MCP sessions.
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/HabaAndrei/custom-chrome-dev-mcp'
If you have feedback or need assistance with the MCP directory API, please join our Discord server