Emitting resumeAutoplay event creates multiple instances

[stvedo]

Version: 2.15.0

Looks like emitting pauseAutoplay and resumeAutoplay causes some kind of multiple timeout instances. Once I emit those two methods, autoplay functionality will trigger doAutoplay method multiple times ( depending on how many times i called resumeAutoplay method.

This can be reproduced in official demo page https://antoniandre.github.io/vueper-slides/

Steps to reproduce:

1. Navigate to Basic with Autoplay & Infinite section
2. Press Pause button
3. Press Resume button
4. Autoplay is now sliding two items instead of one

Here's my code snippet

<vueper-slides
      ref="banners"
      :autoplay
      fixed-height="6.875rem"
      :duration="5000"
      :bullets="bullets"
      @previous="slide()"
      @next="slide()">
      <template v-slot:arrow-left>
        <i class="icon icon-arrow-left" />
      </template>
      <template v-slot:arrow-right>
        <i class="icon icon-arrow-right" />
      </template>
      <vueper-slide
        v-for="banner in bannerItems"
        :key="banner.id">
        <template v-slot:content>
          <a
            :href="banner.url"
            :target="getTarget(banner)">
            <div
              :style="{ backgroundImage: `url(${banner.resource.url})` }"
              class="banner-image">
            </div>
          </a>
        </template>
      </vueper-slide>
    </vueper-slides>

  ....
  methods: {
    slide() {
      this.$refs.banners.pauseAutoplay();
      this.$refs.banners.resumeAutoplay();
    }
  }

[stvedo]

I'm not sure if this can cause some other issues, but clearTimeout(this.autoplayTimer) in doAutoplay method before assigning timeout should solve this issue.

[antoniandre]

Thanks for reporting and for checking the source code and finding the solution @stvedo!
That was a regression from one of my last fixes. 😅
Now published in version 2.15.1 & 3.3.1

Please reopen if not solved. :)