chrome-devtools-debugging

Inspect console logs, network traffic, and performance via Chrome DevTools Protocol.

8|1|Updated Jul 11, 2025

Search Tags:#debugging #mcp #web-development #chrome-devtools #network-inspection #browser-debugging #console-analysis

Ready to run

npx skills add https://github.com/ViperJuice/treesitter-chunker --skill chrome-devtools-debugging-viperjuice

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: chrome-devtools-debugging
Source: https://github.com/ViperJuice/treesitter-chunker/tree/main/.ai-dev-kit/skills/chrome-devtools-debugging
Command: npx skills add https://github.com/ViperJuice/treesitter-chunker --skill chrome-devtools-debugging-viperjuice

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Debugging and analysis of web applications via the Chrome DevTools Protocol to inspect runtime behavior and performance.

Core Features & Use Cases

Console inspection: view errors, warnings, and logs from the browser context.
Network analysis: monitor HTTP requests and responses, headers, and payloads.
Performance tracing: record and analyze page load and runtime performance.
JavaScript evaluation: execute code in the page context and inspect results.
Authenticated session debugging: inspect state in browsers with active sessions.

Quick Start

Connect to a running Chrome instance with remote debugging enabled and start exploring console, network, and performance data.

Frequently Asked Questions about chrome-devtools-debugging

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I debug web applications using Chrome DevTools Protocol?▼

Monitor HTTP requests and responses by connecting to a running Chrome instance with remote debugging enabled, then capture headers and payloads via the DevTools Protocol.

Can I inspect console logs and network traffic for authenticated sessions?▼

Inspect console logs and network traffic for authenticated sessions by connecting the Chrome DevTools Protocol to a browser with active sessions and monitoring runtime behavior.

What do I need to start browser debugging with Chrome DevTools MCP?▼

To start browser debugging with Chrome DevTools MCP, you need a running Chrome instance with remote debugging enabled and the MCP wrappers for Python to drive the DevTools protocol.

How do I trace page load performance during web development?▼

Trace page load performance during web development by recording and analyzing runtime performance data captured directly from the Chrome DevTools Protocol interface.

Can I execute JavaScript code and inspect results in the browser context?▼

Execute JavaScript code in the browser context and inspect results by sending evaluation commands through the Chrome DevTools Protocol to the target page.