chrome-devtools

Automate browser tasks and analyze performance via Chrome DevTools MCP.

Updated Apr 5, 2026

Search Tags:#automation #devtools #web-automation #chrome-devtools #network-analysis #browser-debugging #performance-profiling

Ready to run

npx skills add https://github.com/NarakCODE/rakui --skill chrome-devtools-narakcode

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/NarakCODE/rakui/tree/main/.agents/chrome-devtools
Command: npx skills add https://github.com/NarakCODE/rakui --skill chrome-devtools-narakcode

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill simplifies complex browser automation, debugging, and performance analysis by leveraging the Chrome DevTools MCP server to control a live browser, inspect pages, and collect actionable insights.

Core Features & Use Cases

Browser automation: navigate, click, fill forms, capture screenshots, and manage pages across sessions.
Debugging & inspection: read console output, evaluate scripts in page context, and monitor network activity.
Performance analysis: record and analyze traces, identify bottlenecks, and profile page load behavior.
Emulation & testing: resize viewports, throttle network/CPU, and simulate different devices for testing.

Quick Start

Launch the Chrome DevTools MCP agent and connect to a running browser to start automating tasks.

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 tasks and inspect live web pages using Chrome DevTools?▼

You can automate browser tasks and inspect live web pages by connecting to the Chrome DevTools MCP server. This allows you to navigate, click elements, fill forms, evaluate scripts, and capture screenshots directly on live web pages across your development workflows.

Can I monitor network activity and read console output for live web debugging?▼

Yes, live web debugging supports reading console output and monitoring network activity. By leveraging Chrome DevTools automation, you can capture console logs, inspect network requests, and evaluate scripts within the page context to identify runtime issues.

What is the best way to profile page load behavior and identify performance bottlenecks?▼

Profiling page load behavior involves recording and analyzing traces via the Chrome DevTools protocol. You can capture performance traces, identify rendering bottlenecks, and profile page load behavior to optimize web application performance effectively.

Can I simulate different devices and throttle network or CPU for responsive testing?▼

Yes, you can simulate different devices for responsive testing by resizing viewports and applying network or CPU throttling. This emulation capability allows you to test how your web pages perform under various device constraints and network conditions.

Do I need a running Chrome DevTools MCP server to use this browser automation skill?▼

Yes, you must have a running Chrome DevTools MCP server connected to a live browser. This server acts as the bridge for navigation, input, debugging, and profiling APIs required to execute the automation and performance analysis tasks.