Tooltips don't destroy when used in a scrollable table

[noehre]

I was using tooltips on elements in a scrollable section on the page.
In the given example it is a table that is longer than what is displayed on the page. By scrolling around rapidly the tooltips are not destroyed correctly. The tooltips are hidden, but remain in the DOM, even though the disposeTimer is set to 0.

The expected behaviour would be that the tooltips are destroyed when hidden.

The actual behaviour ist that although most are destroyed correctly, some are not which can cause other issues.

[AndrianLeah]

Having the same issue not only inside table but every scrollable element. The element not being removed from the DOM causes the whole page to scroll.
Anyone found a workaroud in the meantime?

[noehre]

we have hidden the overflow of the body, which is not an ideal solution but at least it stops the page from scrolling

[vincerubinetti]

I switched from vue-tippy to this package, thinking it was the other package being buggy. Now I'm wondering if there's a common thread here.

Take a look at this test:
https://jsfiddle.net/a9omgr1e/

Apparently mouseleave events don't trigger on elements when those elements get scrolled out from under the mouse? Actually, it seems to only be a problem in Chrome. FireFox and Safari both seem to trigger the leave event after a small debounce, whereas Chrome never does.

Directly related Chromium bug reports:

https://issues.chromium.org/issues/41038961
https://issues.chromium.org/issues/40708855
https://issues.chromium.org/issues/41012783

Indirectly related reports (CSS hover states):

https://issues.chromium.org/issues/40774130
https://issues.chromium.org/issues/40805375
https://issues.chromium.org/issues/40315324

I think to really fix this in the library, you'd have to listen to all scroll events on the page -- actually, technically you'd need to somehow listen to all layout shifts, since any of those could cause repositioning -- then use Document.elementsFromPoint with the last recorded mouse position to see if the mouse is still within the element. Horrible.

[vincerubinetti]

However, the library does seem to hide the tooltip when scrolling, it just doesn't remove it from the DOM for some reason. So it must already be doing some kind of check for this situation.