Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!

  1. MDB Home Page
  2. Support Main Page
  3. MDB Standard
Topic: Getting Javascript error on ripple effect

stevecjor priority asked 3 years ago

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.)

Dawid Wajszczuk staff commented 3 years ago

Hi. Could you please provide a snippet with this error? It would help a lot. Thanks.

PianoMaster88 priority answered 3 years ago

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):screenshot of bug

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 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 :)
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • ForumUser: Priority
  • 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
Tags
ripple-effect
About author
stevecjor
62Support score
8Questions 2Answers 1Snippets