kumaran-is Iron Law: Fix only the violation — never refactor unrelated code during an accessibility audit, and prefer native HTML/widget semantics over ARIA role workarounds.
Fixing Accessibility
Audits and fixes WCAG 2.1 AA accessibility violations in Angular and Flutter. Produces targeted, minimal fixes — no collateral changes.
When to Use
- After writing any UI screen with interactive elements
- Before opening a PR that touches components
- When a screen reader test reveals issues
- As a pre-submission gate for App Store / Play Store
Platform Detection
| File type | Audit approach |
|---|---|
*.dart |
Flutter — Semantics widgets, touch targets (48dp), focus traversal |
*.html, *.ts, *.scss |
Angular — ARIA, keyboard nav, touch targets (44px), aria-live |
| No argument | Session mode — apply constraints to all subsequent UI work |
Priority Reference
| Priority | Category | WCAG Level |
|---|---|---|
| 1 | Accessible names (button, icon, input) | AA |
| 2 | Keyboard access — all interactive elements reachable | AA |
| 3 | Focus management — dialogs trap focus, restore on close | AA |
| 4 | Semantics — correct roles and structure | AA |
| 5 | Form errors — aria-invalid + aria-describedby |
AA |
| 6 | Announcements — aria-live for dynamic content |
AA |
| 7 | Contrast — 4.5:1 normal text, 3:1 large text | AA |
Fix Discipline
- Fix only the violation — do not refactor unrelated code
- Prefer native HTML elements over ARIA role workarounds
- Do not add ARIA when native semantics already solve the problem
Output Format
## Accessibility Audit: [file or scope]
### Violations
| Priority | Rule | Line | Snippet | Fix |
|----------|------|------|---------|-----|
| CRITICAL | Accessible name missing | :42 | `<button><svg>...</svg></button>` | Add `aria-label="Close"` |
### Summary
- Critical: N | High: N | Medium: N | Low: N
- Status: PASS / FAIL