Skills
.Work. You
Rest

web-devtools-debug

Community

Remote-debug web apps and Chrome extensions.

Software Engineering#chrome-devtools#web-app#network-monitoring#remote-debugging#dom-inspection#javascript-execution#extension-debugging
AuthorRyoyaYahagi
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Remote debugging of web apps and Chrome extensions using Chrome DevTools MCP, enabling you to diagnose console errors, monitor network activity, inspect the DOM, execute JavaScript, and capture screenshots across remote contexts.

Core Features & Use Cases

  • Remote debugging via Chrome DevTools MCP for web apps and Chrome extensions
  • Page operations: navigate, click, type, screenshot, getPageContent
  • Debugging: evaluate, getConsoleMessages, getNetworkRequests
  • Inspection: getElements, getStyles
  • Workflows:
    • Chrome extension debugging: open chrome://extensions/, inspect service workers, debug content scripts
    • Web app debugging: load pages, check console, investigate network, inspect DOM

Quick Start

Launch Chrome with remote debugging enabled and connect your MCP workflow to start debugging a target page or Chrome extension.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: web-devtools-debug
Download link: https://github.com/RyoyaYahagi/skills/archive/main.zip#web-devtools-debug

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.