Meta Immersive-Web-Emulator can not enter WebXR when the threejs release > r172

[odysseyjason]

Description

The Immersive-Web-Emulator extension from Meta for desktop Chrome browser can not enter a WebXR session in debug Developer Tools with the polyfill active and code using a threejs import version greater than r172.

Here are Codepen's using the WebXR Dragging Example to isolate the issue at just the import for threejs version change from r172 to r173
threejs@r172 - WebXR Emulator Working - webxr dragging example
threejs@r173 - WebXR Emulator NOT Working -webxr dragging example

the error in console with r173 and newer is:

three.module.js:12906 Uncaught (in promise) TypeError: Failed to construct 'XRWebGLBinding': parameter 1 is not of type 'XRSession'.
at WebXRManager.setSession (three.module.js:12906:18)
at async onSessionStarted (XRButton.js:15:5)

Reproduction steps

1. use just the code from the threejs examples, webXR dragging on a Chrome Browser with Meta WebXR Emulator extension installed
2. set the import to r172 and the webxr session can be started using the Meta WebXR Emulator
3. set the import to r173 and the webxr session can NOT be started using the MetaWebXR Emualtor

Code

<script type="importmap"> { "imports": { "three": "https://cdn.jsdelivr.net/npm/three@0.173.0/build/three.module.js", "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.173.0/examples/jsm/" } } </script>

vs

<script type="importmap"> { "imports": { "three": "https://cdn.jsdelivr.net/npm/three@0.1720/build/three.module.js", "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.172.0/examples/jsm/" } } </script>

Live example

• Threejs WebXR Dragging Example - WebXR Emulator CAN enter WebXR session when threejs@r172
• Threejs WebXR Dragging Example - WebXR Emulator CAN NOT enter WebXR session when threejs@r173

Screenshots

No response

Version

173

Device

Desktop

Browser

Chrome

OS

MacOS

[Mugen87]

There was an issue in context of immersive-web-emulator but it should be fixed via #30319.

Can you please set a breakpoint at below line and tell us how the boolean ends up in the emulator?

three.js/src/renderers/webxr/WebXRManager.js

Line 403 in b62351b

const useLayers = typeof XRWebGLBinding !== 'undefined' && 'createProjectionLayer' in XRWebGLBinding.prototype;

[Mugen87]

I have just tried the extensions in Chrome Canary and both codepens work as expected. I see no runtime errors in the browser console.

As a test, I've also verified webxr_xr_cubes which is using the latest release. No issues as well.

Can you try it with Canary?

[odysseyjason]

I just downloaded a fresh install of Chrome Canary and did not have the problem I reported with the WebXR Emulator.

I went back to my regular chrome browser, disabled all extensions except the Immersive Web Emulator, and updated the browser to latest and still had the issue.

Then I checked reset chrome://flags and reset them all to default and the Immersive Web Emulator extension worked without any issues.

I sequentially turned back on the only two flags I had previously enabled and discovered the problem is with this one:

Experimental Web Platform features
Enables experimental Web Platform features that are in development. – Mac, Windows, Linux, ChromeOS, Android

#enable-experimental-web-platform-features

Disabling this flag allows the Immersive Web Emulator to function correctly.

Thank you both for helping me find the problem so patiently!!!

[Semro]

@Mugen87 issue reproduces with the same error using threejs r179
Resetting all chrome flags didn't make any changes.

r179 (not working)
r178 working

Chrome Canary (Version 141.0.7350.0 (Official Build) canary (64-bit)) gives "Aw, snap!" error on those examples, but webxr_xr_cubes gives the same error: parameter 1 is not of type 'XRSession'

console output

webxr-polyfill.js:34048 [Immersive Web Emulator] native WebXR API successfully overridden
zxvEjwv:1779 Unrecognized feature: 'bluetooth'.
zxvEjwv:1779 Unrecognized feature: 'language-model'.
zxvEjwv:1779 Unrecognized feature: 'web-share'.
webxr-polyfill.js:34048 [Immersive Web Emulator] native WebXR API successfully overridden
zxvEjwv:1 <meta name="apple-mobile-web-app-capable" content="yes"> is deprecated. Please include <meta name="mobile-web-app-capable" content="yes">
webxr-polyfill.js:4455 The optional feature 'bounded-floor' is not supported
webxr-polyfill.js:4455 The optional feature 'layers' is not supported
webxr-polyfill.js:4455 The optional feature 'depth-sensing' is not supported
three.module.js:13271 Uncaught (in promise) TypeError: Failed to construct 'XRWebGLBinding': parameter 1 is not of type 'XRSession'.
    at WebXRManager.setSession (three.module.js:13271:18)
    at async onSessionStarted (XRButton.js:38:5)
WebXRManager.setSession @ three.module.js:13271
await in WebXRManager.setSession
onSessionStarted @ XRButton.js:38
Promise.then
button.onclick @ XRButton.js:93