ck:chrome-devtools

Automate browser navigation, screenshots, and form interactions with Puppeteer.

1|Updated Jun 16, 2026
One-click install
npx skills add https://github.com/TNHoang2708/Gym_Ver2 --skill ck-chrome-devtools-tnhoang2708
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ck:chrome-devtools
Source: https://github.com/TNHoang2708/Gym_Ver2/tree/main/.claude/skills/chrome-devtools
Command: npx skills add https://github.com/TNHoang2708/Gym_Ver2 --skill ck-chrome-devtools-tnhoang2708

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides automation of browsers using Puppeteer and direct interaction with Chrome DevTools, streamlining tasks such as screenshots, performance analysis, network monitoring, and form automation.

Core Features & Use Cases

  • Browser Automation: Automate common tasks in web browsers like navigating pages, capturing screenshots, and simulating user interactions.
  • Performance Analysis: Measure and log Core Web Vitals and performance metrics for better optimization.
  • Network Monitoring: Track HTTP requests and responses for debugging and data extraction.
  • Use Case: Need to automatically extract information from a complex website and process it? Use this Skill to navigate the site, capture the required elements, and process the data programmatically.

Quick Start

Run the "click.js" script to interact with elements by reference:

node scripts/click.js --selector "[ref=e5]" --action "click"

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 web browser navigation and form interactions with Puppeteer?

Puppeteer automates web browser navigation and form interactions by programmatically controlling Chrome, allowing you to simulate user interactions like clicking elements, filling out forms, and navigating pages.

Can I capture Core Web Vitals and performance metrics using Chrome DevTools?

Yes, Chrome DevTools can measure and log Core Web Vitals and performance metrics, enabling you to track HTTP requests and analyze network activity for better optimization and debugging.

What do I need to run Puppeteer scripts for web scraping and screenshots?

To run Puppeteer scripts for web scraping and screenshots, you need a local browser with remote debugging enabled, plus the Puppeteer dependency installed to execute the automation scripts.

How do I click an element by reference when automating a web page?

To click an element by reference during web page automation, run the click script with a selector argument like '--selector "[ref=e5]"' and specify the '--action "click"' parameter.

Does Puppeteer support interacting with ARIA elements during web scraping?

Yes, Puppeteer supports interacting with ARIA elements during web scraping, allowing scripts to capture screenshots, simulate user interactions, and automatically extract information from complex websites.

What are the limitations of using Puppeteer for browser automation?

Puppeteer browser automation requires a local browser with remote debugging enabled and depends on the Puppeteer package, meaning it needs a compatible local environment to execute scripts rather than running purely remotely.