← ClaudeAtlas

devtoolslisted

Chrome DevTools MCP setup and live-browser debugging for visual app inspection, console/network/performance triage, and automation. Use when the user asks to set up browser debugging, launch Chrome with DevTools, configure chrome-devtools-mcp, see what my app looks like, take screenshots of my web application, debug console errors, inspect network requests and API responses, measure Core Web Vitals or page performance, run a Lighthouse audit, test button clicks or form submissions, automate browser interactions, fill out forms programmatically, simulate user actions, emulate mobile devices or slow networks, capture DOM snapshots, execute JavaScript in the browser, or troubleshoot Chrome DevTools MCP connection issues. Supports Windows, Linux, and WSL2 environments. Do NOT use for headless CI test runs - use Playwright tests directly. Do NOT use for Selenium/Puppeteer setup.
henkisdabro/wookstar-claude-plugins · ★ 86 · Web & Frontend · score 75
Install: claude install-skill henkisdabro/wookstar-claude-plugins
# Chrome DevTools MCP **GitHub Repository:** https://github.com/ChromeDevTools/chrome-devtools-mcp Without browser access, Claude is "coding blindfolded" - making changes without seeing results. The Chrome DevTools MCP server provides specialised tools across these categories: | Category | Capabilities | |----------|--------------| | **Visual Inspection** | Take screenshots, capture DOM snapshots, see rendered output | | **Console & Logging** | Read console messages, catch JavaScript errors, debug issues | | **Network Analysis** | Inspect API requests/responses, analyse headers, debug fetch calls | | **Performance** | Record traces, measure Core Web Vitals (LCP, CLS, TBT), identify bottlenecks | | **User Simulation** | Click elements, fill forms, drag-and-drop, handle dialogs | | **Device Emulation** | Simulate mobile viewports, throttle CPU/network, test responsive design | ## Quick Start Workflow Execute these steps in order: ### Step 1: Detect Environment ```bash bash scripts/detect_environment.sh ``` Returns one of: `windows`, `linux`, or `wsl2` ### Step 2: Verify Chrome Installation ```bash bash scripts/check_chrome.sh <environment> ``` Outputs `status:installed` or `status:not_installed`. If not installed, see [references/chrome-installation.md](references/chrome-installation.md) for installation options. **IMPORTANT:** Do not proceed until Chrome is installed and verified. ### Step 3: Check MCP Server Status ```bash claude mcp list | grep -i chrome ``` I