skills.rest
drvoss
drvossCOMMUNITY
Explore all skills by this author →
GitHub

browser-devtools

Inspect DOM state, network traffic, and Core Web Vitals in Chrome DevTools.

42|9|Updated Mar 16, 2026
Search Tags:#accessibility#devtools#playwright#frontend-testing#network-debugging#performance-profiling#dom-inspection
One-click install
npx skills add https://github.com/drvoss/everything-copilot-cli --skill browser-devtools-drvoss
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-devtools
Source: https://github.com/drvoss/everything-copilot-cli/tree/main/skills/testing/browser-devtools
Command: npx skills add https://github.com/drvoss/everything-copilot-cli --skill browser-devtools-drvoss

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Finds the root causes of frontend failures by validating DOM state, network traffic, performance metrics, and accessibility at runtime so you can convert manual findings into reliable automated tests.

Core Features & Use Cases

  • DOM validation: Confirm element presence, attributes, visibility, and form data to reproduce UI issues.
  • Network inspection: Verify request URLs, methods, headers, payloads, responses, and CORS behavior to debug API integration problems.
  • Performance profiling: Measure Core Web Vitals (LCP, INP/CLS) and long tasks to surface regressions under realistic conditions.
  • Accessibility checks: Run axe or DevTools accessibility audits to identify and log violations for remediation.
  • Test conversion: Capture selectors and interaction steps observed in DevTools to seed Playwright end-to-end tests.

Quick Start

Open the running app in Chrome, open DevTools, inspect the DOM, Network, and Performance tabs to reproduce the failing flow, record selectors and metrics, and export the findings for Playwright test creation.

Frequently Asked Questions about browser-devtools

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

FAQPage Schema
How do I debug frontend issues using Chrome DevTools?▼

Debug frontend issues by opening your running web app in Chrome or Edge, using DevTools to inspect DOM state, network traffic, and Core Web Vitals to reproduce and validate failing UI flows.

Can I capture DOM selectors from DevTools to create Playwright tests?▼

Yes, you can capture selectors and interaction steps observed during manual DevTools inspection to seed and convert findings into reliable Playwright end-to-end tests.

How do I measure Core Web Vitals like LCP and CLS during performance profiling?▼

Measure Core Web Vitals by using DevTools performance profiling to record LCP, INP, and CLS metrics along with long tasks to surface regressions under realistic runtime conditions.

How do I inspect network requests to debug API integration problems?▼

Inspect network requests in DevTools to verify request URLs, methods, headers, payloads, responses, and CORS behavior to find the root causes of API integration failures.

What is the best way to run an accessibility audit on a live web app?▼

Run accessibility audits by using axe or built-in DevTools accessibility checks to identify and log violations in the live web app for remediation.

Do I need a running web app to inspect DOM state and network interactions?▼

Yes, you need a running web app reachable in the browser, Chrome or Edge DevTools access, and reproduction steps or selectors to verify DOM state and network requests.

Related Skills

Explore More Software Engineering Skills→
aleph23aleph23

browser-testing

Executes browser-based UI verification using Chrome DevTools MCP for DOM, console, network, and performance inspection.

Community
Intermediate
gajjalaashok75-UIgajjalaashok75-UI
2

e2e-testing

Builds Playwright-based end-to-end browser test suites for CI/CD pipelines.

Community
Advanced
yuhle-qugyuhle-qug

playwright-expert

Build cross-browser Playwright end-to-end tests for web applications.

Community
Advanced
sanand0sanand0
11

devtools

Control Chrome via DevTools Protocol for browser testing and debugging.

Community
Advanced