Skip to main content Skills Marketplace Descubre y explora habilidades de IA creadas por la comunidad.
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Mostrar detalles del prompt Un comando directo omite el prompt de revisión. Revisa el origen antes de ejecutarlo.
npx skills add https://github.com/proffesor-for-testing/sentinel-api-testing --skill accessibility-testingEl comando permanece en una sola línea. Desplázate horizontalmente para revisarlo antes de copiarlo.
¿Prefieres una copia local? Descarga los archivos que SkillsMP tiene disponibles ahora.
Descargar Zip Descargando... name accessibility-testing description WCAG 2.2 compliance testing, screen reader validation, and inclusive design verification. Use when ensuring legal compliance (ADA, Section 508), testing for disabilities, or building accessible applications for 1 billion disabled users globally. category specialized-testing priority high tokenEstimate 1100 agents ["qe-visual-tester","qe-test-generator","qe-quality-gate"] implementation_status optimized optimization_version 1 last_optimized 2025-12-02T00:00:00.000Z dependencies [] quick_reference_card true tags ["accessibility","wcag","a11y","screen-reader","ada","section-508","inclusive"]
Accessibility Testing
<default_to_action>
When testing accessibility or ensuring compliance:
APPLY POUR principles: Perceivable, Operable, Understandable, Robust
TEST with keyboard-only navigation (Tab, Enter, Escape)
VALIDATE with screen readers (VoiceOver, NVDA, JAWS)
CHECK color contrast (4.5:1 for text, 3:1 for large text)
AUTOMATE with axe-core, integrate in CI/CD pipeline
Quick A11y Checklist:
All images have alt text (or alt="" for decorative)
All form fields have labels
Color is never the only indicator
Focus visible on all interactive elements
Keyboard navigation works throughout
Critical Success Factors:
Automated testing catches 30-50% of issues
Manual testing with real assistive tech required
Include users with disabilities in testing
</default_to_action>
Quick Reference Card
When to Use
Legal compliance (ADA, Section 508, EU Directive)
New feature development
Before release validation
Accessibility audits
WCAG 2.2 Levels
Level Requirement Target A Basic accessibility Minimum legal AA Standard (most orgs) Industry standard AAA Enhanced Specialized sites
POUR Principles
Principle Meaning Key Tests Perceivable Can perceive content Alt text, contrast, captions Operable Can operate UI Keyboard, no seizures, navigation Understandable Can understand Clear labels, predictable, errors Robust Works with assistive tech Valid HTML, ARIA
Color Contrast Requirements
Normal text 4.5:1 7:1 Large text (18pt+) 3:1 4.5:1 UI components 3:1 -
Keyboard Navigation Testing
test ('all interactive elements keyboard accessible' , async ({ page }) => {
await page.goto ('/' );
const focusableElements = await page.$$('button, a, input, select, textarea, [tabindex]' );
for (const element of focusableElements) {
await element.focus ();
const isFocused = await element.evaluate (el =>document .activeElement === el);
expect (isFocused).toBe (true );
}
});
test ('focus indicator visible' , async ({ page }) => {
await page.goto ('/' );
await page.keyboard .press ('Tab' );
const focusedElement = await page.locator (':focus' );
const outline = await focusedElement.evaluate (el =>getComputedStyle (el).outline
);
expect (outline).not .toBe ('none' );
});
Automated Testing with axe-core import { test, expect } from '@playwright/test' ;
import AxeBuilder from '@axe-core/playwright' ;
test ('page has no accessibility violations' , async ({ page }) => {
await page.goto ('/' );
const results = await new AxeBuilder ({ page })
.withTags (['wcag2a' , 'wcag2aa' , 'wcag22aa' ])
.analyze ();
expect (results.violations ).toEqual ([]);
});
test ('checkout flow accessible' , async ({ page }) => {
await page.goto ('/checkout' );
const results = await new AxeBuilder ({ page })
.include ('#checkout-form' )
.disableRules (['color-contrast' ])
.analyze ();
expect (results.violations .filter (v =>impact === 'critical' || v.impact === 'serious'
)).toHaveLength (0 );
});
Screen Reader Testing Checklist ## VoiceOver (macOS) Testing
- [ ] Page title announced on load
- [ ] Headings hierarchy correct (h1 → h2 → h3)
- [ ] Landmarks present (nav, main, footer)
- [ ] Images have descriptive alt text
- [ ] Form labels read correctly
- [ ] Error messages announced
- [ ] Dynamic content updates announced (aria-live)
Agent-Driven Accessibility
await Task ("Accessibility Validation" , {
url : 'https://example.com/checkout' ,
standard : 'WCAG2.2' ,
level : 'AA' ,
checks : ['keyboard' , 'screen-reader' , 'color-contrast' ],
includeScreenReaderSimulation : true
}, "qe-visual-tester" );
const a11yFleet = await FleetManager .coordinate ({
strategy : 'comprehensive-accessibility' ,
agents : [
'qe-visual-tester' ,
'qe-test-generator' ,
'qe-quality-gate'
],
topology : 'parallel'
});
Agent Coordination Hints
Memory Namespace aqe/accessibility/
├── wcag-results/* - WCAG audit results
├── screen-reader/* - Screen reader test logs
├── remediation/* - Fix recommendations
└── compliance/* - Compliance reports
Fleet Coordination const a11yFleet = await FleetManager .coordinate ({
strategy : 'accessibility-testing' ,
agents : [
'qe-visual-tester' ,
'qe-test-generator' ,
'qe-quality-gate'
],
topology : 'parallel'
});
Related Skills
Remember 1 billion people have disabilities. Inaccessible software excludes 15% of humanity. Legal requirements: ADA, Section 508, EU Directive 2016/2102. $13T purchasing power. 250%+ increase in lawsuits.
Automated testing catches only 30-50% of issues. Combine with manual keyboard testing, screen reader testing, and real user testing with people with disabilities.
With Agents: Agents automate WCAG 2.2 compliance checking, screen reader simulation, and focus management validation. Use agents to enforce accessibility standards in CI/CD and catch violations before production.
Ocupaciones relacionadas SOC
Basado en la clasificación ocupacional SOC
