fw-12 step 01 — mini-testing-library

Tasks

  1. Visible-text query.
  2. Label association — all the mechanisms: <label for>, wrapping label, aria-label, aria-labelledby.
  3. Role computation for a subset of elements.
  4. Accessible-name computation implementing the precedence order: aria-labelledbyaria-label → native labelling → name-from-content (role permitting) → title. Include whitespace normalisation.
  5. Assertion helpers.

Failure lab: find four ways to build a button your role query cannot find. Each is a real accessibility bug. Then find a case where your query succeeds and a real screen reader would still fail the user — and say what that implies about testing-library queries as an accessibility strategy.

Done when

  • Precedence order implemented and demonstrated, including aria-labelledby beating visible text
  • Four undiscoverable buttons found
  • The limits of the approach written down honestly