HTML5 video. блокировка при кешировании видео в ios

Уже не знаю как решить проблему. Везде работает исправно кроме ios. у меня есть video элемент в React приложении. На ios со слабым интернетом видео ставится на паузу для загрузки в кеш и в этот момент все на экране блокируется. Кнопки не реагируют на нажатие, основа которая свайпается влево вправо перестает свайпаться. Все становится активным когда когда видео воспроизводится после остановки для загрузки в кеш части видео.

Видео занимает половину рабочей области НО блокируется все и даже все что не находится в области видео элемента. Код компонента не привожу полностью так как он очень большой (но проблема именно в компоненте video так как везде все работает и на ios все работает но без video).

Может это специфичное поведение ios и есть какой нибудь параметр который отключает подобное поведение?

<video
      src={story.stories[storyIndex]?.url}
      poster={"data:image/png;base64,***"}
      className="Story__content Pointer_none"
      ref={this.refVideo}
      controls={false}
      playsInline
      disablePictureInPicture={true}
      controlsList="nodownload"
      preload="auto"
      muted={isMute}
      onWaiting={() => { this.pause(); this.setState({ loader: true }) }}
      onCanPlay={() => { this.play(); this.setState({ loader: false }) }}
      onTimeUpdate={(e) => this.progress(storyIndex, Math.round(e.currentTarget.currentTime * 100 / e.currentTarget.duration))} />

1. Попробовал обсуление src перед назначением нового src
2. Делаю перерисовку video с помощью key

Ничего из этого не решило проблему