Each step in the tour is being called multiple times on page scroll

[sidco0014]

Hi I just did my tour set up and its running fine, the bug what I faced in the debug mode is that, when the page loads and tour steps pop's up, each tour-step is being called multiple times on scrolling the mouse causing the popup to flicker. Any idea why? I shall post my code for the tour

<script>

    var tour = new Tour({
         storage: false,
         backdrop:true,
         debug: true
    });

    tour.addSteps([{
    element: "#prediction-question-text",
    title: "Prediction Question",
    content: "Question displayed to the user to predict"}, {

    element: "#prediction-confidence",
    title: "Prediction",
    content: "Text box to give your prediction "},{

    element: "#prediction-reasoning",
    title: "Reasoning box",
    content: "Reasoning box to support your prediction"}, {

    element: "#anchor-response",
    title: "Anchor reasoning",
    content: "Reasoning by some previous player",
    placement: "auto"}, {

    element: "#prediction-anchor-value",
    title: "Anchor response",
    content: "Prediction by some previous player"}, {

    element: "#game-points",
    title: "Points",
    content: "Total points earned and points associated with that question",
    placement: "left"}, {

    element: "#additional-questions",
    title: "Additional Questions",
    content: "Additional questions to be answered regarding the question",
    placement: "left"},{

    //Dummy step to redirect to '/iarpa/user' after the last popup is shown
    element: "#additional-questions",
    title: "Additional Questions",
    content: "Additional questions to be answered regarding the question",
    placement: "left",
    path: "/iarpa/user"}

    ]);

     tour.init();
     tour.setCurrentStep(0);
     tour.start();

</script>

[elmofromok]

Having the same issue.

[elmofromok]

I found that by removing the call back on line 840, the flicker goes away.

Replace this: this._onScroll((function(_this) { return function() { return _this._showPopoverAndOverlay(_this._current); };

with this: this._onScroll();

[sidco0014]

Okay will do. Thanks

[atlanteh]

This indeed solves the issue, but this means that if you have an item that has scroll, the element won't scroll with it

[IGreatlyDislikeJavascript]

atlanteh, I fixed this scroll issue in my fork but maybe I've missed something. What do you mean by "an item that has scroll"? If you correctly attach the tour step to the (position) of an element, what scenario requires the popover to move?

[atlanteh]

@IGreatlyDislikeJavascript man that was 6 months ago. I don't eve remember what I ate last night 🤣

[MegaChriz]

There is an other ticket about this with a useful workaround: #658

Tour.prototype._onScroll = () => {}