# Video texture no longer updating after entering WebXR mode

**URL:** <https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068>\
**Category:** Questions\
**Tags:** webxr, vr, textures\
**Created:** [September 29, 2022, 12:07pm UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068 "2022-09-29T12:07:22Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![jcy](https://avatars.discourse-cdn.com/v4/letter/j/91b2a8/32.png) [@jcy](https://discourse.threejs.org/u/jcy)\
**Post date:** [September 29, 2022, 12:07pm UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/1 "2022-09-29T12:07:22Z")

</div>

Hi,

I have several video textures with “needsUpdate” set to true. These play videos perfectly fine in non WebXR mode.

However whenever I’m entering WebXR mode via VR headsets, the video textures often will no longer update and gets stuck at the last video frame, with sounds still playing in background.

How can I set the video textures to continuously update, keep the video playing even upon entering WebXR mode?

Thank You

---

<div class="post-metadata">

**Author:** ![Lemonade](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lemonade/32/26408_2.png) [@Lemonade](https://discourse.threejs.org/u/Lemonade)\
**Post date:** [October 4, 2022, 3:19am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/2 "2022-10-04T03:19:55Z")

</div>

I just had what sounds like the the same issue and was I fixed it by updating the html video tag to:

```javascript
<video id="video" loop muted crossOrigin="anonymous" playsinline style="display:none">
    <source src="./img/vid.mp4" type="video/mp4">
  </video> 

```

it was

```javascript
  <video id="video" width="640" height="360" loop>
    <source src="./img/vid.mp4" type="video/mp4">
  </video> 

```

before and somehow that fixed it for me.  
my JS is

```javascript
const video = document.getElementById( 'video' );
videoTexture = new THREE.VideoTexture( video );
video.play();

```

Your mileage may vary - good luck

---

<div class="post-metadata">

**Author:** ![jrjdavidson](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrjdavidson/32/21784_2.png) [@jrjdavidson](https://discourse.threejs.org/u/jrjdavidson)\
**Post date:** [November 7, 2022, 1:37am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/3 "2022-11-07T01:37:35Z")

</div>

I am getting the same issue as @jcy and when I saw this thread, I had a glimmer of hope!

But alas this doesn’t solve it for me. I’m using a pico neo 3.

---

<div class="post-metadata">

**Author:** ![jcy](https://avatars.discourse-cdn.com/v4/letter/j/91b2a8/32.png) [@jcy](https://discourse.threejs.org/u/jcy)\
**Post date:** [November 7, 2022, 2:19am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/4 "2022-11-07T02:19:36Z")

</div>

I also have the Pico 3 and this issue still persists. The above solution didn’t really work for me.

---

<div class="post-metadata">

**Author:** ![jrjdavidson](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrjdavidson/32/21784_2.png) [@jrjdavidson](https://discourse.threejs.org/u/jrjdavidson)\
**Post date:** [November 7, 2022, 2:59am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/5 "2022-11-07T02:59:42Z")

</div>

I tried to get more info on the pico forums but no luck:  
[https://developer-global.pico-interactive.com/community/post/7150765868806766598](https://developer-global.pico-interactive.com/community/post/7150765868806766598)

---

<div class="post-metadata">

**Author:** ![dllb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/dllb/32/19191_2.png) [@dllb](https://discourse.threejs.org/u/dllb)\
**Post date:** [November 7, 2022, 9:20am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/6 "2022-11-07T09:20:24Z")

</div>

Several things tend to brake when entering WebXR, and the solution often requires days of work. That should be strong motivation to make your own custom VR environment and get rid of all the limitations and shortcomings of Google’s and Facebook’s format, including dependencies on their apps and browser. If stuck you could take example of Mozilla’s polyfill.

---

<div class="post-metadata">

**Author:** ![jrjdavidson](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrjdavidson/32/21784_2.png) [@jrjdavidson](https://discourse.threejs.org/u/jrjdavidson)\
**Post date:** [December 2, 2022, 1:15am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/7 "2022-12-02T01:15:54Z")

</div>

Kia ora jcy,

The problem is fixed for me with the upcoming pico browser 3.2.5 . I finally got in touch with the pico devs and they figured out the problem. I’m really stoked that they engaged and had a solution real quick once I got through.

Cheers,  
JD

---

<div class="post-metadata">

**Author:** ![jcy](https://avatars.discourse-cdn.com/v4/letter/j/91b2a8/32.png) [@jcy](https://discourse.threejs.org/u/jcy)\
**Post date:** [December 2, 2022, 3:37am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/8 "2022-12-02T03:37:48Z")

</div>

That’s great! Do you know when will the new browser update be released?

Also how did you get in touch with the devs at Pico?

I’m experiencing flickering issues with textures when entering WebXR mode in the Pico browser and it’s been like this for a while.

---

<div class="post-metadata">

**Author:** ![jrjdavidson](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrjdavidson/32/21784_2.png) [@jrjdavidson](https://discourse.threejs.org/u/jrjdavidson)\
**Post date:** [December 2, 2022, 5:14am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/9 "2022-12-02T05:14:54Z")

</div>

In the end I just got in touch with the person who sold me the headset.

---

<div class="post-metadata">

**Author:** ![jcy](https://avatars.discourse-cdn.com/v4/letter/j/91b2a8/32.png) [@jcy](https://discourse.threejs.org/u/jcy)\
**Post date:** [December 3, 2022, 1:50pm UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/10 "2022-12-03T13:50:12Z")

</div>

@jrjdavidson I tested the latest Pico browser 3.2.5 and the video issue seems indeed fixed. But I’m noticing that anti-alias in Three JS seems to have no effect in the Pico browser. Have you experienced this issue? Every single Three JS demo when opened in the Pico browser results in jagged texture edges at the moment.

---

<div class="post-metadata">

**Author:** ![jrjdavidson](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jrjdavidson/32/21784_2.png) [@jrjdavidson](https://discourse.threejs.org/u/jrjdavidson)\
**Post date:** [December 4, 2022, 8:48pm UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/11 "2022-12-04T20:48:28Z")

</div>

I had a another look and compared the vr/panorama/depth in my desktop browser to the headset. I think you’re right, there are clearly some big differences in the way edges are rendered.  
Do you know if this is a pico issue or if other headsets such as the quest have the same problems?

Also - probably should be opening a new thread instead of writing here as this is a different issue!

---

<div class="post-metadata">

**Author:** ![jcy](https://avatars.discourse-cdn.com/v4/letter/j/91b2a8/32.png) [@jcy](https://discourse.threejs.org/u/jcy)\
**Post date:** [December 5, 2022, 4:34am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/12 "2022-12-05T04:34:45Z")

</div>

The Oculus Quest also has a tiny bit but it’s very subtle and not at all serious like in the Pico browser, where it almost seems like you’re looking at textures through a heatwave, where everything is flickering / shimmering.

I’ve created a new ticket here in the Pico forum:  
[https://developer-global.pico-interactive.com/community/post/7172825319102939142](https://developer-global.pico-interactive.com/community/post/7172825319102939142)

Btw, since you were able to contact the Pico devs directly, do you think you could forward them this issue as well? It’s a pretty big issue when it comes to WebXR in the Pico browser.

---

<div class="post-metadata">

**Author:** ![ThorstenBux](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/thorstenbux/32/10286_2.png) [@ThorstenBux](https://discourse.threejs.org/u/ThorstenBux)\
**Post date:** [June 30, 2023, 2:11am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/13 "2023-06-30T02:11:44Z")

</div>

Similar issue on VisionOS simulator: [VideoTexture playback (HTML5 VideoElement) Apple Vision Pro Simulator in VR mode not playing](https://discourse.threejs.org/t/videotexture-playback-html5-videoelement-apple-vision-pro-simulator-in-vr-mode-not-playing/53374)

---

<div class="post-metadata">

**Author:** ![CelestineOverflow](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/celestineoverflow/32/47792_2.png) [@CelestineOverflow](https://discourse.threejs.org/u/CelestineOverflow)\
**Post date:** [May 15, 2024, 12:21am UTC](https://discourse.threejs.org/t/video-texture-no-longer-updating-after-entering-webxr-mode/43068/14 "2024-05-15T00:21:35Z")

</div>

if someone else has the same issue but with a image texture that is being updated u can do as follows:  
html

```javascript
<img id="video" src="https://localhost:8080/my_camera" crossOrigin="anonymous" style="display:none" />

```

js

```javascript
const imgElement = document.getElementById('video') as HTMLImageElement;
		const ltexture = new THREE.VideoTexture( video );
        ltexture.colorSpace = THREE.SRGBColorSpace;
		ltexture.needsUpdate = true;
		const lgeometry = new THREE.PlaneGeometry(1.6, .9);
		const lmaterial = new THREE.MeshBasicMaterial({ map: ltexture });
		lplane = new THREE.Mesh(lgeometry, lmaterial);
		lplane.position.set(0, 0, -1);
		scene.add(lplane);

```

on every render cycle

```javascript
lplane.material.map.needsUpdate = true; 

```

that did the trick for me
