search

HiDeoo / intro.js-react

Intro.js react wrapper
MIT License
407 stars 58 forks source link

Incorrect Positioning of Tooltip #2027 #109

Closed alizeh-n0name closed 11 months ago

alizeh-n0name commented 11 months ago

Describe the bug

I am using Intro js React wrapper in my project but initially, the .introjs-helperLayer and .introjs-tooltipReferenceLayer are positioned incorrectly, so much so that they are not visible on the screen. The CSS left attribute is set incorrectly. Tooltip is not visible on the screen.

image

The LEFT attribute is set incorrectly:

image

To Reproduce

Intro.js has been set up using the default settings. No custom CSS changes have been made.

Expected behavior

Tooltip should be at the correct position

How often does this bug happen?

Every time

System Info

React: v18.2.0 Node: v18.18.0 IntroJs React: v1.0.0 Chrome: v 119.0.6045.123

Additional Context

I feel like this issue is coming from Introjs itself. A workaround would be to invoke refresh to recalculate the positions but I can't find a way to do that through the wrapper. Is it not an option at the moment or am I missing something?

HiDeoo commented 11 months ago

Thanks for your report.

In the past, most of the time, position related issues have been related to Intro.js directly and not the React wrapper as it does not do much regarding positioning.

I also see that in the issue you have opened in the Intro.js repository, you found an identical stale issue which seems to confirm that.

Considering all this, I am going to close this issue as it seems this should be fixed upstream but if at some point you confirm that this is not the case, please feel free to open it again with a minimal reproduction.