search

appbaseio / reactivesearch

Search UI components for React and Vue
https://opensource.appbase.io/reactivesearch
Apache License 2.0
4.9k stars 466 forks source link

Navigation item in SingleDropdownList - not a11y useable with keyboard #1958

Open simkea opened 2 years ago

simkea commented 2 years ago

Library Version: 3.30.2

Describe the bug The SingleDropdownList element cannot be operated by keyboard, if there are several selection elements here, it is not possible to make a selection with arrow up or down in the list. We have a blind colleague and it would be nice if the accessibility is improved here.

The same problem exists with the DataSearch component.

Maybe there is also a setting that I have not found in the documentation? thx br

mohdashraf010897 commented 2 years ago

@simkea I am not able to reproduce the issue on my end.

I have been successful in operating the SingleDropdownList component through keyboard keys, selecting values, and changing them.

Check the demo here - https://docs.appbase.io/docs/reactivesearch/v3/list/singledropdownlist/#demo

dev-code-davis commented 2 years ago

@simkea I am not able to reproduce the issue on my end.

I have been successful in operating the SingleDropdownList component through keyboard keys, selecting values, and changing them.

Check the demo here - https://docs.appbase.io/docs/reactivesearch/v3/list/singledropdownlist/#demo

I'm not able to tab + enter / up & down navigate the select list - https://codesandbox.io/s/github/appbaseio/reactivesearch/tree/next/packages/web/examples/SingleDropdownList?from-embed Nor most of the Reactivesearch components. P.S. The same issue persists with daterange. Not sure how one could select the date within the calendar widget.

Chromium + Firefox tested.