intro.js-react
intro.js-react copied to clipboard
stepIndex values differ between Windows and Apple-based devices at the end of the tour.
Describe the bug
stepIndex values differ between Windows and Apple-based devices at the end of the tour. So I had to do this workaround.
const onExit = async (stepIndex: number) => {
// It should be compared to steps.length -1, but at least in Windows, there is a weird quirk in the way the library counts indexes, so when there are n steps, the index just before Exit is somehow n.
// In iOS, like Mac PC, iPad, and iPhone, stepIndex will be 'n - 1'.
if (stepIndex === steps.length || stepIndex === steps.length - 1) {
setStepEnabled(false);
// Process that counts once the tour is completed to the end.
const newNumberOfTimesCompleted = numberOfTimesCompleted + 1;
setNumberOfTimesCompleted(newNumberOfTimesCompleted);
await handleSubmitProductTour(
docId,
productTourName,
newNumberOfTimesCompleted
);
}
};
To Reproduce
To reproduce, prepare a Windows PC and a Mac PC (or iPad or iPhone) and try console logging stepIndex in the onExit function.
I was able to notice this because my fellow developer and I were using different operating systems. I don't think I would have noticed otherwise.
Expected behavior
I would like to see the same count for devices or rather operating systems.
How often does this bug happen?
Every time
System Info
PC Spec
Device
- Device name DESKTOP-608QNA0
- Processor Intel(R) Core(TM) i7-10710U CPU @ 1.10GHz 1.61 GHz
- Installed RAM 16.0 GB (15.8 GB usable)
- System type 64-bit operating system, x64-based processor
- Pen and touch No pen or touch input is available for this display
OS
- Edition Windows 10 Home
- Version 21H2
- Installed on 3/27/2021
- OS build 19044.1826
- Experience Windows Feature Experience Pack 120.2212.4180.0
Browser
- Chrome Version 104.0.5112.81 (Official Build) (64-bit)
Mobile Spec
Device and OS
- Software Version: 15.5
- Model Name: iPhone 13 Pro
Browser
- Chrome Version 103.0.5060.63
Additional Context
I don't know if it is because of Intro.js-react or Intro.js. So created the same issue for Intro.js too. https://github.com/usablica/intro.js/issues/1746