Why doesn't the WebXR Gui appear on desktop browser but it did for the older WebVR examples?

I have questions about the little icon (looks like a headset or pair of glasses) that appears in the lower right hand corner of the screen for WebVR/WebXR experiences. (I think that thing is called the gui?).

Here are my findings:

When viewing Babylonjs legacy WebVR examples in playground:

  • and using desktop/laptop Chrome browser:
    • I see GUI ICON --> and to my pleasant surprise, clicking on the icon shows stereoscopic (side by side) view masked like a pair of binoculars.
  • when using Oculus Quest browser (should also be chromium based):
    • I see GUI ICON, BUT… clicking on it in the headset shows me a binocular mask on a flat canvas in space, but does NOT bring me into immersive experience and moving my head around does not seem to influence the camera. Maybe because webVR is deprecated?

When viewing Babylonjs WebXR examples (playground)

  • when using desktop/laptop Chrome browser:
    • I do NOT see the gui, no gui to click on. Not seeing a gui here was unexpected because, coming from A-frame, the little GUI is always present.
  • when using Oculus Quest:
    • I DO see the gui, clicking on it behaves as expected in immersive mode. This is actually the only mode I care about. I’m just curious about if the change in behavior with the appearance of GUI on desktop version and if difference between WebXr and WebVr was deliberate.

The GUI doesn’t show if WebXR is not available in the browser you are using. Is your chrome WebXR-ready (emulator or device connected)?

Oh, and - WebXR does not fallback to stereoscopic mode, we recommend using the WebXR emulator for testing

I haven’t looked into an emulator, that’s new to me, I’ll check it out. Nor have I tried connecting a headset to my laptop, I have the Oculus Quest (wireless) so normally I run a server on localhost and then visit the site from within the Oculus quest browser (I have to go through ngrok since WebXR requires https). I was just using Chrome browser on my macbook pro. I believe it’s Webxr ready. According to the docs:

After calling this and assuming the browser supports XR, you will see the Enter-XR GUI on the bottom right of the screen unless the browser does not support XR . The GUI will not be displayed. To check if the default experience helper initialized correctly, make sure the baseExperience variable was created:

var xrHelper = await scene.createDefaultXRExperienceAsync( /* optional configuration options */ );
if (!xrHelper.baseExperience) {
    // no xr support
} else {
    // all good, ready to go
}

But in the console.log on my laptop I can see that it goes down the “all good, ready to go” path, so I was surprised to find that no GUI shows up.

the experience helper will be initialized, so you will anyhow go to the all good part. the GUI won’t. The experience helper will throw an exception if you try going into an xr session thou. And you can check for XR availability using the session manager’s IsSessionSupportedAsync to be sure XR is available.