Tooltip: Stuck after hovering when used in complex page

[inad9300]

Describe the bug

When in a complex page (one that makes the CPU start to struggle a little), tooltips sometimes miss the event that hides them after hovering them, therefore remaining on screen when they should not.

Reproducer

https://codesandbox.io/s/primereact-test-forked-eijgs6?file=/src/index.js

PrimeReact version

8.7.3

React version

18.x

Language

ALL

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

1. Move the mouse from "one" to "ten", and back to "one" again in a straight line
2. Observe how some tooltips stay visible
3. If it doesn't happen, repeat step 1. It may be tricky to catch this consistently, so, alternatively, one can try moving the mouse slower or faster over the list, following patterns other than a straight line, or cranking up the number of elements in the list below (whose only purpose is to slow things down) to a number challenging for your machine. The goal is to get to a point like this:
   

Expected behavior

No response

[melloware]

Nice reproducer i was able to get it to happen too.

[inad9300]

Any luck with this issue?

In addition to what I reported, I have experienced several times what may or may not be the same problem: tooltips getting stuck in a not-so-complex scenario, hiding UI elements while refusing to go away. My hope is that tackling this issue fixes both problems.

[melloware]

No luck on my end...definitely seems like some kind of timing issue.

[inad9300]

@melloware I believe it feels more difficult to reproduce the problem now, but it nevertheless still occurs in 10.5.1 using the same steps described above:

Reproducer.

[melloware]

@inad9300 do you mind opening a new ticket with your reproducer?

[inad9300]

There you go: #6008 🙂