skills.rest
HsnSaboor
HsnSaboorCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

chrome-devtools

Automate browser tasks with Puppeteer scripts for screenshots, PDFs, and scraping.

Updated Jan 21, 2026
Search Tags:#automation#performance#debugging#web scraping#puppeteer#chrome
One-click install
npx skills add https://github.com/HsnSaboor/open-engineer --skill chrome-devtools-hsnsaboor
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/HsnSaboor/open-engineer/tree/main/src/skills/bundled/samhvw8-chrome-devtools
Command: npx skills add https://github.com/HsnSaboor/open-engineer --skill chrome-devtools-hsnsaboor

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill automates browser interactions and provides deep insights into web page performance and behavior, streamlining tasks like testing, scraping, and debugging.

Core Features & Use Cases

  • Browser Automation: Navigate, click, fill forms, and execute JavaScript.
  • Performance Profiling: Measure Core Web Vitals and record network traffic.
  • Debugging: Monitor console logs and inspect DOM elements.
  • Use Case: Automatically take screenshots of a webpage, extract specific data using selectors, and profile its loading performance.

Quick Start

Use the chrome-devtools skill to take a screenshot of https://example.com and save it to ./docs/screenshots/page.png.

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 take screenshots using Puppeteer?▼

Puppeteer automation scripts navigate webpages, extract data via selectors, and take screenshots saved to local paths. This Skill streamlines browser interactions for scraping and visual capture tasks.

Can I measure Core Web Vitals and profile network traffic with Chrome DevTools Protocol?▼

Yes, Chrome DevTools Protocol access enables network monitoring and performance profiling. You can measure Core Web Vitals and record network traffic to analyze webpage loading behavior effectively.

Does this Skill support headless browsing for form automation?▼

Headless browsing is fully supported for form automation. You can programmatically navigate pages, click elements, fill forms, and execute JavaScript without launching a visible browser UI.

What is the best way to monitor console logs and debug DOM elements in Puppeteer?▼

Direct Chrome DevTools Protocol access provides advanced debugging capabilities. You can monitor console logs, inspect DOM elements, and analyze network requests within your automation scripts.

How do I generate PDF documents from webpages using Chrome automation?▼

Chrome automation scripts generate PDFs from webpages by leveraging Puppeteer's rendering engine. You can programmatically navigate to URLs and save page output as PDF documents.

Related Skills

Explore More Software Engineering Skills→
tranhieutttranhieutt
70

cloud-run-puppeteer

Deploy Puppeteer with headless Chrome to Cloud Run gen2.

Community
Intermediate
pynbj1001pynbj1001
2

Smart Browser

Extract JavaScript-rendered web page agendas and session data to Markdown and JSON.

Community
Intermediate
dige04dige04

chrome-devtools

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

Community
Advanced
tkerseytkersey
66

web-browser

Automate Chrome/Chromium via CDP to navigate, click, fill forms, evaluate JavaScript, and capture screenshots.

Community
Intermediate