Skip to content

Commit 73d2a01

Browse files
committed
docs: retract computedRole as visibility check
computedRole returns the element's role regardless of aria-hidden state — it's not a visibility check. Verified: `<div aria-hidden="true">` (h3) still returns `computedRole === 'generic'` even though it's removed from the AX tree. aria-hidden controls *exposure*, not *role*. Restored DevTools Accessibility panel as the browser-authoritative check and added a one-line note explaining why computedRole isn't usable for this question. The spec-encoded JS walker remains the scriptable fallback. Earlier commit (f2ecc0d) introduced the wrong claim — this corrects it.
1 parent f2ecc0d commit 73d2a01

1 file changed

Lines changed: 8 additions & 15 deletions

File tree

docs/glimmer-attribute-behavior.md

Lines changed: 8 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -85,21 +85,14 @@ ARIA attributes are string-valued, but Glimmer's bare-mustache form applies the
8585
8686
#### Verifying the "visible" verdict empirically
8787

88-
The "At runtime (ARIA)" column above is derived from the spec. The cleanest empirical confirmation is `Element.computedRole` (WAI-ARIA Reflection — Chrome 135+, Safari 18.4+, Firefox under flag):
89-
90-
```js
91-
// In Chrome's console, after rendering the section-B fragment:
92-
document.querySelector('#h5').computedRole;
93-
// → "generic" (verified empirically — element IS in the AX tree, so visible)
94-
//
95-
// For comparison, h3 (`aria-hidden="true"`) returns null:
96-
document.querySelector('#h3').computedRole;
97-
// → null (element omitted from AX tree, so hidden)
98-
```
99-
100-
`null` means the element isn't exposed to assistive tech (hidden); a string role means it is exposed (visible). This is the browser's actual computed verdict — no spec-derivation needed.
101-
102-
If `computedRole` isn't available in your browser, the **DevTools Accessibility panel** is the equivalent manual path: select each element, check whether it's "Exposed" with a role or "Ignored" due to `aria-hidden=true`.
88+
The "At runtime (ARIA)" column above is derived from the spec. There is no clean cross-browser JS API to read AX-tree exposure directly — `Element.computedRole` returns the element's _role_ regardless of aria-hidden, so it is **not** a visibility check (verified: `document.querySelector('#h3').computedRole === 'generic'` even though h3 is `aria-hidden="true"` and not exposed). The cleanest browser-authoritative check is the **DevTools Accessibility panel**:
89+
90+
1. Render the section-B fragment from the reproduction template (each `h*` element gets a stable id).
91+
2. Open DevTools → Accessibility tab (Chrome: Elements panel sidebar; Firefox: separate "Accessibility" tab).
92+
3. Select each `h*` element. The panel shows whether it's exposed to AT:
93+
- **Exposed** with a computed role → element is in the accessibility tree → "visible".
94+
- **"Ignored"** with reason "aria-hidden=true" → element removed from AT tree → "hidden".
95+
4. Confirm h1, h2, h5, h11 are exposed (matching spec), and h3, h7, h12, h14 are ignored due to aria-hidden.
10396

10497
A scriptable fallback that works everywhere — encodes the spec's aria-hidden rule directly:
10598

0 commit comments

Comments
 (0)