Mirror Example broken on Standalone Oculus Quest

[PlumCantaloupe]

The mirror example doesn't work on the Oculus Quest in three.js (and A-Frame 1.04 - aframevr/aframe#4629) within the Oculus Browser and Firefox Reality when in immersive mode (appears to work before VR mode is entered interestingly). I have recreated the cubes WebXR r118.dev example and added a mirror here: https://glitch.com/~pure-threejs-mirrortest which leads to the following strange behaviours:

• object parented to the camera does not move in the mirror.
• object sorting appears to be broken on the mirror.

I haven't tested this example on the Oculus Quest using the link and Firefox Desktop, but as mentioned in the A-Frame issue linked above, I imagine it is fine as those mirror examples were.

I know this worked not so long ago, so perhaps on the switch to WebXR something broke on the Quest?

Three.js version

• Dev

Browser

• Oculus Browser
• Firefox Reality
• Firefox Desktop (using Oculus Link cable)
• WebXR emulator (as noted here by @mrdoob Reflector/Refractor: Set .encoding to match renderer.outputEncoding #19666 (comment) )

OS

• Windows
• macOS
• Oculus Quest OS
• iOS

Hardware Requirements (graphics card, VR Device, ...)

• Oculus Quest 2D mode
• Oculus Quest VR mode

Quoting @mrdoob's relevant response from this issue #19666 to keep all information contained :)

object sorting appears to be broken on the mirror.

Fascinating. I can reproduce this in the Oculus Browser, but I can't reproduce when using the WebXR Emulator 🤔

It's unrelated to encoding though. Do you mind creating a new issue?

[Mugen87]

I've tested the webxr_vr_sandbox example on Oculus Browser with each release from r118 to r111 and all show the same rendering error.

https://raw.githack.com/mrdoob/three.js/r111/examples/webxr_vr_sandbox.html

When I remember correctly, this example still worked a few months ago (March/April) when I've tested all XR examples with my Oculus Quest. Can somebody test the above link with a different VR headset?

[Mugen87]

Well, the demo works with Daydream on a Pixel 1. So I guess this is a device issue. Maybe it's worth to report this to Oculus:

https://developer.oculus.com/bugs/

[mrdoob]

Indeed...

@Artyom17 For some reason, the mirror gets rendered on top of everything on the Quest 🤔

[PlumCantaloupe]

To be thorough I submitted a bug here: https://developer.oculus.com/bugs/bug/203927750864686/

Thanks everyone for looking at this. So strange :)

I'll try to poke at it some more to determine whether it is the existence of the virtual camera, or rather the rendertarget being drawn that is causing the issue. I feel it has something to do with the camera though as the active camera acts up and doesn't report appropriate world matrices breaking any entities parented to the camera itself (noted here also: aframevr/aframe#4626).

[PlumCantaloupe]

Not sure if it helps but the virtual camera doesn't seem to have anything to do with it. I can render sorting appropriately by commenting out the following lines starting at line

three.js/examples/js/objects/Reflector.js

Line 154 in 83f334b

renderer.setRenderTarget( renderTarget );

(line 169 in the ./jsm/objects/reflector.js Glitch example ):

//if I comment these lines of Reflector.js out the mirror doesn't render, but the sorting bug stops. 
//It appears switching renderTargets causes the issue. The other lines also need to be commented out to reduce motion sickness :P
renderer.setRenderTarget( renderTarget );

renderer.state.buffers.depth.setMask( true ); // make sure the depth buffer is writable so it can be properly cleared, see #18897

if ( renderer.autoClear === false ) renderer.clear();
renderer.render( scene, virtualCamera );