Chrome DevTools MCP: เครื่องมือพัฒนาและดีบักเบราว์เซอร์ด้วย AIChrome DevTools MCP: AI-powered browser development and debugging
Repo นี้ให้เออร์เจนต์ AI ควบคุมและตรวจสอบเบราว์เซอร์ Chrome โดยใช้ Chrome DevTools
This repo allows AI agents to control and inspect a Chrome browser using Chrome DevTools.
ไว้ทำอะไร
Chrome DevTools MCP ช่วยให้นักพัฒนาใช้ Chrome DevTools อย่างเต็มศักยภาพในการทำงานอัตโนมัติ การดีบัก และวิเคราะห์ประสิทธิภาพ โดยเฉพาะเมื่อใช้ร่วมกับเอเจนต์ AI อย่าง Antigravity หรือ Copilot.
ทำงานอย่างไร
Chrome DevTools MCP ทำงานเหมือนเซิร์ฟเวอร์ MCP ที่เชื่อมต่อกับเอเจนต์ AI ผ่านโปรโตคอล MCP. โดยใช้ Puppeteer ในการทำงานอัตโนมัติใน Chrome และให้ DevTools เข้าถึงเบราว์เซอร์ในลักษณะที่ละเอียด. โค้ดประกอบด้วยเซิร์ฟเวอร์ MCP ที่จัดการการร้องขอเครื่องมือ และโมดูลต่าง ๆ ที่เป็น third_party ซึ่งรวมการใช้ Puppeteer และ Libray อื่น ๆ สำหรับประสิทธิภาพ. คุณสมบัติการรายงานใช้ lighthouseRunner ในการเรียกแสดงรายงานประสิทธิภาพและการนำทาง.
โครงสร้างโค้ด
- src/index.ts — เริ่มต้นเซิร์ฟเวอร์ MCP และจัดการการร้องขอ
- src/third_party/index.ts — รวบรวมโมดูล third_party ต่าง ๆ เช่น Puppeteer
- package.json — ข้อมูล packages และสคริปต์
- README.md — คำแนะนำการใช้
เริ่มใช้งาน
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}เหมาะกับงานแบบไหน
- การดีบัก JavaScript และการตรวจสอบปัญหาในโปรเจคเว็บ
- การวิเคราะห์และเพิ่มประสิทธิภาพการทำงานของเว็บไซต์
- การใช้ Automation เพื่อควบคุมเบราว์เซอร์ด้วย AI agent
ข้อควรรู้
- การใช้งานอาจไม่ควรแชร์ข้อมูลส่วนตัวกับ MCP clients
- รองรับเฉพาะ Google Chrome และ Chrome for Testing อย่างเป็นทางการ
- การใช้งานอาจต้องการตรวจสอบการอัปเดตของเซิร์ฟเวอร์
What it is for
Chrome DevTools MCP enables developers to fully leverage Chrome DevTools for automation, debugging, and performance analysis, especially when integrated with AI agents like Antigravity or Copilot.
How it works
Chrome DevTools MCP acts as an MCP server interfacing with AI agents via the MCP protocol. It leverages Puppeteer for automating tasks in Chrome and provides DevTools for granular browser access. Code includes an MCP server that manages tool requests and several third-party modules integrating Puppeteer and other libraries for enhanced performance. Reporting capabilities use the lighthouseRunner to invoke performance and navigation reports.
Code structure
- src/index.ts — Initializes the MCP server and handles requests
- src/third_party/index.ts — Includes third-party modules like Puppeteer
- package.json — Contains packages information and scripts
- README.md — Usage instructions
Getting started
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}Good fit for
- Debugging JavaScript and inspecting issues in web projects
- Analyzing and enhancing website performance
- Utilizing automation to control the browser with AI agents
Things to know
- Avoid sharing personal data with MCP clients during use
- Official support is only for Google Chrome and Chrome for Testing
- May require monitoring server updates
บทวิเคราะห์นี้สร้างจาก README และโค้ดของ repo โดย AI ของ Oneable — ตรวจสอบ license และเอกสารต้นทางก่อนนำไปใช้งานจริงThis breakdown was generated from the repository's README and code by Oneable's AI — check the license and upstream docs before using it in production.