Skip to content

Menubar: Clicking menuitems outputs error in console #16201

@pistage

Description

@pistage

Describe the bug

Component generates console errors
When clicking on a menuitem in the menubar component, you can see console error output.

Error message
Blocked aria-hidden on a element because the element that just received focus must not be hidden from assistive technology users. Avoid using aria-hidden on a focused element or its ancestor. Consider using the inert attribute instead, which will also prevent focus.

menubar

Environment

Can be reproduced in the website showcases

Reproducer

https://primeng.org/menubar

Angular version

18

PrimeNG version

17.18.7

Build / Runtime

Angular CLI App

Language

ALL

Node version (for AoT issues node --version)

20.16.0

Browser(s)

Chrome

Steps to reproduce the behavior

  1. Open inspect mode
  2. Make sure you have the console open
  3. Click on any of the menuitems in the Menubar (https://primeng.org/menubar)
  4. You should now see the console error

Expected behavior

No error output

Metadata

Metadata

Assignees

No one assigned

    Labels

    Component: AccessibilityIssue or pull request is related to WCAG or ARIAType: BugIssue contains a bug related to a specific component. Something about the component is not working

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions