I am trying to implement mouse drag module which would allow to transverse all the slides in swiper with single mouse drag equal to entire height of wrapper div (functionality similar to scrollbar but working no matter where you click). To do so I've implemented the following code:

function longDrag({ swiper, extendParams, on }) {
    let prevY = null;
    on('sliderMove', (swiper, e) => {
        if (!swiper.params.debugger) return;
        if (!prevY) prevY = e.clientY;
        if (prevY < e.clientY) {
            swiper.slideNext(0, false);
        }
        if (prevY > e.clientY) {
            swiper.slidePrev(0, false);
        }
        prevY = e.clientY;
    });
    on('slideChange', () => {
        if (!swiper.params.debugger) return;

        console.log(
        'slideChange',
         swiper.previousIndex,
         '->',
         swiper.activeIndex
         );
    });
}

When running the code the slideChange event fires indicating that active slide index changes, however in the browser slide does not change. In addition when mouse drag is finished the index of active slide returns to the first slide. I've tried modyfing some other events and it appears that this return to the first slide is caused by something just after transitionEnd event is emitted; adding

on('transitionEnd', (swiper) => {
    throw new Error("Not an error, just workaround")
  });

to longDrag function makes the script work as intended, however I do not think that this is the right way to do it.