chrome-devtools-cli

Automate browser tasks and inspect pages via the Chrome DevTools CLI.

1|Updated Apr 3, 2026
One-click install
npx skills add https://github.com/Pgooone/oh-pgone-claudecode --skill chrome-devtools-cli-pgooone
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-devtools-cli
Source: https://github.com/Pgooone/oh-pgone-claudecode/tree/main/.claude/plugins/cache/chrome-devtools-plugins/chrome-devtools-mcp/0.20.3/skills/chrome-devtools-cli
Command: npx skills add https://github.com/Pgooone/oh-pgone-claudecode --skill chrome-devtools-cli-pgooone

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires chrome-devtools-mcp, and includes references (resource) components.

What problem does it solve? Manually driving a browser for testing, debugging, or data collection is slow and hard to reproduce. This Skill lets you control Chrome from shell commands, so AI agents and scripts can navigate pages, interact with elements, capture snapshots, and collect performance or network data deterministically. ## Core Features & Use Cases - Browser Automation: Navigate pages, click, fill forms, drag elements, upload files, and handle dialogs using element UIDs from accessibility snapshots. - Debugging & Inspection: Evaluate JavaScript, read console messages, take screenshots, and run Lighthouse audits against any page. - Performance & Network Analysis: Record performance traces, capture memory heap snapshots, and list or inspect network requests with filtering and pagination. - Use Case: An agent can open a staging site, fill a login form, take a snapshot to verify the dashboard rendered, then run a Lighthouse audit and save the report. ## Quick Start Ask the AI to open a URL in Chrome, take a snapshot of the page, and click a specific element using the chrome-devtools CLI.

Frequently Asked Questions about chrome-devtools-cli

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

FAQPage Schema
How do I automate browser actions from the command line?▼

Install chrome-devtools-mcp globally with npm, then run commands like chrome-devtools new_page, take_snapshot, click, and fill. Element targets come from UIDs in the accessibility snapshot, and state persists across commands.

How do I click or fill a specific element with chrome-devtools CLI?▼

Run chrome-devtools take_snapshot to get a text snapshot of the page listing elements with UIDs, then pass the UID to commands like chrome-devtools click "uid" or chrome-devtools fill "uid" "text".

How do I install the chrome-devtools command?▼

Run npm i chrome-devtools-mcp@latest -g, then verify with chrome-devtools status. If the command is not found, ensure your global npm bin directory is on your PATH and restart your terminal.

Can chrome-devtools CLI capture performance and network data?▼

Yes. Use performance_start_trace and performance_stop_trace to record traces, take_memory_snapshot for heap snapshots, and list_network_requests or get_network_request to inspect traffic with filtering and pagination.

Why is the chrome-devtools command not found after installation?▼

This usually means the global npm bin directory is missing from your PATH. Restart your terminal or source your shell config, and avoid sudo installs by using a version manager like nvm.