skills.rest
jangtrinh
jangtrinhCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ck:chrome-devtools

Automate Puppeteer browser testing with screenshots, ARIA snapshots, and diagnostics.

Updated Apr 9, 2026
Search Tags:#browser automation#puppeteer#performance metrics#network monitoring#screenshot testing#accessibility snapshot#auth cookie injection
One-click install
npx skills add https://github.com/jangtrinh/demo-Lam --skill ck-chrome-devtools-jangtrinh
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ck:chrome-devtools
Source: https://github.com/jangtrinh/demo-Lam/tree/main/.claude/skills/chrome-devtools
Command: npx skills add https://github.com/jangtrinh/demo-Lam --skill ck-chrome-devtools-jangtrinh

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill removes the manual effort of inspecting and testing web pages by automating navigation, element discovery, interaction, and diagnostics with a repeatable browser workflow.

Core Features & Use Cases

  • Automated browser control (Puppeteer): Navigate to URLs, capture screenshots, fill forms, click elements, and run page JavaScript.
  • Accessibility-first element discovery: Generate an ARIA-based YAML snapshot and interact with elements using stable refs to avoid brittle CSS/XPath.
  • Deep debugging & QA signals: Collect console errors, track network activity, and measure performance metrics (including trace capture and Core Web Vitals approximations).
  • Authentication/session persistence: Inject cookies/tokens/storage and reuse an authenticated session across script runs.

Quick Start

Run the ARIA snapshot for a target page by issuing: node aria-snapshot.js --url https://example.com

Frequently Asked Questions about ck:chrome-devtools

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

FAQPage Schema
How do I automate browser testing and capture screenshots with Puppeteer?▼

Puppeteer browser automation captures screenshots, fills forms, clicks elements, and runs page JavaScript by executing deterministic scripts that navigate to URLs and output JSON for repeatable web testing workflows.

What is an ARIA accessibility snapshot and when do I need it for web debugging?▼

An ARIA accessibility snapshot generates a YAML representation of a web page's structure for accessibility audits and stable element discovery, replacing brittle CSS/XPath selectors with stable refs for reliable element interaction during web debugging.

Can I inject auth cookies and reuse an authenticated session across Puppeteer script runs?▼

Yes, Puppeteer automation supports injecting cookies, tokens, and storage state to authenticate Chrome sessions, allowing you to reuse the authenticated session across multiple script runs for testing protected pages.

How do I collect console errors, network activity, and performance metrics during automated browser testing?▼

Automated browser testing collects console errors, tracks network activity, and measures performance metrics including trace capture and Core Web Vitals approximations, outputting deep debugging and QA signals as JSON for comprehensive analysis.

Do I need Puppeteer and Chrome installed to run ARIA snapshots and accessibility audits?▼

Yes, running ARIA snapshots and accessibility audits requires a Puppeteer-based Chrome session with Node.js, utilizing the sharp, debug, and yargs dependencies to execute deterministic scripts that output JSON and YAML.

What are the limitations of using Puppeteer for automated form automation and web page interaction?▼

Puppeteer automation limitations include handling unknown DOM structures and avoiding brittle CSS/XPath selectors, requiring ARIA-based snapshots and safe selector validation for reliable element interaction during form automation and web page interaction.

Related Skills

Explore More Software Engineering Skills→
brixtonphambrixtonpham

chrome-devtools

Automate browser tasks and UI testing via Puppeteer CLI scripts.

Community
Intermediate
kevinnguyen271090kevinnguyen271090
15

chrome-devtools

Automate browser tasks with Puppeteer CLI scripts for navigation, screenshots, and network monitoring.

Community
Advanced
khoi1009khoi1009

chrome-devtools

Automates browser tasks, debugging, and performance analysis with persistent Puppeteer sessions.

Community
Advanced
vuminhieuvuminhieu

chrome-devtools

Orchestrate Puppeteer scripts with persistent sessions for browser automation and testing.

Community
Advanced