[pickers] Error in console using MobileDatePicker

[sharifmacky]

Steps to reproduce

Error in console using mobile-date-picker:
create-event:1 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. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.

Steps to reproduce:
-Visit https://mui.com/x/react-date-pickers/date-picker/
-Open devtools
-Toggle device toolbar to Mobile (ie. Select Mobile mode)
-Click on the Mobile variant DateTimePicker
-Click Cancel
-Observe Error in console
Note there is another issue when opening devtools in mobile mode (Error: Minified React error mui/material-ui#418) which prevents this error from showing. Follow the above steps in the exact order.

Current behavior

Error

Expected behavior

No Error

Context

No response

Your environment

Google Chrome 127.0.6533.120

System:
OS: Windows 11 10.0.22631
Binaries:
Node: 20.8.1 - C:\Program Files\nodejs\node.EXE
npm: 10.1.0 - C:\Program Files\nodejs\npm.CMD
pnpm: Not Found
Browsers:
Chrome: Not Found
Edge: Chromium (126.0.2592.87)
npmPackages:
@emotion/react: ^11.11.3 => 11.11.4
@emotion/styled: ^11.11.0 => 11.11.5
@mui/base: 5.0.0-beta.40
@mui/core-downloads-tracker: 5.16.7
@mui/icons-material: ^5.15.6 => 5.15.15
@mui/joy: ^5.0.0-beta.25 => 5.0.0-beta.32
@mui/material: ^5.15.6 => 5.16.7
@mui/private-theming: 5.16.6
@mui/styled-engine: 5.16.6
@mui/system: 5.16.7
@mui/types: 7.2.15
@mui/utils: 5.16.6
@mui/x-date-pickers: ^7.11.0 => 7.17.0
@mui/x-internals: 7.17.0
@types/react: ^18.2.43 => 18.2.79
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0

Search keywords: aria-hidden

Search keywords:

[michelengelen]

@sharifmacky just to let you know... we are looking into this atm

[michelengelen]

So apparently this only happens if you switch from desktop mode to mobile device mode and perform the exact actions like stated above. Since it is impossible for this scenario to show on devices other than to simulate it I doubt that this will ever pose to be a problem in a real world application.

@LukasTy how should we proceed here? We could add the waiting for upvotes label, or should we keep it opened on the board to not loose it?

[sharifmacky]

Actually, on my app this happened consistently on first load and didn't require switching from desktop to mobile. However, I can't seem to reproduce the issue anymore. I'm guessing since moving to chrome 129. Although strange it still happens following the above steps and does suggest you could have an underlying issue? Feel free to close this and I can reopen if I find a new use case.

[michelengelen]

Thanks for the information @sharifmacky ... As suggested I'll close this for now. 🙇🏼