## Steps to reproduce the problem: 1. Go to https://cdpn.io/pen/debug/JjLZayQ#abbr-attr (the September table), 2. Inspect the accessibility properties of any column header, 3. Observe the visible text is exposed as the element's value, not the value of the `abbr` attribute. ## Problem Description: The `abbr` attribute on the `<th>` element is meant to be "an alternative label for the header cell" (https://html.spec.whatwg.org/multipage/tables.html#attr-th-abbr). It should be exposed as part of the Computed Properties for both the header cell and all cells in that column. Instead, the following construct only exposes its contents ("Tu") and does not provide the `abbr` attribute ("Tuesday") in the accessibility tree: ``` <th abbr="Tuesday"> Tu </th> ``` As a developer, to convey the alternate name to screen reader users I am forced to use this construct: ``` <th> <span aria-hidden="true">Tu</span> <span class="visually-hidden">Tuesday</span> </th> ``` With this CSS: ``` .visually-hidden:not(:focus):not(:active) { position: absolute; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); width: 1px; height: 1px; white-space: nowrap; } ``` VoiceOver on macOS steps in to fill the gap by announcing the header cell correctly, but VoiceOver on iOS/iPadOS does not. Fixing this issue in the browser means the lack of parity between VoiceOvers should no longer be an issue, since it would get the value from the common WebKit engine.
<rdar://problem/98400685>