chrome-devtools

Name: chrome-devtools
Availability: InStock
Author: darkglow-net

Automate browser debugging and performance analysis via Chrome DevTools MCP.

1|Updated Feb 18, 2026

Search Tags:#debugging #screenshots #chrome-devtools #browser-automation #performance-analysis #network-tracing

Ready to run

npx skills add https://github.com/darkglow-net/github-copilot-kickstarter --skill chrome-devtools-darkglow-net

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/darkglow-net/github-copilot-kickstarter/tree/main/skills/chrome-devtools
Command: npx skills add https://github.com/darkglow-net/github-copilot-kickstarter --skill chrome-devtools-darkglow-net

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates browser automation, debugging, and performance analysis using the Chrome DevTools MCP.

Core Features & Use Cases

Navigation & Page Management: new_page, navigate_page, select_page, list_pages, close_page, wait_for.
Input & Interaction: click, fill_form, hover, press_key, drag, handle_dialog, upload_file.
Debugging & Inspection: take_snapshot, take_screenshot, list_console_messages, get_console_message, evaluate_script, list_network_requests, get_network_request.
Emulation & Performance: resize_page, emulate, performance_start_trace, performance_stop_trace, performance_analyze_insight.

Quick Start

Connect to the Chrome DevTools MCP server and run a simple navigation and capture workflow.

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 performance analysis for web pages?▼

Browser automation, debugging, and performance analysis are automated using the Chrome DevTools MCP, which exposes functions for page navigation, interaction, console inspection, network tracing, and performance profiling across web pages.

Can I capture screenshots and network traces during automated page navigation?▼

Screenshots and network traces are captured during page navigation by calling take_screenshot and list_network_requests, which inspect page state and trace network activity for debugging workflows.

How does performance profiling work with Chrome DevTools MCP?▼

Performance profiling works by calling performance_start_trace to begin recording, executing page interactions, then calling performance_stop_trace and performance_analyze_insight to capture and analyze runtime performance metrics.

Do I need the chrome-devtools MCP server to run interactive debugging workflows?▼

The chrome-devtools MCP server is required to run interactive debugging workflows, as it provides the underlying protocol connection that exposes functions like evaluate_script, take_snapshot, and handle_dialog for browser control.

What page interactions can I automate for front-end testing and inspection?▼

Automated page interactions include click, fill_form, hover, press_key, drag, handle_dialog, and upload_file, enabling comprehensive front-end testing and DOM inspection through evaluate_script and take_snapshot.

Can I emulate different page sizes and device conditions during browser automation?▼

Page sizes and device conditions are emulated during browser automation using the resize_page and emulate functions, allowing responsive testing and environment simulation before capturing performance traces.