Skip to content

a11y(Table): a sortable column header never exposes its sort state #479

Description

@IgorShevchik

Found while working #454. Sorting a B24Table column changes what a sighted user sees — the header's icon flips — and tells a screen reader nothing at all.

What is missing

aria-sort appears zero times in src/runtime/components/Table.vue. The <th> elements at :610 and :693 carry no sort state, so a screen reader announcing a sortable column says only its name, both before and after the user activates it. There is no way to hear whether a table is sorted, by which column, or in which direction.

WAI-ARIA defines aria-sort on the header cell for exactly this: ascending, descending, none, or other.

How it surfaced

While adding sort coverage for #454 I measured aria-sort in the snapshots to check the sorted branch had been reached. Zero — and the branch had been reached; the icon differs between all three states now. The metric was wrong because the attribute does not exist. Worth stating plainly: this was found by an assertion of mine being wrong, not by looking for it.

Not a porting loss

Upstream's Table.vue does not emit aria-sort either — also zero occurrences. So this is inherited, and fixing it is a deliberate divergence rather than a port. Recording that here because .sync/PORTING.md §7 asks for the distinction: a later port of upstream's table must not quietly take it back out.

The fix

On the <th> of a sortable column, derived from what the header already reads:

column.getIsSorted()      // 'asc' | 'desc' | false
   aria-sort="ascending" | "descending" | "none"

none matters as much as the other two: the attribute must be present on every sortable header, or a screen reader cannot tell "sortable and unsorted" from "not sortable". Headers that are not sortable should carry no aria-sort at all.

Acceptance

Priority: P2 — a keyboard and screen-reader user cannot perceive a state change the interface makes.

Related: #476, #473 — the same theme of a control whose state is visible but not announced.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions