shepherd-pro
Shepherd step moves up and down continuously when target section is out of view
I am using Shepherd to create a tour for a large, scrollable form. One of the steps is attached to a specific section in the form, and scrollTo is disabled for the tour.
The issue occurs when the user scrolls up, causing the target section to move out of view. As a result, the Shepherd step shifts to the bottom of the screen. However, once the arrow of the step touches the bottom of the viewport, the step begins to jitter, moving up and down.
This behaviour stops when the user scrolls slightly upwards, so the arrow is no longer at the very bottom of the screen.
@anusha-c18 any chance you could submit a replication of this behavior in codesandbox or something like that? Also, would you expect the step to also scroll out of view or something else?
So it isn't to do with the target being out of view as shown in the video where the target is the Advanced accordion. I've attached a video for your reference
https://github.com/user-attachments/assets/b84ddb03-dc74-4b9a-89fd-ce772aa487d5
Also, would you expect the step to also scroll out of view or something else?
Yes, that would be ideal. If the target scrolls out of view, the step should follow and move with it.
We resolved this issue by setting the position of the shepherd-element class to fixed.
This seems like a bug in the flipping behavior. We try to flip and show on the other side if there is not room, so my assumption is it tries to flip and cannot so keeps trying back and forth because neither side has room. I wonder if there are any floating-ui bugs reported around this?
