P-dropdown: tab key does not focus on next item

[ivanatikvic1994]

Describe the bug

When using p-dropdown in form I am not able to use tab key to navigate, once the focus is on dropdown, tab key is not doing anything and the focus remains on dropdown. Issue can be tested in official documentation too. Using tab does not focus away from dropdown, it remains kind of stuck. This is also an accessibility issue. Please let me know if there is something I missed out, was looking a lot to solve the problem, it is current blocker from accessibility point of view. Thank you.

Environment

{{ Timezone }}

Reproducer

No response

Angular version

16.2.6

PrimeNG version

16.3.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.16.0

Browser(s)

Chrome

Steps to reproduce the behavior

https://primeng.org/dropdown
use tab to navigate.

Expected behavior

expected to move focus to next element

[SimonJ-DR]

Tab is meant to traverse elements. Elements themselves use different keys.
For a dropdown, use space to open and arrow keys to traverse the elements.

https://primeng.org/dropdown#accessibility for more details

[bmayen]

#13944 related. While I can tab to a dropdown then use space to access it, I cannot tab away from it. Keyboard focus gets trapped once it hits a dropdown

[w3soto]

Quick fix

import { Dropdown } from 'primeng/dropdown';

const origOnKeydown = Dropdown.prototype.onKeydown;
Dropdown.prototype.onKeydown = function (event: KeyboardEvent, search: boolean) {
  if (event.which == 9) {
    this.hide();
    return;
  }
  origOnKeydown.apply(this, [event, search]);
};

[github-actions]

This issue has been automatically marked as stale due to a lack of activity. If this issue is still relevant to you, please leave a comment so we can keep it open. We apologize for not being able to prioritize it sooner. If you have any new information or questions, please share them in your comment!

[mertsincan]

Hi,

So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation and try the latest PrimeNG version(v19). If there is no improvement on this, can you open a new issue so we can include it in our roadmap?

Thanks a lot for your understanding!
Best Regards,