chrome-devtools

Orchestrate Puppeteer CLI scripts to automate browser tasks and extract data.

Updated Feb 4, 2026
One-click install
npx skills add https://github.com/ytqh/agent-skills --skill chrome-devtools-ytqh
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/ytqh/agent-skills/tree/main/skills/chrome-devtools
Command: npx skills add https://github.com/ytqh/agent-skills --skill chrome-devtools-ytqh

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires puppeteer, debug, and includes scripts (resource) and references (resource) components.

What problem does it solve?

The Chrome DevTools Agent Skill reduces manual browser automation overhead by providing Puppeteer CLI scripts to navigate pages, capture data, gather debugging information, and analyze performance in a repeatable, scriptable way.

Core Features & Use Cases

  • Automation & testing: Execute headless browser actions, take screenshots, fill forms, and interact with pages.
  • Debugging & analysis: Collect console logs, monitor network activity, and measure performance metrics for rapid diagnosis.
  • Use Case: Example: load a page, capture its title and URL, and output a JSON summary for logging and monitoring.

Quick Start

Start by installing dependencies, then run a sample flow such as navigating to a URL and retrieving the page title:

  • npm install
  • node scripts/navigate.js --url https://example.com

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 capture page data with Puppeteer?

Automate browser tasks by running Puppeteer CLI scripts that navigate to URLs, capture page titles, fill forms, and output a JSON summary for logging. Execute the navigate.js script via Node.js with the target URL parameter.

Can I monitor network activity and collect console logs for web debugging?

Network activity monitoring and console log collection are supported for debugging web applications. Puppeteer scripts intercept network requests and gather console output to diagnose runtime issues and analyze page performance metrics.

Do I need Node.js installed to run headless browser automation scripts?

Node.js is required as the runtime environment to execute Puppeteer scripts for headless browser automation. Install Node.js and Puppeteer dependencies via npm install before running navigation and data extraction scripts.

What's the best way to measure web performance metrics for modern web applications?

Measure web performance metrics by running Puppeteer scripts that load modern web applications and capture timing data. The scripts enable repeatable performance analysis across page loads to track rendering speed and network bottlenecks.

How does headless browser scraping work for extracting data from web pages?

Headless browser scraping works by programmatically navigating pages with Puppeteer to extract data like titles and URLs. Scripts automate the browser to interact with DOM elements, capture screenshots, and return structured JSON data.

Why use Puppeteer scripts instead of manual browser debugging for web applications?

Puppeteer scripts reduce manual browser debugging overhead by providing a repeatable, scriptable way to navigate, capture data, and gather diagnostics. This enables consistent performance analysis and automated testing across web application deployments.