Creator · vibeeval
Last updated · Sep 3, 2026
axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader testing, and ARIA pattern validation.
Sandbox only
Install targets
Codex install prompt
Install the "accessibility-testing" agent skill from https://github.com/vibeeval/vibecosystem/tree/main/skills/accessibility-testing. Read its SKILL.md or equivalent instructions first, install only the files needed for this workspace, and summarize any required setup before using it. Skill purpose: axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader testing, and ARIA pattern validation. After the install attempt, report the result to https://www.openagentskill.com/api/agent/outcome with POST JSON {"event_id":"install_<unique-id>","skill_slug":"vibeeval-accessibility-testing","task":"Install accessibility-testing","agent":"codex","outcome":"success","install_used":true}. Replace event_id with a unique value and outcome with success or failed. Report success only after the skill is installed and a minimal verification passes.Supply asset profile
Code review, repo analysis, testing, CI, GitHub, DevOps, and developer workflow skills.
Scenario
Testing and QA
I need my agent to test a web app, reproduce bugs, and verify fixes.
Agent fit
Claude Code + Browser agents + CLI
Codex, Claude Code, Cursor, CLI, or custom agents.
Install
Ready
npx skills add vibeeval/vibecosystem --skill accessibility-testing
Maintenance
fresh
30d since push
Risk
Needs review
Financial research output is not financial advice; require human review before any live investment decision
GitHub quality
530
74/100 Quality · 81/100 Trust
Coverage tags
Review notes
Financial research output is not financial advice; require human review before any live investment decision · Financial research output is not financial advice; require human review before any live investment decision.
Agent adoption scorecard
These scores combine public repository metadata, OpenAgentSkill review signals, maintenance freshness, and install readiness. They are a shortlist signal, not a replacement for human review.
Quality
StrongSolid option that is likely worth shortlisting for production workflows.
Trust
Sandbox onlyUseful candidate with missing or mixed trust signals. Keep it in an isolated workspace until the outcome loop proves task fit.
Audit
Needs reviewA machine-readable review of install readiness, security metadata, maintenance, and adoption risk.
OpenAgentSkill Trust Score v5
Run only in a sandbox and compare close alternatives before using it for real work.
Stars
530 GitHub stars
Repo activity
530 stars, 44 forks
Maintenance
30d since push
License
MIT
Install
npx skills add vibeeval/vibecosystem --skill accessibility-testing
Install safety
Agent-readable metadata
Use this block or the embedded JSON to decide whether an agent should install this skill, choose an alternative, or ask for human review first.
Suited tasks
Suited agents
Install decision
Trust and risk
Outcome loop
Install command
npx skills add vibeeval/vibecosystem --skill accessibility-testingDo not use when
Alternative
168.6K Stars
npx skills add mattpocock/skills --skill code-review
Alternative
40.8K Stars
npx skills add appsmithorg/appsmith
Alternative
175.7K Stars
npx skills add mattpocock/skills --skill implement
Alternative
30.9K Stars
npx skills add vercel-labs/agent-skills --skill vercel-react-best-practices
Agent safety v2
Usable candidate, but the agent should surface permission and audit notes before installation.
Require human approval before installing into a real workspace.
medium
Skill may drive a browser or interact with web pages.
medium
Skill likely fetches remote pages, APIs, repositories, or external services.
Agent resolve plan
The Resolve API returns the selected skill, alternatives, safety policy, audit notes, install target, and copy-paste prompt an agent can follow without scraping this page.
Open JSON
/api/agent/resolve?task=Use%20accessibility-testing%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Resolve text
/api/agent/resolve?task=Use%20accessibility-testing%20for%20an%20agent%20workflow&agent=codex&max_risk=medium&format=text
Install handoff
/api/skills/vibeeval-accessibility-testing/install
Agent should check
Copy prompt
Task: Use accessibility-testing in this workspace.
Resolve first: https://www.openagentskill.com/api/agent/resolve?task=Use%20accessibility-testing%20for%20an%20agent%20workflow&agent=codex&max_risk=medium
Review install handoff: https://www.openagentskill.com/api/skills/vibeeval-accessibility-testing/install
Install command: npx skills add vibeeval/vibecosystem --skill accessibility-testing
Before running it, summarize audit warnings, required permissions, and the fallback skill if install is risky.Agent handoff
Use the public install endpoint to fetch the command, safety checklist, target prompts, and canonical links for this skill.
Install handoff
/api/skills/vibeeval-accessibility-testing/install
LLM text format
/api/skills/vibeeval-accessibility-testing/install?format=text
Find alternatives
/api/skills/search?q=accessibility-testing&limit=3
Agent prompt
Use accessibility-testing for this task. Review https://www.openagentskill.com/api/skills/vibeeval-accessibility-testing/install, then install with: npx skills add vibeeval/vibecosystem --skill accessibility-testingRegistry metadata
This page exposes the same decision, trust, audit, use-case, and install signals through the Registry API, so agents can rank this skill without scraping the UI.
Manifest
/api/registry/manifest/vibeeval-accessibility-testing
LLM text
/api/registry/manifest/vibeeval-accessibility-testing?format=text
Install alias
/api/registry/install/vibeeval-accessibility-testing
Recommend
/api/registry/recommend?task=Use%20accessibility-testing%20in%20an%20agent%20workflow&limit=3
Agent fit
Browser automation
Use-case tags
Platforms
Claude Code, Browser agents
Audit report
A machine-readable review of install readiness, security metadata, maintenance, and adoption risk.
Agent decision cockpit
Use this as a leading candidate, then validate the README and install path in your own agent stack.
Role in stack
Primary pick
Primary fit
Browser automation
Trust label
Production-ready
Install path
Command ready
Use when
Evidence
review first
Implementation path
Trust profile
Useful candidate with missing or mixed trust signals. Keep it in an isolated workspace until the outcome loop proves task fit.
GitHub adoption
INFO530 GitHub stars
Stars/forks activity
INFO530 stars, 44 forks; issue activity unavailable in current metadata
Recent maintenance
PASS30d since push
License clarity
PASSMIT
Good signals
Review before install
Recommended action
Run only in a sandbox and compare close alternatives before using it for real work.
Quality profile
Solid option that is likely worth shortlisting for production workflows.
Workflow fit
Operate web apps
I need my agent to control a browser, fill forms, and verify web app workflows.
Verify behavior
I need my agent to test a web app, reproduce bugs, and verify fixes.
Build and ship code
I need a coding agent that can understand a repository, edit code, and review pull requests.
Workflow fit
Operate and verify web apps
A workflow for agents that navigate products, fill forms, take screenshots, and verify real user flows across web applications.
Design, build, test, and ship interfaces
A practical workflow for agents that turn product briefs or Figma designs into polished frontend code, review the result, test it in a browser, and prepare a safe deployment.
Turn skills into distribution
A workflow for turning newly indexed skills into SEO briefs, social drafts, comparison pages, and reusable publishing workflows.
Alternative shortlist
Similar skills that may fit this task.
Review a branch or diff against repository standards and the originating spec in two independent analysis passes.
Platform to build admin panels, internal tools, and dashboards. Integrates with 25+ databases and any API.
Implement work from an approved spec or ticket set, run focused and full tests, invoke code review, and commit the result to the current branch.
React and Next.js performance guidance for writing, reviewing, and refactoring production UI code.
--- name: accessibility-testing description: axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader testing, and ARIA pattern validation. ---
# Accessibility Testing
## axe-core Setup
### jest-axe (unit / component tests) ```typescript import { axe, toHaveNoViolations } from 'jest-axe' import { render } from '@testing-library/react' expect.extend(toHaveNoViolations)
test('LoginForm has no a11y violations', async () => { const { container } = render(<LoginForm />) const results = await axe(container) expect(results).toHaveNoViolations() }) ```
### playwright-axe (e2e) ```typescript import { test, expect } from '@playwright/test' import AxeBuilder from '@axe-core/playwright'
test('homepage passes axe audit', async ({ page }) => { await page.goto('/') const results = await new AxeBuilder({ page }) .withTags(['wcag2a', 'wcag2aa', 'wcag21aa']) .analyze() expect(results.violations).toEqual([]) }) ```
### cypress-axe ```javascript // cypress/support/e2e.js import 'cypress-axe'
// in test cy.visit('/') cy.injectAxe() cy.checkA11y(null, { runOnly: { type: 'tag', values: ['wcag2aa'] }, }) ```
## WCAG 2.2 AA Checklist — Top 20 Violations
| # | Criterion | Check | |---|-----------|-------| | 1 | Images have alt text | `<img alt="description">` or `alt=""` for decorative | | 2 | Form inputs have labels | `<label for>` or `aria-label` or `aria-labelledby` | | 3 | Color contrast ≥ 4.5:1 | Normal text; 3:1 for large text (18pt or 14pt bold) | | 4 | Heading hierarchy | h1 → h2 → h3, no skipping levels | | 5 | Keyboard focusable | All interactive elements reachable via Tab | | 6 | Focus visible | `:focus` outline never `outline: none` without replacement | | 7 | No keyboard trap | Tab can always exit modals, dropdowns, widgets | | 8 | Skip navigation link | First focusable element: "Skip to main content" | | 9 | Page has `<title>` | Unique, descriptive per page | | 10 | Language attribute | `<html lang="en">` | | 11 | Error identification | Form errors are text, not color-only | | 12 | Error suggestions | Tell users how to fix the error | | 13 | Link purpose clear | No "click here" or "read more" without context | | 14 | Button text | No icon-only buttons without `aria-label` | | 15 | Table headers | `<th scope="col|row">` on data tables | | 16 | No seizure content | No flashing > 3 times/sec | | 17 | Status messages | `role="status"` or `aria-live` for dynamic updates | | 18 | Reflow at 400% zoom | Single column, no horizontal scroll | | 19 | Text spacing adjustable | No overflow when line-height/letter-spacing increased | | 20 | Timeout warning | Warn before session expires, allow extension |
## Keyboard Navigation Test Patterns
### Tab order verification ```typescript test('modal tab order is correct', async ({ page }) => { await page.click('[data-testid="open-modal"]')
// First focus should be the modal's close button or heading await expect(page.locator('[aria-label="Close dialog"]')).toBeFocused()
// Tab through: close → input → submit await page.keyboard.press('Tab') await expect(page.locator('#email-input')).toBeFocused()
await page.keyboard.press('Tab') await expect(page.locator('[type="submit"]')).toBeFocused()
// Wrap back to close button (focus trap) await page.keyboard.press('Tab') await expect(page.locator('[aria-label="Close dialog"]')).toBeFocused() }) ```
### Focus trap in modals ```typescript // Escape should close await page.keyboard.press('Escape') await expect(page.locator('[role="dialog"]')).not.toBeVisible()
// Focus returns to trigger element after close await expect(page.locator('[data-testid="open-modal"]')).toBeFocused() ```
### Skip navigation link ```typescript test('skip link goes to main content', async ({ page }) => { await page.goto('/') await page.keyboard.press('Tab') // first tab = skip link
const skipLink = page.locator('a:has-text("Skip to")') await expect(skipLink).toBeFocused()
await page.keyboard.press('Enter') await expect(page.locator('main, #main-content')).toBeFocused() }) ```
### Arrow key navigation (listbox/menu) ```typescript test('dropdown menu responds to arrow keys', async ({ page }) => { await page.click('[aria-haspopup="listbox"]') await page.keyboard.press('ArrowDown') // first option focused await page.keyboard.press('ArrowDown') // second option await page.keyboard.press('Enter') // select
// Verify selection await expect(page.locator('[aria-selected="true"]')).toContainText('Option 2') }) ```
## ARIA Patterns
### Live regions (dynamic announcements) ```html <!-- For important real-time updates (errors, confirmations) --> <div role="alert">Your payment failed. Please try again.</div>
<!-- For polite updates (search results count) --> <div aria-live="polite" aria-atomic="true"> Showing 42 results for "laptop" </div>
<!-- Screen reader only text (visually hidden) --> <style> .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } </style> ```
### Dialog / Modal ```html <div role="dialog" aria-modal="true" aria-labelledby="dialog-title" aria-describedby="dialog-desc"> <h2 id="dialog-title">Confirm Delete</h2> <p id="dialog-desc">This action cannot be undone.</p> <button>Cancel</button> <button>Delete</button> </div> ```
### Tabs ```html <div role="tablist" aria-label="Account settings"> <button role="tab" aria-selected="true" aria-controls="panel-profile" id="tab-profile">Profile</button> <button role="tab" aria-selected="false" aria-controls="panel-billing" id="tab-billing" tabindex="-1">Billing</button> </div> <div role="tabpanel" id="panel-profile" aria-labelledby="tab-profile">...</div> <div role="tabpanel" id="panel-billing" aria-labelledby="tab-billing" hidden>...</div> ```
### Combobox / Autocomplete ```html <label for="search">Search users</label> <input type="text" id="search" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-controls="search-listbox" aria-activedescendant="opt-2" /> <ul id="search-listbox" role="listbox"> <li role="option" id="opt-1">Alice</li> <li role="option" id="opt-2" aria-selected="true">Bob</li> </ul> ```
## Color Contrast Requirements
| Text Size | Minimum Ratio | Enhanced (AAA) | |-----------|--------------|----------------| | Normal text (< 18pt / < 14pt bold) | 4.5:1 | 7:1 | | Large text (≥ 18pt or ≥ 14pt bold) | 3:1 | 4.5:1 | | UI components / icons | 3:1 | — | | Decorative / disabled | No requirement | — |
Test tools: [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/), Figma A11y Plugin, Chrome DevTools CSS Overview.
## VoiceOver Quick Reference (macOS)
| Action | Shortcut | |--------|----------| | Start / Stop VoiceOver | Cmd + F5 | | Read next item | VO + Right Arrow | | Read page from top | VO + A | | Navigate headings | VO + Cmd + H | | Navigate links | VO + Cmd + L | | Navigate form controls | VO + Cmd + J | | Open Web Rotor | VO + U |
VO = Control + Option
## Common Violations and Fixes
```html <!-- VIOLATION: Missing alt --> <img src="logo.png" /> <!-- FIX --> <img src="logo.png" alt="Acme Corp logo" /> <!-- Decorative: --> <img src="divider.png" alt="" role="presentation" />
<!-- VIOLATION: Icon button with no label --> <button><svg>...</svg></button> <!-- FIX --> <button aria-label="Close dialog"><svg aria-hidden="true">...</svg></button>
<!-- VIOLATION: Placeholder as label --> <input placeholder="Email address" /> <!-- FIX --> <label for="email">Email address</label> <input id="email" type="email" placeholder="you@example.com" />
<!-- VIOLATION: Color-only error --> <input style="border: 2px solid red" /> <!-- FIX --> <input aria-invalid="true" aria-describedby="email-error" /> <span id="email-error" role="alert">Email is required</span> ```
## CI Integration (axe-core in GitHub Actions)
```yaml # .github/workflows/a11y.yml name: Accessibility Tests on: [pull_request]
jobs: a11y: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - uses: actions/setup-node@v4 with: { node-version: '20' } - run: npm ci - run: npx playwright install --with-deps chromium - run: npm run test:a11y - uses: actions/upload-artifact@v4 if: failure() with: name: a11y-report path: playwright-report/ ```
Source provenance
Decision snapshot
530 GitHub stars
Audit
Install and adoption review
Agent-proven evidence
Outcome reports after resolve, review, install, and one narrow run.
No agent outcome data yet. The first agent run can report success, setup needs, risk blocks, failure, or not-relevant through /api/agent/outcome.
Install
Free and open source. Review the report before installing into production agents.
Growth loop
Scenario-led draft for accessibility-testing, ready for a manual X post.
A practical pick for the next repo task: accessibility-testing: axe-core integration, WCAG 2.2 AA checklist, keyboard navigation testing, screen reader testing, and ARIA pattern validation. 530 stars https://www.openagentskill.com/skills/vibeeval-accessibility-testing?ref=x
Listing + install path for accessibility-testing: https://www.openagentskill.com/skills/vibeeval-accessibility-testing?ref=x Install: npx skills add vibeeval/vibecosystem --skill accessibility-testing
Listing source
This listing was indexed from public sources and is not marked official until a maintainer claim is approved.
Attribution links to the public repository or creator profile. Creators can claim the listing to update ownership signals.
Claim this skillOwner claim
This Registry indexed listing is attributed to vibeeval but is not marked official yet. Claim it to add a verified owner signal and make future launch, install, and audit updates easier to trust.
Creator backlink kit
Show the canonical listing, current trust and audit signals, and real Agent-Proven evidence where developers evaluate the repository.
[](https://www.openagentskill.com/skills/vibeeval-accessibility-testing?ref=github&utm_source=github&utm_medium=referral&utm_campaign=creator_badge)
[](https://www.openagentskill.com/skills/vibeeval-accessibility-testing?ref=github&utm_source=github&utm_medium=referral&utm_campaign=creator_badge)
[](https://www.openagentskill.com/skills/vibeeval-accessibility-testing/audit)
[](https://www.openagentskill.com/skills/vibeeval-accessibility-testing?ref=github&utm_source=github&utm_medium=referral&utm_campaign=creator_badge)vibeeval
@vibeeval
Share whether this skill looks useful for your agent workflow. Aggregated feedback improves rankings over time.
Sandbox only
Code Review
Review a branch or diff against repository standards and the originating spec in two independent analysis passes.
168.6K StarsAppsmith
Platform to build admin panels, internal tools, and dashboards. Integrates with 25+ databases and any API.
40.8K StarsImplement
Implement work from an approved spec or ticket set, run focused and full tests, invoke code review, and commit the result to the current branch.
175.7K StarsVercel React Best Practices
React and Next.js performance guidance for writing, reviewing, and refactoring production UI code.
30.9K StarsPermission surface
network or browser access
Agent outcomes
No agent outcome data yet
Docs
Strong README/SKILL.md context
Risk summary
Install readiness