skills.rest
CivicActions
CivicActionsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

browser-check

Validate frontend changes by inspecting DOM state, console output, and network requests.

2|Updated May 24, 2026
Search Tags:#testing#debugging#frontend#validation#responsive#browser
One-click install
npx skills add https://github.com/CivicActions/ai-runbook-jh --skill browser-check-civicactions
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-check
Source: https://github.com/CivicActions/ai-runbook-jh/tree/main/skills/browser-check
Command: npx skills add https://github.com/CivicActions/ai-runbook-jh --skill browser-check-civicactions

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill eliminates the ambiguity of manual frontend testing by providing a structured, repeatable process for validating visual output, console logs, and network behavior in a local development environment.

Core Features & Use Cases

  • Automated Inspection: Uses sanctioned browser-inspection MCPs to navigate pages, inspect the DOM, and check for console or network errors.
  • Cross-Viewport Testing: Ensures responsive design compliance by validating layouts at mobile, tablet, and desktop breakpoints.
  • Use Case: When a developer finishes a UI component, they use this skill to verify that the component renders correctly, handles state changes without console errors, and looks right across different screen sizes.

Quick Start

Use the browser-check skill to validate the search results page on the local development server.

Frequently Asked Questions about browser-check

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

FAQPage Schema
What's the best way to validate frontend changes in a local development environment?▼

Automated browser inspection validates frontend changes by navigating local development URLs to inspect the DOM and capture console output. It eliminates manual testing ambiguity by applying repeatable validation steps to verify layouts and state changes.

How do I test responsive design across multiple viewports?▼

Cross-viewport testing validates responsive design compliance by inspecting layouts at mobile, tablet, and desktop breakpoints. It ensures the UI component renders correctly and handles state changes across different screen sizes.

How do I check for console and network errors during frontend development?▼

Checking for console and network errors involves inspecting browser output logs during local development. By monitoring requests and console output, you verify components handle state changes without generating console errors.

Do I need a specific tool to automate browser inspection for frontend validation?▼

Automating browser inspection requires a project-sanctioned browser-inspection MCP and defined local environment URLs. This setup enables automated validation steps to navigate pages and inspect the DOM without manual intervention.

When should I use automated browser inspection instead of manual testing?▼

Use automated browser inspection instead of manual testing when you need a structured, repeatable process for validating visual output and network behavior. It is effective for bug fixes, new feature development, and responsive design verification.

Related Skills

Explore More Software Engineering Skills→
edwifiguyedwifiguy
1

cli-anything-browser

Automate browser navigation and DOM inspection via a CLI.

Community
Intermediate
SjdjdiejdrirhdkjejSjdjdiejdrirhdkjej

production-deployment-phase

Promote validated staging builds to production with semantic versioning and health checks.

Community
Advanced
paolomozpaolomoz

Testing Blocks

Guide unit, browser, lint, and performance testing for AEM Edge Delivery projects.

Community
Intermediate
etylsarinetylsarin
59

browser-testing

Automate browser-based UI testing with Chrome DevTools MCP.

Community
Advanced