[Input]: keyboard navigation issue for input suggestion in JAWS

pankajpandey01 commented 3 months ago

Describe the bug

[Input]: keyboard navigation issue for input suggestion in JAWS -Can not navigate to all item in input suggestions with keyboard in JAWS. Focus is stuck on one item after navigating few items and JAWS is announcing background element.

Isolated Example

No response

Reproduction steps

Open JAWS 2024
Go to https://sap.github.io/ui5-webcomponents-react/?path=/docs/inputs-input--docs
Go to "Input with customizable SuggestionItem" section
enter "a" in input box
Start navigating to suggestion items with keyboard

Observed that focus is stuck on 7th item and JAWS started announcing background element.

Expected Behaviour

All items should be navigable through keyboard in JAWS. Focus should not be lost.

Screenshots or Videos

No response

UI5 Web Components for React Version

1.29.3

UI5 Web Components Version

1.24.0

Browser

Chrome, Edge

Operating System

Windows 11

Additional Context

No response

Relevant log output

No response

Organization

SuccessFactors

Declaration

[X] I’m not disclosing any internal or sensitive information.

Lukas742 commented 3 months ago

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

nikoletavnv commented 3 months ago

Dear @SAP/ui5-webcomponents-topic-rl ,

I could reproduce this issue when JAWS is running. Follow the steps reported by @pankajpandey01. When navigating through the suggestion items with the arrow keys, the navigation gets stuck at "Iceland" and item "Moldova" is never reached. If JAWS is not running, the issue is not reproduced when navigating with the arrow keys.

I also tested on 1.124 and the 2.0.0-rc.6 and normal suggestions (not custom). The issue there is even more severe, as the navigation through items gets stuck at the first suggestion item. Again it is only reproduceable when JAWS is running and reading the items.

For reference - the problem does not exist in combo-box.

Kind regards, Nikoleta Terzieva

nikoletavnv commented 3 months ago

I could not reproduce the issue with NVDA reader on Windows.

elenastoyanovaa commented 2 weeks ago

There are several issues to be fixed herehere:

The role of the list should be changed to listbox and the listitem roles to option. This is to be done in both 2.0 and 1.24. For 2.0 we should like in: https://github.com/SAP/ui5-webcomponents/pull/9611 .For 1.24 accessible-role attribute for the list and listitem should be set
Unfortunately the above adjustment does not solve the issue, because the most severe problem is that the list item receives a tabindex="0" which really confuses JAWS and it switches modes until getting stuck. The tabindex="0" should not be set. I tried setting the forced-tab-index but this did not worked so I started overwriting effectiveTabIndex of the ListItemBase in all our types of suggestion items and it seems that this might work, but it was a lot of effort and I did not have the capacity to finish it. Removing the tabindex will resolve the issue for both versions. Should be applied to all items - groups, suggestions.

Kind Regards, Elena

SAP / ui5-webcomponents