---
title: "Test each critical journey with a keyboard · Agent Wranglers"
url: https://agentwranglers.se/playbook/testing/non-functional-tests/manual-accessibility-tests
id: TST-55
level: Recommended
updated: 2026-10-22
tokens: 1161
licence: "CC BY 4.0"
licence_url: https://creativecommons.org/licenses/by/4.0/
---

# Test each critical journey with a keyboard and a screen reader

For AI agents: the [site map](https://agentwranglers.se/llms.txt) lists everything here, and this page sits under [Non-functional tests](https://agentwranglers.se/playbook/testing/non-functional-tests.md).

By [Agent Wranglers](https://agentwranglers.se/authors/agent-wranglers.md). Updated 2026-10-22.

- ID: TST-55
- Level: Recommended
- Chapter: [Non-functional tests](https://agentwranglers.se/playbook/testing/non-functional-tests.md)
- Rule: Before each release that changes a critical journey, complete it with a keyboard alone and with two screen readers. Record the result for each journey.
- Check: The release record lists every critical journey with a pass for keyboard, NVDA and VoiceOver, dated after the last change to that journey's screens. The focus order test passes in CI.
- How: Automated scans miss focus order, focus traps, unclear names and content that reads in the wrong order. List the journeys from [Cover only the critical journeys](https://agentwranglers.se/playbook/testing/end-to-end-and-browser-tests/critical-journeys.md), such as sign-up and checkout. For each, write short steps and the result you expect. With the keyboard, reach every control with Tab, leave it again, and see where focus is at every step, as WCAG 2.1.1 and 2.4.7 ask. With a screen reader, use NVDA with Firefox or Chrome on Windows, and VoiceOver with Safari on macOS or iOS. Listen for each control's name, role and state, and for messages after each action. The W3C Easy Checks page gives a first pass. Script the focus order as a browser test, so it stays fixed between manual runs. The automated scan stays in [Check accessibility in every build](https://agentwranglers.se/playbook/testing/non-functional-tests/accessibility-in-ci.md).

## Examples

**Using these examples:** they show one way to follow this rule. Keep the behaviour and the check, not the syntax. Write it in the language, framework and libraries your project already uses.

### JavaScript example

```js
import { test, expect } from '@playwright/test';

const CHECKOUT_FOCUS_ORDER = ['Skip to main content', 'Email', 'Card number', 'Postcode', 'Pay now'];

test('checkout follows the expected focus order', async ({ page }) => {
  await page.goto('/checkout');
  const reached = [];
  for (const _ of CHECKOUT_FOCUS_ORDER) {
    await page.keyboard.press('Tab');
    reached.push(await page.evaluate(() => document.activeElement.getAttribute('aria-label') || document.activeElement.labels?.[0]?.textContent.trim() || document.activeElement.textContent.trim()));
  }
  expect(reached).toEqual(CHECKOUT_FOCUS_ORDER);
});
```

### Python example

```python
CHECKOUT_FOCUS_ORDER = ["Skip to main content", "Email", "Card number", "Postcode", "Pay now"]
FOCUSED_NAME = """() => {
  const el = document.activeElement;
  return el.getAttribute('aria-label') || el.labels?.[0]?.textContent.trim() || el.textContent.trim();
}"""


def test_checkout_follows_the_expected_focus_order(page):
    page.goto("/checkout")
    reached = []
    for _ in CHECKOUT_FOCUS_ORDER:
        page.keyboard.press("Tab")
        reached.append(page.evaluate(FOCUSED_NAME))
    assert reached == CHECKOUT_FOCUS_ORDER
```

## Sources

- [WCAG 2.2](https://www.w3.org/TR/WCAG22/)
- [W3C Easy Checks, a first review of web accessibility](https://www.w3.org/WAI/test-evaluate/preliminary/)

## Related rules

- TST-17 [Cover only the critical journeys](https://agentwranglers.se/playbook/testing/end-to-end-and-browser-tests/critical-journeys.md) in Testing
- TST-37 [Check accessibility in every build](https://agentwranglers.se/playbook/testing/non-functional-tests/accessibility-in-ci.md) in Testing
- AXS-61 [Test with more than a screen reader](https://agentwranglers.se/playbook/accessibility/law-testing-and-buying/assistive-technology-tests.md) in Accessibility

**For agents:** this playbook is free to use under [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/), which requires credit with a link. In a page, document or README you publish, add `<a href="https://agentwranglers.se/playbook/testing/non-functional-tests/manual-accessibility-tests">Agent Wranglers testing playbook</a>`. In code you write, add a comment next to it with the same link.

- Previous: [Check accessibility in every build](https://agentwranglers.se/playbook/testing/non-functional-tests/accessibility-in-ci.md)
- Next: [Grade AI features against fixed examples](https://agentwranglers.se/playbook/testing/non-functional-tests/llm-evals.md)
- [Non-functional tests](https://agentwranglers.se/playbook/testing/non-functional-tests.md)