APG · Table with sortable columns
Sortable data table
A caption for the name, scope so cells are read with their
headers, aria-sort on exactly one column, and an
announcement — because re-sorting silently rewrites everything below the
user's reading position.
| Fix focus restoration on unmount | rin | 3 | 14 Aug |
|---|---|---|---|
| Add inert polyfill fallback | ada | 12 | 2 Jul |
| Combobox: debounce announcements | rin | 2 | 1 Sep |
| Roving tabindex for vertical tabs | kwan | 7 | 19 Jun |
| Docs: VoiceOver test script | ada | 30 Aug | |
| Toast timers pause on hover | kwan | 4 | 8 May |
What to check. Sort by Files, then reverse it. The row
with no file count stays at the bottom both times — reversing a sort
should not fill the top of the table with blanks. With VoiceOver, move
across a row and listen: each cell is read with its column header, and
the row header identifies the row.
| Tab | Move to the next column header button. |
|---|---|
| Enter or Space | Sort by that column. Activating the sorted column again reverses the direction. |
Notes
The sort control is a <button> inside the
<th>, not a click handler on the th
itself. The header keeps its table semantics; the button provides an
operable control with a real accessible name and a real focus ring.
The arrow is
aria-hidden. aria-sort already carries the
state, and announcing "Title ▼" after it just describes a glyph the
user cannot see.