chrome-devtools

Name: chrome-devtools
Availability: InStock
Author: justinwangjp

Automate browser debugging and web page manipulation via Chrome DevTools MCP.

6|1|Updated Feb 16, 2026

Search Tags:#automation #performance #debugging #devtools #network #browser

Ready to run

npx skills add https://github.com/JustinWangJP/cc-agent-teams-action-monitor --skill chrome-devtools-justinwangjp

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/JustinWangJP/cc-agent-teams-action-monitor/tree/main/.agents/skills/chrome-devtools
Command: npx skills add https://github.com/JustinWangJP/cc-agent-teams-action-monitor --skill chrome-devtools-justinwangjp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Chrome DevTools MCP-based workflow enables efficient browser debugging, troubleshooting, and automation by providing a persistent, scriptable control plane over web pages.

Core Features & Use Cases

Automation & Interaction: Control page navigation, element interaction, and state inspection via MCP to streamline debugging and repetitive tasks.
Performance & Network Analysis: Inspect performance metrics and network activity to diagnose page behavior and bottlenecks.
Use Case: When debugging a complex web app, use MCP to select a page, take a snapshot of the DOM, and automate a sequence of interactions to reproduce a bug.

Quick Start

Launch the Chrome DevTools MCP server and start by listing pages to identify targets, then select a page and begin interactions.

Frequently Asked Questions about chrome-devtools

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

FAQPage Schema

How do I automate browser debugging and interaction with a persistent session?▼

Browser debugging and interaction are automated via Chrome DevTools MCP, which provides a persistent, scriptable control plane to navigate pages, snapshot the DOM, and manipulate elements. You select a page target and execute interaction sequences to reproduce bugs or streamline repetitive tasks.

Can I inspect network activity and performance metrics for web apps using DevTools?▼

Yes, you can inspect network activity and performance metrics for web apps using Chrome DevTools MCP. It allows you to monitor page behavior, track network requests, and diagnose bottlenecks by examining performance metrics within a defined page context.

What do I need to start automating web page interactions via Chrome DevTools?▼

To start automating web page interactions, you need the chrome-devtools-mcp tool and a persistent browser session. You launch the MCP server, list available pages to identify targets, select a page, and then begin scripting interactions and snapshots.

Does Chrome DevTools MCP support taking DOM snapshots during automated testing?▼

Chrome DevTools MCP supports taking DOM snapshots during automated testing by allowing you to select a specific page context and capture its current state. This helps inspect page elements and verify conditions before or after executing automated interaction sequences.

How does browser automation via MCP compare to other web debugging approaches?▼

Browser automation via MCP provides a persistent control plane for scriptable web page manipulation, unlike standard debugging approaches. It enables continuous navigation, DOM snapshots, and performance analysis within a defined page context, streamlining complex web app troubleshooting and automated testing.

What are the limitations of using DevTools MCP for web app performance analysis?▼

Performance analysis and browser automation via DevTools MCP require a persistent browser session and a defined page context to function. Automation workflows are constrained to inspecting and manipulating elements within this active session, limiting scope to currently loaded web apps.