Bug 227906 - AX: nested role="presentation" elements break role="tree" behavior
Summary: AX: nested role="presentation" elements break role="tree" behavior
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Accessibility (show other bugs)
Version: Safari 14
Hardware: All macOS 11
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2021-07-13 08:46 PDT by Sufian Rhazi
Modified: 2021-07-13 08:46 PDT (History)
1 user (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Sufian Rhazi 2021-07-13 08:46:28 PDT
When there are 2 or more nested role="presentation" elements as direct children between role="tree" and its owned role="treeitem" elements, the tree role semantics are lost.

There are several issues in this case:
- The role="tree" element is not read by VoiceOver as if it is a "table" (losing the "Entering table" and "Leaving table" announcements)
- When navigating via VO-left and VO-right, the role="tree" element is not a distinct element; navigation switches between the individual role="treeitem" items. As such, you cannot user VO-shift-down / VO-shift-up to go into/out from the inner tree navigation, and cannot use VO-down / VO-up to navigate the leaves
- The role="treeitem" elements do not retain the treeitem semantics, so the aria-checked="true" or aria-checked="false" states are not announced

A case showing the differences can be found at this codepen URL: https://codepen.io/sufianrhazi/pen/zYwoaNb -- trees with nesting 3 and 2 have navigational differences and do not announce "checked" / "unchecked", the trees with nesting 1 and 0 behave as expected.

Note: this reproduction case is simplified to use only one level of role="treeitem" elements, with no role="group" grouping.

Reproduced on Safari Version 14.1.1 (16611.2.7.1.4) with MacOS 11.4.

In other browsers on MacOS:

Chrome Version 91.0.4472.114 on MacOS 11.4 behaves as expected:
* Retains the tree semantics of the role="tree" element
* The "Entering table" / "Leaving table" announcement is made
* Tree is treated as a single VO-left/VO-right item
* Tree can be entered/exited via VO-shift-down/VO-shift-up
* When entered can be navigated via VO-down/VO-up, and the aria-checked="true"/aria-checked="false" states on role="treeitem" elements are announced and disabled states are announced
* When navigated via up/down arrow keys, the aria-checked states on role="treeitem" elements are announced

Firefox Version 90.0 on MacOS 11.4 behaves mostly as expected, except for aria-checked announcement:
* Retains the tree semantics of the role="tree" element
* The "Entering table" / "Leaving table" announcement is made
* Tree is treated as a single VO-left/VO-right item
* Tree can be entered/exited via VO-shift-down/VO-shift-up
* When entered can be navigated via VO-down/VO-up, and the aria-checked="true"/aria-checked="false" states on role="treeitem" elements are NOT announced but disabled states are announced
* When navigated via up/down arrow keys, the aria-checked states on role="treeitem" elements are NOT announced
Comment 1 Radar WebKit Bug Importer 2021-07-13 08:46:38 PDT
<rdar://problem/80520596>