chrome-devtools

Automate browser navigation, interaction, debugging, and performance tracing via Chrome DevTools MCP.

Updated Apr 21, 2026
One-click install
npx skills add https://github.com/sertaoseracloud/sertao --skill chrome-devtools-sertaoseracloud
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/sertaoseracloud/sertao/tree/main/.agents/skills/chrome-devtools
Command: npx skills add https://github.com/sertaoseracloud/sertao --skill chrome-devtools-sertaoseracloud

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates challenging browser tasks such as navigation, debugging, and performance analysis across web applications, reducing manual effort and accelerating engineering workflows.

Core Features & Use Cases

  • Automated Navigation & Interaction: Open pages, click elements, fill forms, and manage dialogs.
  • Debugging & Inspection: Capture console logs, inspect network requests, and evaluate scripts in the page context.
  • Performance & Profiling: Record traces, measure timings, and analyze Core Web Vitals for optimization.
  • Use Case: Quickly diagnose a slow page by navigating to the target URL, capturing a performance trace, and reviewing network activity.

Quick Start

Open a page, inspect network activity, and capture a performance trace for analysis.

Frequently Asked Questions about chrome-devtools

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

FAQPage Schema
How do I automate Chrome DevTools to capture network activity and debug a web page?

You can automate Chrome DevTools by using the MCP to navigate pages, click elements, capture console logs, and inspect network requests for debugging. This enables deterministic task execution without manual browser interaction.

How do I profile web app performance and measure Core Web Vitals using Chrome DevTools?

You can profile web app performance by recording traces and measuring timings with the Chrome DevTools MCP. It automates performance tracing to capture Core Web Vitals and analyze page load optimizations.

Can I automate browser form filling and dialog management across diverse web apps?

Yes, you can automate browser interactions across diverse web apps using the Chrome DevTools MCP. It supports opening pages, clicking elements, filling forms, and managing dialogs deterministically.

What is the best way to diagnose a slow web page using Chrome DevTools automation?

The best way to diagnose a slow web page is automating navigation to the target URL, capturing a performance trace, and reviewing network activity via Chrome DevTools. This accelerates engineering workflows by reducing manual effort.

Does the Chrome DevTools MCP support evaluating JavaScript scripts in the page context?

Yes, the Chrome DevTools MCP supports evaluating scripts directly in the page context. This debugging and inspection capability allows you to capture console logs and interact with web applications programmatically.