Accessibility issue on cv-header-panel

[isaquebenatti]

Detailed description

Describe in detail the issue you're having. I’m having accessibility issues using Header with right panel component. When I run the IBM’s Accessibility checker scan in my project I’m getting the error: Element “a” should not be focusable within the subtree of an element with an ‘aria-hidden’ attribute with value ‘true’. So I checked carbon’s website/storybook and I got the same issue.

Element location:

<a
  class="cv-switcher-item-link bx--switcher__item-link bx--switcher__item-link--selected"
  href="javascript:void(0)">

In addition to this issue, I noticed that the navigation may also be incorrect. I can navigate inside the right panel even it is not expanded using the tab.

Is this a feature request (new component, new icon), a bug, or a general issue? Bug(Accessibility)

Is this issue related to a specific component? cv-header-panel

What did you expect to happen? What happened instead? What would you like to see changed? I expected the IBM’s Accessibility checker scan display this component as compliant. Element “a” should not be focusable within the subtree of an element with an ‘aria-hidden’ attribute with value ‘true’ and I can navigate inside the right panel even it is not expanded using the tab. I'd like to use links on this component and not navigate inside the right panel when it is collapsed.

What browser are you working in? Firefox browser - 110.0 (64-bit) - MacOS Ventura 13.2.1

What version of the Carbon Design System are you using? Carbon version: "@carbon/vue": "^2.45.1"

Any pressing ship or release dates we should be aware of? Yes, the release date is March 31st.

Steps to reproduce the issue

1. Step one Open this link: https://vue.carbondesignsystem.com/?path=/story/components-cvuishell--header-base-with-actions-and-right-panels
2. Step two Install IBM’s Accessibility checker extension for Firefox. Run IBM’s Accessibility checker scan (See screenshot below for more details).

Additional information

[davidnixon]

This was originally written against Vue 2 components but is a good candidate for a new accessibility test. See guidance on how to add a test and resolve any issues found.

[github-actions[bot]]

This issue has been marked as stale because it has required additional info or a response from the author for over 14 days. When you get the chance, please comment with the additional info requested. Otherwise, this issue will be closed in 14 days.