I'm following this exact example, but when I open up the menu and click to close the menu... then the application crashes with the below error:
Example used:
https://material-ui.com/demos/menus/#selected-menus
Deps:
"@material-ui/core": "^3.3.0",
"@material-ui/icons": "^3.0.1",
"typescript": "^3.1.3"
manageAriaHidden.js:28 Uncaught TypeError: Cannot read property 'removeAttribute' of null
at ariaHidden (manageAriaHidden.js:28)
at ModalManager.remove (ModalManager.js:188)
at Modal._this.handleClose (Modal.js:145)
at Modal.componentDidUpdate (Modal.js:221)
at commitLifeCycles (react-dom.development.js:14693)
at commitAllLifeCycles (react-dom.development.js:15905)
at HTMLUnknownElement.callCallback (react-dom.development.js:145)
at Object.invokeGuardedCallbackDev (react-dom.development.js:195)
at invokeGuardedCallback (react-dom.development.js:248)
at commitRoot (react-dom.development.js:16075)
at completeRoot (react-dom.development.js:17463)
at performWorkOnRoot (react-dom.development.js:17391)
at performWork (react-dom.development.js:17295)
at performSyncWork (react-dom.development.js:17267)
at interactiveUpdates$1 (react-dom.development.js:17558)
at interactiveUpdates (react-dom.development.js:2208)
at dispatchInteractiveEvent (react-dom.development.js:4913)
ariaHidden @ manageAriaHidden.js:28
remove @ ModalManager.js:188
Modal._this.handleClose @ Modal.js:145
componentDidUpdate @ Modal.js:221
commitLifeCycles @ react-dom.development.js:14693
commitAllLifeCycles @ react-dom.development.js:15905
callCallback @ react-dom.development.js:145
invokeGuardedCallbackDev @ react-dom.development.js:195
invokeGuardedCallback @ react-dom.development.js:248
commitRoot @ react-dom.development.js:16075
completeRoot @ react-dom.development.js:17463
performWorkOnRoot @ react-dom.development.js:17391
performWork @ react-dom.development.js:17295
performSyncWork @ react-dom.development.js:17267
interactiveUpdates$1 @ react-dom.development.js:17558
interactiveUpdates @ react-dom.development.js:2208
dispatchInteractiveEvent @ react-dom.development.js:4913
index.js:2178 The above error occurred in the <Modal> component:
in Modal (created by WithStyles(Modal))
in WithStyles(Modal) (created by Popover)
in Popover (created by WithStyles(Popover))
in WithStyles(Popover) (created by Menu)
in Menu (created by WithStyles(Menu))
in WithStyles(Menu) (created by AudioSettings)
in div (created by AudioSettings)
in div (created by DialogContent)
in DialogContent (created by WithStyles(DialogContent))
in WithStyles(DialogContent) (created by AudioSettings)
in div (created by Paper)
in Paper (created by WithStyles(Paper))
in WithStyles(Paper) (created by Dialog)
in Transition (created by Fade)
in Fade (created by WithTheme(Fade))
in WithTheme(Fade) (created by Dialog)
in RootRef (created by Modal)
in div (created by Modal)
in Portal (created by Modal)
in Modal (created by WithStyles(Modal))
in WithStyles(Modal) (created by Dialog)
in Dialog (created by WithStyles(Dialog))
in WithStyles(Dialog) (created by AudioSettings)
in AudioSettings (created by WithStyles(AudioSettings))
in WithStyles(AudioSettings) (created by WithRoot)
in MuiThemeProvider (created by WithRoot)
in WithRoot (created by FloatMenu)
in FloatMenu (created by WithStyles(FloatMenu))
in WithStyles(FloatMenu) (created by WithRoot)
in MuiThemeProvider (created by WithRoot)
in WithRoot (created by NamespacesConsumerComponent)
in NamespacesConsumerComponent (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in WithContext (created by LoadNamespace)
in LoadNamespace (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in LoadNamespace(WithRoot) (created by inject-LoadNamespace(WithRoot)-with-store)
in inject-LoadNamespace(WithRoot)-with-store (created by DebateScene)
in DebateScene (created by WithStyles(DebateScene))
in WithStyles(DebateScene) (created by WithRoot)
in MuiThemeProvider (created by WithRoot)
in WithRoot (created by NamespacesConsumerComponent)
in NamespacesConsumerComponent (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in WithContext (created by LoadNamespace)
in LoadNamespace (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in LoadNamespace(WithRoot) (created by DebateScene)
in DebateScene (created by WithStyles(DebateScene))
in WithStyles(DebateScene) (created by WithRoot)
in MuiThemeProvider (created by WithRoot)
in WithRoot (created by NamespacesConsumerComponent)
in NamespacesConsumerComponent (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in WithContext (created by LoadNamespace)
in LoadNamespace (created by WithMergedOptions)
in WithMergedOptions (created by Context.Consumer)
in LoadNamespace(WithRoot) (created by LoadableComponent)
in LoadableComponent (created by Route)
in Route (created by DTCRouter)
Consider adding an error boundary to your tree to customize error handling behavior.
Visit https://fb.me/react-error-boundaries to learn more about error boundaries.
__stack_frame_overlay_proxy_console__ @ index.js:2178
logCapturedError @ react-dom.development.js:14550
logError @ react-dom.development.js:14586
update.callback @ react-dom.development.js:15273
callCallback @ react-dom.development.js:11133
commitUpdateEffects @ react-dom.development.js:11172
commitUpdateQueue @ react-dom.development.js:11160
commitLifeCycles @ react-dom.development.js:14721
commitAllLifeCycles @ react-dom.development.js:15905
callCallback @ react-dom.development.js:145
invokeGuardedCallbackDev @ react-dom.development.js:195
invokeGuardedCallback @ react-dom.development.js:248
commitRoot @ react-dom.development.js:16075
completeRoot @ react-dom.development.js:17463
performWorkOnRoot @ react-dom.development.js:17391
performWork @ react-dom.development.js:17295
performSyncWork @ react-dom.development.js:17267
interactiveUpdates$1 @ react-dom.development.js:17558
interactiveUpdates @ react-dom.development.js:2208
dispatchInteractiveEvent @ react-dom.development.js:4913
manageAriaHidden.js:28 Uncaught TypeError: Cannot read property 'removeAttribute' of null
at ariaHidden (manageAriaHidden.js:28)
at ModalManager.remove (ModalManager.js:188)
at Modal._this.handleClose (Modal.js:145)
at Modal.componentDidUpdate (Modal.js:221)
at commitLifeCycles (react-dom.development.js:14693)
at commitAllLifeCycles (react-dom.development.js:15905)
at HTMLUnknownElement.callCallback (react-dom.development.js:145)
at Object.invokeGuardedCallbackDev (react-dom.development.js:195)
at invokeGuardedCallback (react-dom.development.js:248)
at commitRoot (react-dom.development.js:16075)
at completeRoot (react-dom.development.js:17463)
at performWorkOnRoot (react-dom.development.js:17391)
at performWork (react-dom.development.js:17295)
at performSyncWork (react-dom.development.js:17267)
at interactiveUpdates$1 (react-dom.development.js:17558)
at interactiveUpdates (react-dom.development.js:2208)
at dispatchInteractiveEvent (react-dom.development.js:4913)
I encountered this problem earlier.
manageAriaHidden.js#ariaHidden check code(null
?) was deleted...
manageAriaHidden.js#ariaHidden check code(null?) was deleted...
@jeffy-g Yes, it was. This defensive check was hidding something. We have already found one hidden problem.
As a temporary measure, I've been able to resolve this issue by rolling back to @material-ui/[email protected] and version locking the package.json
npm install @material-ui/[email protected]
We will do a quick release with the fix. I suspect there is more.
馃摝 v3.3.1 was just released. A regression test was added to prevent it to happen a second time in the future. We are sorry for the annoyance. I think that I will change the release schedule a bit. It's safer to release every Saturday (instead of Sunday). It should let time to fix the regressions Sunday before the week starts (+70% of the usage). If the problem persists, please open an issue with a reproduction example. Thank you!
I am having the same issue with 3.3.1.
Try to use a Select
component inside a Dialog
it is fine to use the
Select
outside theDialog
@3.2.2 works as @recon-bi mentioned
I believe this same error is alive within version 3.3.1.
Most helpful comment
We will do a quick release with the fix. I suspect there is more.