search

iTwin / iTwinUI

A design system for building beautiful and well-working web interfaces.
https://itwin.github.io/iTwinUI/
MIT License
105 stars 38 forks source link

Tooltip: Doesn't display properly on popout windows #1218

Closed elephantcatdog closed 1 year ago

elephantcatdog commented 1 year ago

Describe the bug (actual behavior)

"If I pop out my widget into another window, then minimize the main window (important), the iTwin-React tooltip does not disappear when I move the mouse away from the item that initiates its appearance."

Expected behavior

"The Tooltip should disappear when you move the mouse away from the Button"

Reproduction

Link to a minimal repro: https://codesandbox.io/s/cranky-darkness-4z3l1q?file=/src/App.tsx

Steps to reproduce
  1. Open popup window.
  2. Hover over button. Notice that the tooltip appears and disappears.
  3. Minimize original window.
  4. Hover over button again. Now the tooltip will only appear and never disappears.

Additional information

See additional info: https://github.com/iTwin/appui/issues/279

Might have to do with tippy? Maybe related to https://stackoverflow.com/questions/52381990/javascript-tippy-js-not-working-for-dynamic-content?

mayank99 commented 1 year ago

Duplicating portions of latest comments from https://github.com/iTwin/appui/issues/279 for context:

So, in essence, I'm not sure we can control this behavior as it appear to be a browsesr resouce saving mechanism.

We are also starting work on our next major release very soon, and plan to replace Tippy with floating-ui, so this issue might just go away?

In either case, it seems like a very uncommon and minor issue, plus the proper behavior is returned when the window is restored. So I would say it doesn't need to be prioritized.

For what it's worth, I agree, I don't think it will bother users very much. I mostly just wanted to make the teams aware of it. I'll wait for the upgrade and see if the issue is still present.

mayank99 commented 1 year ago

Here's what I think we should do: migrate from tippy.js to floating-ui (next major release) and try to reproduce this issue again with the new Tooltip. If it's reproducible, then investigate further. If not, then close, assuming it's fixed.

mayank99 commented 1 year ago

fixed in v3 via #1311. https://codesandbox.io/s/nervous-platform-vgcf4j?file=/src/App.tsx