Console warning about aria-hidden attribute when expanding a DataGrid row

[yelworc]

What you were expecting:
No warnings in the browser console 😄

What happened instead:
When tapping the expand icon on an expandable DataGrid row for the first time in a session, I'm seeing this warning in the browser console:

Blocked aria-hidden on an element because its descendant retained focus. The 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. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.
Element with focus: <div.MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall RaDatagrid-expandIcon css-1pe4mpk-MuiButtonBase-root-MuiIconButton-root>
Ancestor with aria-hidden: <div.MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall RaDatagrid-expandIcon css-1pe4mpk-MuiButtonBase-root-MuiIconButton-root>

As far as I can tell, this boils down to the aria-hidden="true" prop on the IconButton in ExpandRowButton.

I'm wondering what the reasoning behind that prop is/was (it's been there for 6 years); there are ARIA labels for the closed/expanded states, so preventing focus (and excluding it from keyboard navigation with tabIndex={-1}) seems contradictory to me. Could those two props (aria-hidden and tabIndex) just be removed?

Environment

• React-admin version: 5.10.2
• Last version that did not exhibit the issue (if applicable): -
• React version: 18.3.1
• Browser: Vivaldi 7.5.3735.66

[fzaninotto]

Hi, and thanks for your report.

I can't reproduce the problem you describe in the Simple example stackblitz with Chrome, Firefox, or Safari. Could it be a problem caused by the browser you use (Vivaldi)?

[yelworc]

Dang, this is weird 😆

I'm getting the warning with your Stackblitz example too, yes – and not just in Vivaldi, in Chromium too (140.0.7339.127; in incognito mode, so there shouldn't be any interference by browser extensions either).

But I just realized it only shows up after you use the DevTools inspector tool at least once! So this might be an odd DevTools quirk and not worth losing sleep over – feel free to close the issue.

Aside from the warning, though, I'm still wondering whether the expand button should really be aria-hidden in the first place.