usablica / intro.js

Lightweight, user-friendly onboarding tour library
http://introjs.com
Other
22.79k stars 2.59k forks source link

IntroJS Tooltip Not Displaying Correctly on iOS 18 #2081

Open locmaymo opened 1 week ago

locmaymo commented 1 week ago

Description:
I'm encountering an issue with IntroJS tooltips not displaying correctly on iOS 18. I tested this using an iPhone 14 Pro Max to view my website, which uses IntroJS. The first tooltip appears as expected, but when it moves to step 2, the tooltip does not display. I also tested this on the official demo page of IntroJS, and the issue persists there as well.

Additionally, I tested on BrowserStack with an iPhone 16 Pro Max running iOS 18, and the same behavior occurred.

This issue seems to only occur on iOS 18, as everything works fine on other platforms and iOS versions.

Steps to Reproduce:

  1. Use an iPhone 14 Pro Max running iOS 18.
  2. Access a website or the official demo page of IntroJS.
  3. Begin an IntroJS tour.
  4. Observe that the first tooltip appears correctly.
  5. Proceed to the second step, and notice that the tooltip does not show.

Expected Behavior:
The tooltips should display correctly for every step in the tour, including step 2 and beyond.

Actual Behavior:
The tooltip only appears for step 1 and does not display for subsequent steps on iOS 18.

Devices Tested:

nutpun commented 4 days ago

I found this issue on macOS safari 18.0.1 I think it happened on mac or iphone that use safari 18

nutpun commented 3 days ago

Can you try?

//hot fix missing tooltip on IOS 18
.introjs-tooltipReferenceLayer {
    visibility: visible;
}