Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixing accessibility issue of dropdown #7175

Conversation

ImmortalRabbit
Copy link
Contributor

@ImmortalRabbit ImmortalRabbit commented Sep 13, 2024

Defect Fixes

Fixes: #6030

PR fixes accessibility issue of dropdown: Accessibility users were able to navigate through dropdown but screen reader won't read labels of dropdown options making component unusable.

It was happening because dropdown options were not focusable, and focused element were not actually attempting to focus on targeted element. So, by focusing them using manually upon triggering onFocus element function fixed the problem.

Additionally, introduced additional accessibility attributes that would improve explanation of dropdown options
aria-setsize, aria-posinset. Inspiration came from primeng/dropdown component.

Copy link

vercel bot commented Sep 13, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

2 Skipped Deployments
Name Status Preview Comments Updated (UTC)
primereact ⬜️ Ignored (Inspect) Visit Preview Sep 13, 2024 0:21am
primereact-v9 ⬜️ Ignored (Inspect) Visit Preview Sep 13, 2024 0:21am

Copy link

Thanks a lot for your contribution! But, PR does not seem to be linked to any issues. Please manually link to an issue or mention it in the description using #<issue_id>.

@melloware
Copy link
Member

@ImmortalRabbit can you run npm run format it will fix the formatting.

@melloware melloware self-requested a review September 13, 2024 12:14
@melloware melloware added the Component: Accessibility Issue or pull request is related to WCAG or ARIA label Sep 13, 2024
@ImmortalRabbit
Copy link
Contributor Author

@ImmortalRabbit can you run npm run format it will fix the formatting.

Done!

@melloware melloware merged commit d46470f into primefaces:master Sep 13, 2024
5 checks passed
@melloware
Copy link
Member

@ImmortalRabbit i just cc'ed you on another ticket. Its NDVA dropdown related.

@ImmortalRabbit
Copy link
Contributor Author

@ImmortalRabbit i just cc'ed you on another ticket. Its NDVA dropdown related.

When I could expect to see the new version to be released?

@melloware
Copy link
Member

That is up to PrimeTek they control the releases.

@donSan4o
Copy link

fix with focusOnItem function broke this https://primereact.org/dropdown/#filter keyboard control - Lost focus on search input

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Component: Accessibility Issue or pull request is related to WCAG or ARIA
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Dropdown: screen reader reads "edit" for read only dropdown
3 participants