Repository navigation
[tree view] Use aria-selected instead of aria-checked when checkboxSelection is disabled - #23679
Merged
michelengelen merged 2 commits intoSep 25, 2026
Conversation
…e `aria-checked`
michelengelen
added
accessibility
Deploy previewBundle size
Check out the code infra dashboard for more information about this PR. |
LukasTy
reviewed
Sep 23, 2026
LukasTy
left a comment
LukasTy
left a comment
Member
There was a problem hiding this comment.
Claude Opus findings
The fix direction is correct, but the new aria-selected branch has one bug: it reads the derived selection status, not the selection model.
aria-selecteddoes not follow the selection model (packages/x-tree-view/src/internals/plugins/selection/itemPlugin.ts:39). The branch without checkboxes usesselectionStatus === 'selected'. WithselectionPropagation.parents, that status is'selected'for a parent when all its selectable children are selected, also when the parent is not inselectedItems. The highlight (data-selected) uses the model. I checked two cases in jsdom:multiSelect,selectionPropagation={{ parents: true }},defaultSelectedItems={['1.1', '1.2']}: item1hasaria-selected="true"and no highlight. Press Space on1two times: the highlight turns on and off, butaria-selectedstays"true".- Single select,
selectionPropagation={{ parents: true }},defaultSelectedItems="1.1"(the only child of1):1and1.1both havearia-selected="true", and the tree hasaria-multiselectable="false". - Fix: use
selectionSelectors.isItemSelectedin this branch, like thearia-selectedcode before #19851 (status.selected). With this change, both cases match the highlight, and allx-tree-viewandx-tree-view-prounit tests pass. Please add a test for these cases. Base has the same problem witharia-checked, but this PR defines the newaria-selectedbehavior.
- Duplicated decision chain (
itemPlugin.ts:35-76). The new branch repeats the checkbox chain. Keep one chain and change only the output:isCheckboxSelectionEnabled ? { 'aria-checked': value, 'aria-selected': undefined } : { 'aria-checked': undefined, 'aria-selected': value === 'mixed' ? false : value }. Then the not-selectable rules from #23012 stay in one place. With the fix above, the "selected" step readsisItemSelectedwhen checkboxes are off. - PR title. The title becomes the changelog line. The 8.17.0 line was "Use
aria-checkedinstead ofaria-selectedon items" (#19851), and a user reported there that it broke their Playwright locators ({ selected: true }to{ checked: true }). Suggestion: "[tree view] Usearia-selectedinstead ofaria-checkedwhencheckboxSelectionis disabled".
michelengelen
changed the title
aria-checked when checkboxSelection is enabledaria-selected instead of aria-checked when checkboxSelection is disabled
LukasTy
changed the title
aria-selected instead of aria-checked when checkboxSelection is disabledaria-selected instead of aria-checked when checkboxSelection is disabled
unhappychoice
added a commit
to unhappychoice/mdts
that referenced
this pull request
Oct 18, 2026
MUI X 9.15 conveys tree item selection via aria-selected instead of aria-checked when checkboxSelection is disabled (mui/mui-x#23679). Update the affected LeftPane snapshots accordingly. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
SimpleTreeViewandRichTreeViewsetaria-checkedon every selectable item regardless of whethercheckboxSelectionwas enabled, and never setaria-selected. Per the ARIA APG treeview pattern,aria-checkedbelongs to the checkbox variant of the widget; a plain selection tree should convey the selected item througharia-selectedinstead. As a result, a single-select navigation tree with no checkboxes announced every unselected row as "not checked", describing an interaction the widget didn't actually offer.itemPlugin.ts's root props enhancer now branches onisCheckboxSelectionEnabled: when checkboxes are enabled, behavior is unchanged (aria-checkedwithtrue/false/"mixed"); when they are not, the item emitsaria-selected(true/false, or omitted for disabled/non-selectable items) instead.aria-selectedhas no tri-state value, so a parent with only some descendants selected (the previous"mixed"case) is now reported as not selected, since that partial state only has meaning in the checkbox variant.The
isItemSelected/getSelectedTreeItemstest helpers indescribeTreeView.tsxreadaria-checkeddirectly and are used at 70+ call sites across the suite, so they were updated to check both attributes. The dedicatedaria-checkedtest block was split into "without checkboxSelection" (assertingaria-selected) and "with checkboxSelection" (assertingaria-checked, unchanged), and a couple of standalone assertions elsewhere that exercised the no-checkbox case were updated to match.Fixes #23667