How to programmatically start VR mode?


I know there is a VRButton.js to enter VR mode but is there a way to programmatically enter VR mode? For example a user clicks on a custom UI and after this interaction, call some function to enter VR mode instead of relying on the VRButton.js.

Also is there anyway to automatically enter VR mode on page launch? I’m going to be placing the Three JS project inside a PWA and I’m wondering whether it’s possible to have it enter into VR mode directly on app launch like other native apps on Quest.

Thank You!

Everything should be explain at the MDN: WebXR permissions and security - Web APIs | MDN

The only way to do this is the usage of requestSession() from the naigator.xr interface. The XR session you obtain can then be assign to three.js via await renderer.xr.setSession( session );. This is essentially the same code like from VRButton.

However, be aware that you can’t just start a XR session as you like. This is very restricted as explained below.

Yes, that is possible. You can start an XR session directly after a user event (like a button press) or from the startup code for a user-launched PWA.

I notice in the MDN link that it says: “If your code is executing during the launch of a web application, the runtime may consider the act of launching your web application to qualify as user intent.”

Does launching a Three JS site in Oculus Browser count as “launching a web application” if the user has granted WebXR permission before? If not is there a way to simulate this with Three JS?

No, I don’t think so. You still need a user event like a button press. This can’t be simulated so you need an event listener to process a user interaction.