skills.rest
sero-labs
sero-labsOFFICIAL
Explore all skills by this author →
GitHub

chrome-cdp

Control local Chrome browser sessions via the Chrome DevTools Protocol.

19|1|Updated Feb 7, 2026
Search Tags:#automation#debugging#cdp#chrome#browser#web
One-click install
npx skills add https://github.com/sero-labs/sero --skill chrome-cdp-sero-labs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-cdp
Source: https://github.com/sero-labs/sero/tree/main/packages/templates/skills/chrome-cdp
Command: npx skills add https://github.com/sero-labs/sero --skill chrome-cdp-sero-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This skill solves the challenge of interacting with live web pages for debugging, testing, or data extraction without the overhead of heavy browser automation frameworks.

Core Features & Use Cases

  • Direct Browser Control: Execute JavaScript, navigate pages, and capture screenshots using the native Chrome DevTools Protocol.
  • Accessibility Analysis: Generate accessibility trees to audit page structure and content.
  • Use Case: Use this skill to automate the process of taking screenshots of a local development server or extracting specific DOM elements from a complex web application for reporting.

Quick Start

Use the chrome-cdp skill to take a screenshot of the open browser tab with the target ID 6BE827FA.

Frequently Asked Questions about chrome-cdp

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

FAQPage Schema
How do I automate Chrome browser debugging without heavy automation frameworks?▼

You can automate Chrome browser debugging by using the Chrome DevTools Protocol to directly inspect and manipulate active browser tabs, capturing screenshots or extracting DOM data without heavy automation frameworks.

What do I need to control a local Chrome session via the DevTools Protocol?▼

To control a local Chrome session via the DevTools Protocol, you need a running Chrome instance with remote debugging enabled and Node.js 22 or higher for WebSocket communication.

Can I extract specific DOM elements from an active web page for data extraction?▼

Yes, you can extract specific DOM elements from an active web page by executing JavaScript directly within the browser tab through the Chrome DevTools Protocol to retrieve the target data.

How do I generate an accessibility tree to audit page structure in Chrome?▼

Generate an accessibility tree to audit page structure in Chrome by interfacing with the active browser tab via the Chrome DevTools Protocol to inspect and extract the page's content hierarchy.

Does this approach to browser automation work for visual regression testing?▼

Yes, this approach to browser automation works for visual regression testing by utilizing the Chrome DevTools Protocol to programmatically capture screenshots of local development servers or web applications.

Why use direct Chrome DevTools Protocol control over standard web automation tools?▼

Use direct Chrome DevTools Protocol control over standard web automation tools to achieve lightweight programmatic page inspection and manipulation, avoiding the overhead of heavy browser automation frameworks.

Related Skills

Explore More Software Engineering Skills→
legoutlegout
3

chrome-cdp

Control local Chrome tabs via the Chrome DevTools Protocol for UI automation and data extraction.

Community
Intermediate
viably-labsviably-labs

playwright-screenshot-inspector

Analyze Playwright screenshots to validate UI rendering accuracy semantically.

Official
Advanced
EATSTEAKEATSTEAK

webapp-testing

Test and debug local web applications with Playwright scripts.

Community
Intermediate
harshaldhadukharshaldhaduk
1

browser

Automate web browser tasks using accessibility tree snapshots with element references.

Community
Intermediate