swiper vertical touch fade не работает

Столкнулся с такой проблемой. Слайдер vertical на touch экране не отрабатывает. Скрипт для слайдера:

  createSlider(slider, {
  modules: [Navigation, Pagination, EffectFade],
  effect: 'fade',
  fadeEffect: {
    crossFade: true
  },
  touchRatio: 1,
  watchSlidesProgress: true,
  allowTouchMove: true,
  // loop: true,
  // spaceBetween: 0,
  // slidesPerView: 1,
  slidesPerView: 'auto',
  observer: true,
  observeParents: true,
  loop: false,
  spaceBetween: 40,
  simulateTouch: true,
  autoHeight: false,
  
  // reverseDirection: true,
  direction: 'vertical',
  pagination: {
  el: '.page__pagination',
  clickable: true,
  // eslint-disable-next-line
  renderBullet: function (index, className) {
  const array = document
  .querySelector('.page__pagination')
  .dataset.dots.split(',');
   return array[index] !== undefined
   ? `<li class="${className} pagination__item">${array[index]}</li>`
   : '';
   },
  },
  // pagination: {
  //   el: pagg,
  //   clickable: true,
  // },
  navigation: {
    nextEl: '.page__nav .arrow-next',
    prevEl: '.page__nav .arrow-prev',
  },
  on: {
    // eslint-disable-next-line
    init: function (swiper) {
      const { slides } = swiper;
      const titles = [];
      slides.forEach((element) => {
        const title = element.querySelector('.js-slide-title');
        if (title) {
          titles.push(title);
        }
      });

      if (titles.length) {
        titles.forEach((element) => {
          const text = element.innerText;
          const letters = [...text];
          const html = letters
            .map(
              (letter, index) =>
                `<span style='--delay: 0.${index + 1}s'>${letter}</span>`
            )
            .join('');
          // eslint-disable-next-line no-param-reassign
          element.innerHTML = html;
        });
      }
    },
  },
});

Из похожих тем попробовал:

 .swiper-slide {
      touch-action: none;
      touch-action: pan-y;
    }

Но оно не сработало. Swiper: "9.4.1"