skills.rest
kozyszoo
kozyszooCOMMUNITY
Explore all skills by this author →
GitHub

ui-verify

Detect frontend changes and run browser automation tests for UI verification.

1|Updated Mar 3, 2026
Search Tags:#automation#performance#debugging#frontend#chrome devtools#ui testing
One-click install
npx skills add https://github.com/kozyszoo/antigravity-handson --skill ui-verify-kozyszoo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-verify
Source: https://github.com/kozyszoo/antigravity-handson/tree/main/.claude/skills/ui-verify
Command: npx skills add https://github.com/kozyszoo/antigravity-handson --skill ui-verify-kozyszoo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill streamlines the process of verifying frontend changes, debugging UI issues, and analyzing application performance by automating browser interactions and checks.

Core Features & Use Cases

  • Automated UI Testing: Detects changes and runs tests against the relevant parts of the web application.
  • Browser Debugging: Integrates with Chrome DevTools for in-depth inspection and debugging.
  • Performance Analysis: Measures Core Web Vitals and identifies performance bottlenecks.
  • Use Case: After making changes to a React component, use this Skill to automatically navigate to the affected page, perform user interactions, check for console errors, and capture screenshots to ensure everything works as expected.

Quick Start

Run the ui-verify skill to automatically test the latest changes in the frontend application.

Frequently Asked Questions about ui-verify

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

FAQPage Schema
How do I automate frontend UI testing after making component changes?▼

Automate frontend UI testing by detecting application changes and executing browser interactions against affected pages. The skill navigates to relevant components, performs user flow validation, and captures screenshots to verify updates work as expected.

Can I use Chrome DevTools to debug UI issues during automated testing?▼

Yes, Chrome DevTools integration enables in-depth inspection and UI debugging during automated browser testing. This allows you to monitor console errors and analyze application bottlenecks while executing automated user flow validation.

What is the best way to monitor console errors during user flow validation?▼

Monitor console errors by running automated browser interactions that navigate user flows and check for runtime issues. The skill executes API interaction checks and captures console output to ensure frontend changes remain error-free.

How do I measure Core Web Vitals and identify performance bottlenecks in my web application?▼

Measure Core Web Vitals by automating performance analysis through browser interactions. The skill identifies performance bottlenecks and evaluates frontend metrics during continuous integration testing and rapid debugging cycles.

Does this UI testing approach support continuous integration environments?▼

Yes, this UI testing approach satisfies requirements for continuous integration testing. It automates component testing, API interaction checks, and console error monitoring to support rapid debugging cycles within CI pipelines.

Related Skills

Explore More Software Engineering Skills→
ByeongminLeeByeongminLee
2

test

Execute unit and integration tests guided by TEST_STRATEGY.md and TEST.md.

Community
Intermediate
kanopikanopi
16

performance-analyzer

Analyze code, queries, and rendering to identify performance bottlenecks.

Official
Advanced
johnrtiptonjohnrtipton
4

pipeline-ship

Automate testing, reviewing, and shipping code changes in CI/CD pipelines.

Community
Intermediate
mymx2mymx2
4

browser-testing-with-devtools

Inspect DOM, network traffic, and screenshots via Chrome DevTools MCP.

Community
Advanced