Topic: Getting Javascript error on ripple effect
Expected behavior Should not see javascript error in Ripple effect
Actual behavior seeing: ripple.js:115 Uncaught TypeError: Cannot read property 'offsetHeight' of null at n.value (ripple.js:115) at HTMLAnchorElement.e (event-handler.js:102) value @ ripple.js:115 e @ event-handler.js:102 navigation.js:71
Resources (screenshots, code snippets etc.)
Hello,
I recently experienced this same thing using the latest version of MDB5 (3.9.0) with the same stack trace. I've created a snippet where I ran into this that you should be able to use to duplicate.
https://mdbootstrap.com/snippets/standard/pianomaster88/3401295
Just click any of the menu links and you should see the console error. I am using Microsoft Edge but was able to duplicate in Google Chrome as well (running Windows 10).
It looks like it's failing on the Ripple class itself where the element is not defined (and therefore the offsetHeight is not defined):
Let me know if I can be of more assistance in this regard as well, happy to provide more screenshots or information if needed.
I should note that the ripple seems to still work, it just creates a console error.
Thanks!
Dawid Wajszczuk staff commented 3 years ago
Hi,
Thanks a lot for this snippet. We will take a closer look at this case. It seems weird because in this snippet everything works fine without errors https://mdbootstrap.com/snippets/standard/d-wajszczuk/3403064#html-tab-view.
Keep coding,
Dawid
PianoMaster88 pro premium priority commented 3 years ago
Thanks Dawid!
I wonder if it's something with the slim side-nav specifically? Just a thought as that's really the only thing different. You're correct that this one appears to be fine. In my snippet I had not implemented a button to change to the slim mode, but notice in the code I set the data attribute to indicate it as slim.
Thanks!
Dawid Wajszczuk staff commented 3 years ago
It can be related to slim option. However, my quick check, which included removing slim options, didn't change anything. The error still occurs. We will investigate this. And thanks for help :)
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 3.5.1
- Device: Macbook Pro
- Browser: Chrome
- OS: MacOS Catalina
- Provided sample code: No
- Provided link: No
Dawid Wajszczuk staff commented 4 years ago
Hi. Could you please provide a snippet with this error? It would help a lot. Thanks.