bug(aria/listbox): Disabled options are still reachable via keyboard navigation

[chintankavathia]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When using the @angular/aria Listbox and Option directives, options marked as disabled ([disabled]="true") are visually indicated as disabled (aria-disabled is set true) but remain reachable via keyboard tab/arrow navigation. I expect disabled options to be skipped entirely during keyboard navigation.

Reproduction

StackBlitz link: https://stackblitz.com/edit/fnywtytq?file=src%2Fmain.ts,src%2Fstyles.css,src%2Findex.html
Steps to reproduce:

1. set disabled to true on any ngOption
2. use keyboard to move interactions
3. observe disabled item is also reachable

Expected Behavior

Disabled Option elements inside a Listbox should not be focusable or reachable via keyboard navigation (arrow keys, Tab, etc.)

Actual Behavior

• aria-disabled="true" is correctly applied to the disabled option's DOM element.
• The option is still focusable and can be reached via keyboard arrow navigation.
• The user can land focus on a disabled option, which is confusing and inconsistent with the disabled state.

Environment

• Angular: 22
• CDK/Material: 22
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): macOS

[crisbeto]

I believe this is intentional, otherwise users wouldn't know that the options are there.

[wagnermaciel]

Yes, this is intentional. By default items are "soft disabled" for the reason @crisbeto mentioned. That said, there are still times where it really does make sense to skip disabled items, so you can still set [softDisabled]="false" on the ngListbox.

https://stackblitz.com/edit/fnywtytq-brm8ebmt?file=src%2Fmain.ts,src%2Fstyles.css,src%2Findex.html