Video Texture RepeatWrapping bug on ios and safari

Questions
, , ,
1

I create a video texture for wall object. The wall object is wide, so i need repeat the video texture. The code like this

const createVideoMesh = (
    obj: Object3D<ThreeEvent>,
    video: HTMLVideoElement
  ): Mesh => {
    const mesh = obj.clone() as Mesh;

    const videoTexture = new VideoTexture(video);
    videoTexture.wrapS = RepeatWrapping;
    videoTexture.magFilter = LinearFilter;
    videoTexture.minFilter = LinearFilter;
    videoTexture.encoding = sRGBEncoding;
    videoTexture.flipY = false;
    videoTexture.needsUpdate = true;

    const videoMat = new MeshStandardMaterial({
      map: videoTexture,
      side: DoubleSide,
    });

    mesh.material = videoMat;
    mesh.material.needsUpdate = true;

    return mesh;
  };

But, the results are different between chrome and safari/ios.
Screen Shot 2022-01-06 at 16.42.55
Chrome

Screen Shot 2022-01-06 at 16.44.20
Safari

How to fix it? any idea why this happen?