skills.rest
oakoss
oakossOFFICIAL
Explore all skills by this author →
Website𝕏@oak_ossGitHub

chrome-devtools

Automate and debug live Chrome browser sessions via the Model Context Protocol.

14|5|Updated Jan 29, 2026
Search Tags:#testing#debugging#browser automation#mcp#web scraping#chrome
One-click install
npx skills add https://github.com/oakoss/agent-skills --skill chrome-devtools-oakoss
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-devtools
Source: https://github.com/oakoss/agent-skills/tree/main/skills/chrome-devtools
Command: npx skills add https://github.com/oakoss/agent-skills --skill chrome-devtools-oakoss

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill automates browser-based tasks, allowing AI agents to interact with real Chrome browsers for workflows, data extraction, debugging, and testing, leveraging existing user logins.

Core Features & Use Cases

  • Browser Control: Navigate, click, type, and extract data from web pages.
  • Debugging: Inspect console logs, network requests, and DOM state.
  • Use Case: Automate filling out a complex online form across multiple steps, or scrape data from a logged-in e-commerce site.

Quick Start

Use the chrome-devtools skill to navigate to https://example.com and extract the page title.

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 form filling in a real Chrome browser?▼

Browser automation in Chrome is achieved by using the Model Context Protocol alongside a dedicated extension to interact with live sessions, enabling form filling and data extraction. This allows AI agents to navigate pages and execute workflows.

Can I use this for frontend debugging and inspecting network requests through the Model Context Protocol?▼

Frontend debugging is supported via the Model Context Protocol, allowing you to inspect console logs, monitor network requests, and evaluate DOM state during live browser sessions. This facilitates direct interaction with web pages for testing.

Do I need the Claude Code CLI or DevTools MCP to control Chrome browser automation?▼

You need Google Chrome and the Claude in Chrome extension to control browser automation, while the Claude Code CLI or DevTools MCP is optional for programmatic control. These components facilitate AI-driven interaction with live sessions.

What is the best way to extract data from a logged-in e-commerce site using browser automation?▼

The best way to extract data from logged-in sites is by leveraging existing user logins through a dedicated Chrome extension, allowing the AI to navigate authenticated pages and scrape data directly. This bypasses manual authentication steps.

Why use a real Chrome browser instance instead of a headless one for web scraping?▼

Using a real Chrome instance allows the AI to leverage existing user logins and interact with live browser sessions for complex web scraping workflows. This approach handles multi-step form automation and authenticated data extraction effectively.

Related Skills

Explore More Software Engineering Skills→
DicklesworthstoneDicklesworthstone
70

claude-chrome

Automate authenticated browser tasks in a real Chrome session via Claude Code CLI and MCP.

Community
Advanced
maxvaegamaxvaega
146

json-parser

Parse and validate JSON data against schemas and JSONPath queries.

Community
Intermediate
JimmyPaoliniJimmyPaolini

mcp-chrome-devtools

Debug and profile web applications using the Chrome DevTools MCP server.

Community
Advanced
ZhanlinCuiZhanlinCui
178

web-access

Select WebSearch, WebFetch, or headless Chrome CDP for web tasks.

Community
Advanced