verify-web-change

Launches the app stack and tests UI changes in a real browser via Playwright MCP.

8|2|Updated Nov 2, 2025
One-click install
npx skills add https://github.com/fx/cc --skill verify-web-change
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: verify-web-change
Source: https://github.com/fx/cc/tree/main/plugins/fx-dev/skills/verify-web-change
Command: npx skills add https://github.com/fx/cc --skill verify-web-change

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill validates web changes by booting the app stack and running browser automation to verify UI behavior.

Core Features & Use Cases

  • Checks Playwright MCP availability and app startup
  • Navigates to pages and asserts UI states
  • Generates evidence snapshots for verification

Quick Start

Run the launch app stack and start Playwright-based verification against the changed UI.

Frequently Asked Questions about verify-web-change

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

FAQPage Schema
How do I verify UI changes in a web app using browser automation?

Browser automation with Playwright lets you launch your app stack and test UI behavior programmatically. This Skill starts your dev server, navigates to changed routes, captures snapshots, runs interactions, and reports pass/fail results to validate PR changes and ensure visual correctness.

Can I use Playwright to test web changes in CI or local staging?

Yes. Playwright MCP-driven browser automation runs in CI pipelines and local staging environments. This Skill checks Playwright MCP availability, boots your app stack, installs dependencies, and verifies UI states and console errors across affected pages.

What does the Playwright MCP server do for web testing?

The Playwright MCP server enables browser automation control. This Skill requires it to navigate pages, capture element snapshots, run user interactions, and validate UI changes. It exits gracefully if the server is unavailable.

How do I generate evidence snapshots when testing UI changes?

This Skill captures element snapshots during browser automation to document UI state before and after interactions. Snapshots serve as verification evidence for visual and functional correctness in PR validation workflows.

What prerequisites do I need to run browser-based UI verification?

You need Playwright MCP server installed and available, a web app that can start locally, and dependency management set up. This Skill discovers PR changes, installs dependencies, launches the dev server, and begins verification—exiting if Playwright MCP is unavailable.

Can browser automation detect console errors in my web app?

Yes. This Skill checks for console errors during navigation and interaction testing. Error detection is part of the verification report, helping catch runtime issues alongside UI state validation.