Popup: hover behaviour unreliable

[james-ff]

Bug Report

Steps

In the Semantic UI & Semantic UI React examples, go to Popup and try the Flowing Example

• You should find that on SUI the Popup on hover closes only when your mouse leaves the bounds of the popup content, but on SUIR the popup content closes unpredictably, even when your mouse is within the popup content bounds.
• I am finding cases in my website where buttons and other interactable components are not able to be interacted with reliably when wrapped in a Popup.

SUI: https://semantic-ui.com/modules/popup.html
SUIR: https://react.semantic-ui.com/modules/popup/

Expected Result

The Popup hover behaviour on SUIR should match SUI.

Actual Result

The SUIR Popup on hover mode unreliably closes, even when the mouse is within the bounds of the popup content.

Version

0.83.0

[layershifter]

You should find that on SUI the Popup on hover closes only when your mouse leaves the bounds of the popup content, but on SUIR the popup content closes unpredictably, even when your mouse is within the popup content bounds.

I tested in Chrome and don't any difference, however SUI has transitions. Can you record a gif? Becuase your issue is not obvious to me.

I am finding cases in my website where buttons and other interactable components are not able to be interacted with reliably when wrapped in a Popup.

It may be similar to #3231 (comment)

[james-ff]

I'm using the latest non-beta version of Firefox:

• I am not clicking in either of these recordings, just moving the cursor around
• To clarify, in SUIR the popup closes unpredictably, but seems to be based on cursor movement
• Do you think that the transition is causing the disparity?

SUI:

SUI React:

[layershifter]

Now it's more clear, thanks.

[vanya2h]

+1. Have same issue!

[Fabianopb]

Hello! I've been a heavy user of SUIR for some time and I've been planning to start contributing to this repo.

I've investigated this issue and possibly found a solution, could submit a PR soon.