Самописный слайдер на JS с функцией автопролистывания. Функция автопролистывания должна ставиться на паузу, если на слайдер наведен курсор

Слайдер работает. Функция автопролистывания тоже работает. При наведении курсора мыши на слайдер происходит остановка слайдера и автопролистывание ставится на паузу. На тачскринах я хочу тоже делать паузу, но по каким-то причинам это работает не корректно.

Если я кликаю на слайдер (на тачскрине), то функция автопролистывания просто отключается (с концами). Мне же нужно чтобы при удержании тача создавалась пауза.

p.s. если что, после нажатия на любую стрелку автопролистывание снова заработает. В коде я закомментил проблемное место. Не могу понять в чем проблема.

document.addEventListener('DOMContentLoaded', function() {

class Slider {
  constructor(slider) {

     this.slider = slider;
     this.arrowPrev = this.slider.querySelector('[data-arrow="prev"]');
     this.arrowNext = this.slider.querySelector('[data-arrow="next"]');
     this.sliderTrack = this.slider.querySelector('#sliderTrack');
     this.allSlides = this.slider.querySelectorAll('.slide');
     this.counterSlides = 0;
     this.slideWidth = this.allSlides[0].offsetWidth;
     this.isPause = false;
     this.interval;

    // события
     this.arrowPrev.addEventListener('click', this.actionSlider.bind(this, 'prev'));
     this.arrowNext.addEventListener('click', this.actionSlider.bind(this, 'next'));
     
     // if ('ontouchstart' in window) {
     //    this.sliderTrack.addEventListener('touchmove', this.onPauseMoution);
     //    this.sliderTrack.addEventListener('touchend', this.offPauseMoution);
     // }
   
     this.sliderTrack.addEventListener('mouseover', this.onPauseMoution.bind(this));
     this.sliderTrack.addEventListener('mouseout', this.offPauseMoution.bind(this));
     
     this.automaticMoution();
  }

  actionSlider(direction) {

     if (direction === 'prev') {
        this.counterSlides--;

        if (this.counterSlides < 0) {
           this.counterSlides = this.allSlides.length - 1;
        }

        this.resetTimer();
        this.moutionSlider();
        this.automaticMoution();

     } else if (direction === 'next') {
        this.counterSlides++;

        if (this.counterSlides >= this.allSlides.length) {
           this.counterSlides = 0;
        }

        this.resetTimer();
        this.moutionSlider();
        this.automaticMoution();
     }
  }

  moutionSlider() {
    this.sliderTrack.style.transform = `translateX(${this.slideWidth * -this.counterSlides}px)`;
  }

  automaticMoution() {
     this.interval = setInterval(() => {
        if (!this.isPause) {
           this.actionSlider('next');
        }
     },3000)
  }

  resetTimer() {
     clearInterval(this.interval);
  }

  onPauseMoution() {
     this.isPause = true;
  }
  
  offPauseMoution() {
     this.isPause = false;
  }
}

const slider = new Slider(document.querySelector('#slider'));

});