Accessibility issues for input when used as search field

[allen138]

Describe the bug
Screen reader is not properly narrating the suggested results. When the results appear the screen reader should narrate the number of items in the results. For example, if there are 5 suggested items the screen reader should narrate something like "5 results are available". When using the arrow keys to navigate through the suggested items, the screen reader should narrate the content as well as what item in the list it is. For example, second item would narrate something like "list item 2 of 5".

To reproduce
Steps to reproduce the behavior:

1. https://sap.github.io/ui5-webcomponents/playground/components/Input/
2. Scroll to "Input With Suggestions"
3. Type "a" to generate the suggested items
4. The screen reader should narrate the number of items in the results. ex: "5 results are available". Currently there is no narration.
5. When using the arrow keys to navigate through the suggested items, the screen reader should narrate the content and what item in the list it is. ex "list item 2 of 5". Currently only narrates the content in the item.

Isolated example
Please provide an isolated example if possibile, by forking CodeSandbox

Expected behavior
Should have behavior as described above. You may also compare the behavior to sap.m.Input : https://sapui5.hana.ondemand.com/#/entity/sap.m.Input/sample/sap.m.sample.InputAssisted. Expectation is the ui5-input should have the same behavior as sap.m.Input

Context

• UI5 Web Components version: 0.21.8
• OS/Platform: Windows 10
• Browser (if relevant): Chrome

[fifoosid]

Hello @allen138

As much as I can see you have described two issues:

1. While the input is focused, the number of suggestions should be read out.
   When it comes to this one, I can reproduce it, and it will be fixed.

2. While scrolling within the suggestions with the arrow keys, it should read "4 out of 6 suggestions available".
   When it comes to this one, unfortunately I can not reproduce it on my side. I am attaching a screenshot of what is read when testing it with MACOS + Voice Over. If you still experience the issue, please add more in depth information about the software that you are testing with and its version.

[allen138]

Thanks @fifoosid ,
Yes, please help to fix item#1 ,
For Item#2, that's interesting because I tried with both JAWS and NVDA. The NVDA version I am on is 2019.1.1 and the Jaws version is 2019.1912.1 ILM. Both screen readers did not narrate the item selected on https://sap.github.io/ui5-webcomponents/playground/components/Input/ . Although it seems a bit inconsistent because when I try on my project "@xweb/common-webcomponents" it seems to narrate if I am using a standardListItem
So I suppose for now please focus on item#1, and if I can provide more details/replication steps for the second item I can file another ticket down the line.

Thanks,
Allen

[fifoosid]

Hello @allen138

The following PR will fix the first item and close the current issue.

When it comes to the second issue, when you find more details, do not hesitate to open another issue.