Skills
.Work. You
Rest

chrome-devtools-testing

Community

Automate browser tests with GUI Chrome DevTools.

Software Engineering#quality assurance#browser automation#web testing#Chrome DevTools#E2E testing#GUI testing#CDP
Authormetasaver
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Automating web application testing, especially for E2E scenarios, often requires complex setups and can be prone to headless browser issues. This Skill standardizes GUI Chrome DevTools automation for reliable testing.

Core Features & Use Cases

  • GUI Chrome Automation: Provides a standard setup for launching GUI Chrome with remote debugging, avoiding the known issues of headless mode.
  • E2E Testing Workflow: Guides through a complete workflow from starting Chrome and dev servers to navigating, inspecting (snapshots, console, network), and interacting (click, fill, hover) with web pages.
  • Troubleshooting & Best Practices: Offers solutions for common issues like "requires non-default data directory," "Not connected" from MCP, ERR_CONNECTION_REFUSED, and specific WSL environment failures.
  • Use Case: Automate an end-to-end test for a checkout flow, including navigating pages, filling forms, clicking buttons, and taking screenshots to verify visual elements.

Quick Start

Start Chrome with remote debugging and navigate to "http://localhost:3000/login".

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: chrome-devtools-testing
Download link: https://github.com/metasaver/metasaver-marketplace/archive/main.zip#chrome-devtools-testing

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