Safari bug on VideoTexture repeat

Debugging a website I am building and encountered an issue where VideoTexture was appearing to be clamped rather than wrapping on iOS and Mac Safari. On testing standalone, I found that setting needsUpdate = true on animate would cause a flicker between wrapped and tiled. This occurs on both VideoTexture and Texture.

I’ve set up demos here

I tried a workaround of using h265 encoded mp4, as sometimes that behaves better on iOS but it did not work on this occasion.

Is this a known bug? Any potential workarounds such as other video formats that don’t have this issue?

I believe this post is also related Video Texture RepeatWrapping bug on ios and safari

This topic is a duplicate of Video Texture RepeatWrapping bug on ios and safari.

Since this only happens in Safari, it should be reported at After a quick search, it seems there is not yet a bug tracking this issue.

@Grum What version of macOS/iOS and Safari have you tested with?

Hi @Mugen87
Sure, acknowledged that in the post. Didn’t see any comments or resolutions so made a new thread.

MacBook Pro 13 inch 2017 running macOS Montererey 12.3.1 Safari 15.4 17613.
iPhone 12 Pro Max running iOS 15.5

Created a shadertoy to see if the problem persisted on there and video textures don’t seem to show at all on iOS and the clamp issue is present on macOS. Shader - Shadertoy BETA

I’ll see if I can create a bug listing later on. Needing to do a workaround in the meantime!
Going to try drawing video to canvas and tiling that. Could be clunky though.

Also have this issue on ios16 safari threejs r138

Works fine on everything else

Was this resolved???


       var geometry = new THREE.CylinderGeometry( 1,1, 8, 32,1, true );
       this.tubematerial = new THREE.MeshBasicMaterial({color:0xdddddd}); = new THREE.Mesh( geometry, this.tubematerial );
       var parent = document.getElementById("videotextures");
       this.tubevideo = document.createElement('video');
       this.tubevideo.loop = true;
       this.tubevideo.src = 'assets/video/'+_G.ASSETS.TEXTURES.TUNNEL[this.vid_index]+'.mp4';
       this.tubevideo.setAttribute('webkit-playsinline', ''); 
       this.tubevideo.setAttribute('crossOrigin', 'anonymous'); 
       this.tubevideo.setAttribute('playsinline', ''); 
       parent.appendChild(this.tubevideo); = "videotex";
       this.tubevideo.muted = true;
       this.tubevideotex = new THREE.VideoTexture( this.tubevideo ); = this.tubevideotex;
       this.tubematerial.side = THREE.DoubleSide;
       this.tubematerial.needsUpdate = true;
       this.tubevideotex.wrapS = THREE.MirroredRepeatWrapping;
       this.tubevideotex.wrapT = THREE.MirroredRepeatWrapping;
       this.tubevideotex.magFilter = THREE.LinearFilter;
       this.tubevideotex.minFilter = THREE.LinearFilter;
       if(!this.is_ios){this.tubevideotex.repeat.set( 2,2 );} //still fukd even with repeat off

On Update: