Does the browser state persist between different commands?

Yes, the browser instance and page context stay open across multiple script calls, allowing for multi-step workflows like logging in and then scraping a protected page.

Can this skill handle JavaScript-heavy Single Page Applications (SPAs)?

Yes, because it uses a real Chrome instance via DevTools Protocol, it can perfectly render and interact with React, Vue, Angular, and other dynamic frameworks.

What are the prerequisites for using the Chrome DevTools skill?

You need Node.js 18 or higher, the mcp2rest server running on localhost:28888, and the chrome-devtools-mcp package installed.

How do I identify elements to click or fill?

The skill includes a 'take_snapshot' tool that generates a text-based representation of the page with unique UIDs for every interactive element.

Can I use this for performance auditing?

Absolutely. It includes tools for starting performance traces, stopping them, and analyzing insights like Core Web Vitals and LCP.

Chrome DevTools Automation

Name: Chrome DevTools Automation
Author: ulasbilgen

byulasbilgen

•

Browser Automation

Automates Chrome browser via the DevTools Protocol to perform complex web interactions, testing, and data extraction.

About

The Chrome DevTools skill empowers Claude to programmatically control a browser instance, enabling advanced workflows like end-to-end testing, dynamic web scraping, and performance profiling. By bridging Claude with the Chrome DevTools Protocol, users can navigate pages, simulate user inputs, capture screenshots, and monitor network requests or console logs directly within their development environment. This skill is ideal for developers who need to automate repetitive web tasks or debug web applications using real browser environments while maintaining persistent session state across commands.

Key Features

Full browser control including page navigation, tab management, and window resizing
Comprehensive element interaction for clicking, typing, form filling, and drag-and-drop
Visual feedback through page snapshots and automated screenshot capture
1 GitHub stars
Performance analysis with execution tracing and Core Web Vitals scoring
Advanced debugging tools for network monitoring and console log inspection

Use Cases

Automated end-to-end (E2E) testing and UI regression validation
Scraping dynamic, JavaScript-heavy websites that require user authentication or interaction
Auditing web performance and identifying Largest Contentful Paint (LCP) bottlenecks

About

Key Features

Full browser control including page navigation, tab management, and window resizing
Comprehensive element interaction for clicking, typing, form filling, and drag-and-drop
Visual feedback through page snapshots and automated screenshot capture
1 GitHub stars
Performance analysis with execution tracing and Core Web Vitals scoring
Advanced debugging tools for network monitoring and console log inspection

Use Cases

Automated end-to-end (E2E) testing and UI regression validation
Scraping dynamic, JavaScript-heavy websites that require user authentication or interaction
Auditing web performance and identifying Largest Contentful Paint (LCP) bottlenecks