Bug 285048 – links skipped in VoiceOver reading order when supplying name to adjacent control via aria-labelledby

• Status: NEW
• Component: Accessibility

[Curtis Wilcox]

Created attachment 473617 [details]
Reduced case testing links and adjacent buttons named by them

Using VoiceOver on iOS 18.2 with Safari, when a link is followed by a button (or other control) and the button's name comes from the link using `aria-labelledby`, the link is not included in the reading order when a "Speak screen" gesture is used or when swipe right (or left) is used to navigate element-by-element. The button is in the reading order and does have the correct name.

The missing link is announced when tapped (explore-by-touch) or when the Web Rotor is set to Links.

In addition to `<button>` elements, I reproduced the problem with `<summary>` and with `<a role=button href…>` elements also when the id is on a `<span>` within the link instead of on the link itself.

The problem does not occur if:
* the link and button names are the same but the button's name is from aria-label.
* the button's aria-labelledby references more than one id.
* if there is content (not just whitespace) between the link and button.
* the button is before the link in the reading order. 

Others reproduced the problem using iOS 18.1.1 and iPadOS 18.2. The problem was not reproduced using iOS 15.8.3, iOS 17.5.1, or iPadOS 17.5.1.


Reduced case attached and at this URL: https://codepen.io/ccwilcox/pen/OPLpKvZ/2d78de06d70c393062a1f992a605ce4e

Workarounds tested attached and at this URL: https://codepen.io/ccwilcox/pen/dPbWOVe/5efd988fa96098431eb2b4e8432f51cd

[Radar WebKit Bug Importer]

<rdar://problem/141846522>

[Curtis Wilcox]

Created attachment 473618 [details]
Reduced case testing workarounds for links and adjacent buttons named by them