p-dropdown keyboard navigation

vikore commented 3 months ago

Describe the bug

Keyboard navigation issue - Drop down value is not getting selected while navigating the item list through keyboard up/down arrow keys in the latest release version - 17 - https://primeng.org/dropdown#accessibility. It was working in previous release version - 15 - https://www.primefaces.org/primeng-v15-lts/dropdown#accessibility.

Environment

Development

Reproducer

No response

Angular version

17.3.6

PrimeNG version

17.16.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.16.1

Browser(s)

No response

Steps to reproduce the behavior

Navigate to p-dropdown using keyboard tab key
Press space key or enter key to open dropdown
Then press up/down arrow keys
Observe the drop down value. It is not getting selected with arrow key navigation. User has to press enter key to select the highlighted value.

Expected behavior

Drop down value should get selected while navigating with up/down arrow keys as in previous version - 15 along with enter key and spacebar key.

vikore commented 2 months ago

Hi Team,

Please let us know if any updates regarding the issue.

Also keyboard tab key event is adding additional focus to the item list of the drop down. In previous version it was navigating to next action element.

p-dropdown

Thanks

richard-collette-precisely commented 1 month ago

It is apparent on the docmentation screen https://www.primefaces.org/primeng-v14-lts/dropdown

That tabbing between inputs is broken.

Additionally, when tabbing into a drop down, if the dropdown is editable, keyboard input is not enabled until the field is clicked on.

primefaces / primeng