Form Tester

title: "Form Tester — Testing Accessible Forms for WCAG Compliance" description: "Learn how to test form accessibility using automated tools, screen readers, and keyboard-only testing to verify WCAG 2.2 AA compliance." weight: 14 date: 2026-06-28 lastmod: 2026-06-28 tags: [accessibility, forms]

Testing accessible forms requires a combination of automated checks, manual keyboard testing, and screen reader verification.

## What You'll Learn

How to test form accessibility using axe DevTools, WAVE, keyboard-only testing, and screen reader verification.

## Why It Matters

Automated tools catch about 30% of accessibility issues. Manual testing is essential for finding interaction-level problems like focus management and error announcement timing.

## Real-World Use

A QA tester uses axe DevTools to check for missing labels, then manual-tests the form with keyboard (Tab, Enter, Space, arrow keys), then verifies with NVDA that error messages are announced correctly.

## Automated Testing

```javascript
// Using axe-core programmatically
const results = await axe.run(document.getElementById('my-form'));
const violations = results.violations.filter(v =>
  v.id === 'label' ||
  v.id === 'aria-required-children' ||
  v.id === 'aria-valid-attr-value'
);

Manual Test Checklist

Screen Reader Testing Steps

// NVDA-specific commands for testing
// Insert + F7: Element list (navigate by form fields)
// Tab: Move to next field
// Insert + Tab: Read current field info
// Ctrl: Stop speech

Automated CI Testing

npm install -g axe-core
npx axe http://localhost:8080/form --include form

Common Mistakes

1. Only testing with automated tools

Automated tools miss focus management, timing, and screen reader announcement issues.

2. Not testing with a real screen reader

Emulators miss real-world behavior. Test with NVDA (Windows), VoiceOver (Mac), or JAWS.

3. Forgetting mobile testing

Mobile screen readers (VoiceOver iOS, TalkBack Android) have different behaviors.

4. Testing only happy path

Always test error states, empty states, and boundary conditions.

5. Not testing with actual users

Automated and manual testing by developers catches many issues, but usability testing with people with disabilities is invaluable.

Practice Questions

1. What percentage of accessibility issues do automated tools catch? Approximately 30%. The remaining 70% require manual testing.

2. What keyboard keys test a radio group? Tab to enter the group, arrow keys to navigate, Tab to exit.

3. What does role=alert do in testing? It causes the screen reader to immediately announce the content of the element when it changes.

Challenge: Run a full accessibility audit on a form you built. Use axe DevTools, keyboard-only testing, and a screen reader. Document at least three issues found.

FAQ

Mini Project

Create a test suite for a registration form. Write automated tests (axe-core), manual keyboard test steps, and screen reader test scenarios. Document all findings with severity levels.

What's Next

Apply everything you learned in the Forms Project by building a complete accessible form from scratch.