skills.rest
tan-yong-sheng
tan-yong-shengCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

chrome-devtools

Automate browser interactions with Puppeteer CLI scripts for web scraping and screenshots.

4|20|Updated Sep 27, 2025
Search Tags:#testing#browser automation#web scraping#puppeteer#web automation#performance analysis
One-click install
npx skills add https://github.com/tan-yong-sheng/cloudflare-image-mcp --skill chrome-devtools-tan-yong-sheng
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/tan-yong-sheng/cloudflare-image-mcp/tree/main/.claude/skills/chrome-devtools
Command: npx skills add https://github.com/tan-yong-sheng/cloudflare-image-mcp --skill chrome-devtools-tan-yong-sheng

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill automates browser interactions, enabling tasks like web scraping, form submission, and performance analysis without manual intervention.

Core Features & Use Cases

  • Browser Automation: Navigate websites, click elements, fill forms, and capture screenshots.
  • Performance Analysis: Monitor network traffic, measure Core Web Vitals, and analyze page performance.
  • Debugging: Inspect console logs and execute JavaScript within the browser context.
  • Use Case: Automatically log into a web application, fill out a complex form, and then take a screenshot of the confirmation page.

Quick Start

Use the chrome-devtools skill to navigate to https://example.com and take a full page screenshot.

Frequently Asked Questions about chrome-devtools

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

FAQPage Schema
How do I automate web scraping and form submission using Puppeteer?▼

You can automate web scraping and form submission using Puppeteer by navigating websites, clicking elements, and filling forms via CLI scripts. This enables deterministic browser interactions without manual intervention.

Can I measure Core Web Vitals and monitor network traffic for performance analysis?▼

Yes, performance analysis is supported. You can monitor network traffic, measure Core Web Vitals, and analyze page performance metrics directly within the browser context using automation scripts.

Do I need Node.js and npm to run these browser automation scripts?▼

Yes, Node.js and npm are required for execution, with optional system dependencies needed for Linux environments to run the Puppeteer browser automation scripts successfully.

What is the best way to capture a full page screenshot of a web application?▼

The best way to capture a full page screenshot is by using browser automation scripts. You can navigate to a target URL and programmatically capture the entire page content for web scraping or confirmation records.

Can I execute JavaScript and inspect console logs for debugging?▼

Yes, debugging is supported. You can execute JavaScript within the browser context and inspect console logs to analyze web application behavior and troubleshoot issues during automated interactions.

Related Skills

Explore More Software Engineering Skills→
kensleDevkensleDev

chrome-devtools

Automate browser interactions, debugging, and performance analysis with Puppeteer CLI scripts.

Community
Advanced
viably-labsviably-labs

playwright-screenshot-inspector

Analyze Playwright screenshots to validate UI rendering accuracy semantically.

Official
Advanced
dige04dige04

chrome-devtools

Automates Puppeteer-based browser tasks and outputs JSON for analysis.

Community
Advanced
leafcoderleafcoder
2

Browser Automation Expert

Automate browser interactions and web testing with Playwright and Puppeteer.

Community
Intermediate