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!


Topic: Tooltips can get broken

chofmann premium asked 3 years ago


Expected behavior
Tooltips should show every time i hover over the element they are added to and hide on unhover.

Actual behavior
Tooltips sometimes stop showing up on hover, especially when frequently hovering and unhovering, but also during normal usage. On Firefox, they also sometimes stop hiding and stay.

Resources (screenshots, code snippets etc.)
The tooltip demo page has the same bug: https://mdbootstrap.com/docs/standard/components/tooltips/


softcon premium answered 3 years ago


I have the same issue on the latest version. I added it to the support forum but realised it is a duplicate of this issue, so I've closed mine and will add it to this instead (below):

*Expected behavior*Roll mouse over tooltip, tooltip displays in default place next to link, or top, bottom, left, right where specified

*Actual behavior*Tooltip displays for half a second and then pops to the top left of the screen.. Sometimes it doen't display at all. Sometimes it displays in the top middle of the screen.

*Resources (screenshots, code snippets etc.)*Error can be seen on demo site https://mdbootstrap.com/docs/standard/components/tooltips/#docsTabsOverview - roll over "Hover the link to see the tooltip" link a few times. Try scrolling up/down the page a bit and then scroll over it again. Notice the tooltip displays at the top.Screenshot available here: https://ufile.io/r2mes2fl

Also can happen on popover


Grzegorz Bujański staff answered 3 years ago


Thanks for reporting this. we will check it and fix it.


chofmann premium answered 3 years ago


Another thing i noticed. In the tooltip doc it says:

Tooltips are opt-in for performance reasons, so you must initialize them yourself.

When i remove the following code:

const tooltips = document.querySelectorAll('[data-mdb-toggle="tooltip"]');
tooltips.forEach(tooltip => new mdb.Tooltip(tooltip, {
    boundary: 'window'
}));

but leave all the data-mdb-toggle="tooltip" in, they are still getting initialized. Is this supposed to happen like this?


Grzegorz Bujański staff answered 3 years ago


Thanks. I will include this in the bug report.


Qw4rtz free answered 3 years ago


This exact same bug also happens with popovers (for both click and hover triggers).

Also they (tooltips and popovers) sometimes seem to "lose" their parents (they teleport to the top left corner, sometimes in the center but I guess the location where they teleport to depends on my styles).


Grzegorz Bujański staff answered 3 years ago


Thanks for reporting this bug. We'll fix it as soon as possible.



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: Premium
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: 3.2.0
  • Device: PC
  • Browser: Chrome/Firefox
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes