Modal onClose error: Cannot read property 'removeAttribute' of null
See original GitHub issueI’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)
Issue Analytics
- State:
- Created 5 years ago
- Reactions:14
- Comments:8 (3 by maintainers)
Top Results From Across the Web
Modal onClose error: Cannot read property 'removeAttribute ...
I'm following this exact example, but when I open up the menu and click to close the menu... then the application crashes with...
Read more >Uncaught TypeError: Cannot read property of null - iDiallo
All this means is that you are trying to access a property of an object that is undefined. These usually happens when we...
Read more >Cannot read property 'removeAttribute' of null - Stack Overflow
I am using Javascript executor to remove readonly attribute but it is giving an error. Cannot read property 'removeAttribute' of null .
Read more >Uncaught TypeError: Cannot read property 'cancelPopUp' of ...
This is a read-only property on the window object and it becomes set to null (or with IE, it actually throws an exception...
Read more >An exception occurred in the client script. Error: Cannot read ...
I am using modal to add and edit a record. when i add a new one it works fine, but when i edit...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
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!