skills.rest
aberrantCode
aberrantCodeCOMMUNITY
Explore all skills by this author →
GitHub

ui-testing

Perform automated accessibility and visual checks on web and mobile UI components.

1|Updated Feb 26, 2026
Search Tags:#accessibility#eslint#contrast#playwright#ui-testing#visual-testing#jsx-a11y
One-click install
npx skills add https://github.com/aberrantCode/llm_skills --skill ui-testing-aberrantcode
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-testing
Source: https://github.com/aberrantCode/llm_skills/tree/main/claude/skills/ui-testing
Command: npx skills add https://github.com/aberrantCode/llm_skills --skill ui-testing-aberrantcode

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Visual UI defects like invisible buttons, broken layouts, and poor contrast often slip into production, causing usability issues and accessibility problems.

Core Features & Use Cases

  • Pre-flight UI validation: quick checks for visibility, color contrast, focus rings, and tap targets before shipping.
  • Automated accessibility cues: guidance and examples for addressing common issues (aria-labels, keyboard navigation).
  • Real-world scenarios: validate new components across web and mobile breakpoints, dark/light modes, and responsive layouts.

Quick Start

Run the UI Testing Skill to perform automated visual and accessibility checks on your latest UI components.

Frequently Asked Questions about ui-testing

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

FAQPage Schema
How do I automate accessibility checks for visual UI defects like poor contrast?▼

Automate accessibility checks for visual UI defects by applying a checklist-driven workflow with code-backed examples to validate contrast, focus states, and keyboard navigation across your components before shipping.

What is the best way to test responsive layouts across dark and light modes?▼

The best way to test responsive layouts across dark and light modes is applying automated visual checks to components across breakpoints to ensure UI visibility and prevent broken layouts in different themes.

Can I use this workflow to validate new design-system components?▼

Yes, you can validate new design-system components by performing pre-flight UI validation to quickly check for visibility, color contrast, focus rings, and tap targets across web and mobile breakpoints.

How do I check keyboard navigation and aria-labels in my web components?▼

Check keyboard navigation and aria-labels in web components using automated accessibility cues that provide concrete guidance and code-backed examples for addressing common interactive element issues.

Why do visual UI defects like invisible buttons slip into production?▼

Visual UI defects like invisible buttons slip into production when pre-flight UI validation is skipped, bypassing quick automated checks for visibility, color contrast, focus rings, and tap targets before shipping.

Related Skills

Explore More Software Engineering Skills→
da-moonda-moon
1

gsd-ui-developer

Create UI specifications and validate visuals and accessibility in browsers.

Community
Advanced
Community-AccessCommunity-Access
387

Playwright Accessibility Testing

Automate web accessibility testing with Playwright and Axe-Core to report WCAG violations.

Official
Advanced
michaelsvanbeekmichaelsvanbeek
1

accessibility-testing

Automate accessibility testing and WCAG compliance validation for web projects.

Community
Advanced
LazyNinja435LazyNinja435
1

Exploratory Testing

Perform structured exploratory testing sessions to identify software defects and usability issues.

Community
Intermediate