소개
DevBridge는 모든 AI 도구를 Chrome 브라우저에 연결하여 디버깅과 자동화를 실현하는 Chrome 확장 프로그램 및 MCP 서버입니다.
MCP란?
Model Context Protocol(MCP)은 AI 애플리케이션이 외부 도구 및 서비스와 상호 작용할 수 있는 개방형 표준입니다. DevBridge를 사용하면 AI 에디터에서 MCP 도구 호출을 보내고, DevBridge가 Chrome에서 실행하여 결과를 반환합니다.
DevBridge로 할 수 있는 것
DevBridge는 두 가지 핵심 워크플로우를 커버하는 18개의 MCP 도구를 제공합니다:
디버깅 — 콘솔 로그 읽기, 네트워크 요청 캡처, 접근성 트리 검사, JavaScript 실행, 스크린샷. Chrome DevTools의 완전한 디버깅 워크플로우를 AI 에디터에서 직접 사용할 수 있습니다.
자동화 — 클릭, 입력, 스크롤, 드래그, 폼 입력, 파일 업로드, 페이지 탐색, 세션의 GIF 녹화. 엔드 투 엔드 테스트 흐름을 구축하고 반복적인 브라우저 작업을 자동화합니다.
주요 기능
- 18개의 MCP 도구: 페이지 읽기, 인터랙션, 탐색, 디버깅, 시각적 캡처, 탭 관리
- 크로스 오리진 iframe 지원 (크로스 오리진 OOPIF 포함)
- Shadow DOM 관통 (open 및 closed Shadow DOM)
- Canvas 인터랙션 (12개의 서브 액션)
- GIF 녹화: 다단계 인터랙션을 애니메이션 GIF로 녹화
- 3플랫폼 지원: Windows, macOS, Linux
- 권한 관리: 도메인 기반 세밀한 접근 제어