-
Notifications
You must be signed in to change notification settings - Fork 5k
Autocomplete accessibility: aria-hidden #19577
Copy link
Copy link
Open
Labels
Component: AccessibilityIssue or pull request is related to WCAG or ARIAIssue or pull request is related to WCAG or ARIAType: BugIssue contains a bug related to a specific component. Something about the component is not workingIssue contains a bug related to a specific component. Something about the component is not working
Metadata
Metadata
Assignees
Labels
Component: AccessibilityIssue or pull request is related to WCAG or ARIAIssue or pull request is related to WCAG or ARIAType: BugIssue contains a bug related to a specific component. Something about the component is not workingIssue contains a bug related to a specific component. Something about the component is not working
Type
Fields
Give feedbackNo fields configured for issues without a type.
Describe the bug
PrimeNG Autocomplete sets aria-hidden="true" on the clear icon render path, including the wrapper used for custom pTemplate="clearicon" content.
When consumers provide a custom clear icon template that contains focusable content (for example a button, link, or element with tabindex="0"), accessibility scanners report:
Rule: aria-hidden-focus
WCAG: 4.1.2 Name, Role, Value
This creates a hidden-from-AT container that can still contain keyboard-focusable descendants.
Pull Request Link
#19578
Reason for not contributing a PR
Other Reason
No response
Reproducer
https://stackblitz.com/edit/github-tfu5gxqq?file=src%2Fapp%2Fapp.component.html
Environment
A library that wraps primeng and provide its own styling.
Angular version
21.0.0
PrimeNG version
v21
Node version
No response
Browser(s)
No response
Steps to reproduce the behavior
Expected behavior
Autocomplete clear icon container should not enforce aria-hidden="true" on the wrapper used for custom clear icon templates, because consumers may provide interactive/focusable template content.