Is headless mode supported for CI/CD?

Yes, the skill automatically detects the OS; it runs in headless mode on Linux and CI environments while defaulting to headed mode on macOS and Windows for visual debugging.

How do I interact with elements if the CSS selectors are unstable?

You can use the aria-snapshot tool to generate a semantic map with stable references ([ref=e1]), then interact with those references directly via the select-ref utility.

Does this skill support persistent sessions?

Yes, it uses WebSocket endpoints to keep the browser running across multiple script executions, allowing Claude to maintain state and perform complex multi-page workflows.

Can I use this for web scraping dynamic content?

Absolutely. It includes ARIA snapshotting and JSON output specifically designed for reliable element discovery and data extraction from modern JavaScript-heavy sites.

How does it handle large screenshot files?

The skill automatically detects if a screenshot exceeds 5MB and uses the Sharp library to compress it, ensuring fast processing and compliance with AI input limits.

Chrome DevTools Automation

Name: Chrome DevTools Automation
Author: CongDon1207

byCongDon1207

•

ブラウザ自動化

Automates browser interactions, debugging, and performance audits using Puppeteer scripts with persistent session support.

The Chrome DevTools skill empowers Claude to perform advanced web automation, visual testing, and technical debugging directly within a live browser environment. By leveraging Puppeteer and ARIA snapshots, it provides a semantic way to discover and interact with page elements even when site layouts are unknown. The skill features persistent session management for complex multi-step workflows, automated screenshot compression for visual verification, and detailed network/console log collection, making it an essential tool for frontend developers and QA engineers using Claude Code.

主な機能

01Semantic element discovery via ARIA snapshots and reference-based interaction

02Automated screenshot capture with built-in Sharp image compression

03Comprehensive network traffic monitoring and console log analysis

04Performance auditing including Core Web Vitals and load metrics

05Persistent WebSocket sessions for seamless multi-step browser workflows

061 GitHub stars

ユースケース

01Automated End-to-End (E2E) testing and visual regression verification

02Web scraping and data collection from complex, dynamic web applications

03Debugging frontend JavaScript errors and analyzing network performance bottlenecks

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add congdon1207/agents.md chrome-devtools

For use in Claude.ai and ChatGPT

Download Skill