react icon indicating copy to clipboard operation
react copied to clipboard
verified publisher icon primer

TreeView: Remove aria-describedby when leading and trailing visuals do not exist

Open JelloBagel opened this issue 1 year ago • 4 comments

Description

We are using TreeView in the NestedListView and I came across this warning in the axe tests: ARIA attribute element ID does not exist on the page: aria-describedby=":r3: :r4:". The aria-describedby is set in the TreeView Primer component by the leading visual and the trailing visual. Because the NestedListView does not use the TreeView.LeadingVisual and TreeView.TrailingVisual, the ids do not exist on the page.

Steps to reproduce

  1. Go to Storybook Recipes > NestedListView > Example
  2. Open Accessibility tab in the Add Ons panel
  3. Click the Incomplete tab to view test warnings
  4. Notice "ARIA attributes must conform to valid values"

Version

v36.12.0

Browser

Chrome

JelloBagel avatar Apr 02 '24 21:04 JelloBagel

Just going to mention that having aria-describedby pointing to a non-existent id (or even having the attribute, pointing to nothing, a la aria-describedby="") won't have an adverse effect as such, and is more of a "code quality" issue. Of course, if it's easy to avoid, then by all means you should go for fixing it.

patrickhlauke avatar Apr 03 '24 08:04 patrickhlauke

Thanks @JelloBagel for filing this issue. We agree it is better to fix it and It is in our backlog now.

broccolinisoup avatar Apr 08 '24 22:04 broccolinisoup