createDefaultVRExperience() + Android Chrome + VR Mode + change material => unusual error

I’m seeing an unusual error when using createDefaultVRExperience(). I load a babylon scene exported from Blender. The scene contains many objects, including a sky sphere named “skybox”. After loading in the scene, I want to change the materials on some of the imported objects.

The scene looks fine on desktop and in an HTC Vive. It also looks fine when I view it on my Android phone in Chrome, as long as I don’t enter VR mode by clicking on the goggles.

If I change the material on the skybox and then click on the goggles, I get the following error in the javascript console:

In the Android Chrome browser itself, this error appears:

BUT, if I change the material on any other object in the scene, it works great even after I click on the goggles icon.

To illustrate the problem, I created this playground: https://playground.babylonjs.com/#MVXR2J#17

If you set showError to true, it will change the material on the skybox to trigger the error. If set to false, it will change the material on another object (“ER_distant”), which doesn’t cause the error.

Much thanks for any help you can offer!

Pinging @trevordev

Thanks for the playground/screenshots, I see that an object is null but I’m not sure how modifying a material could do that. I’m trying to get my hands on a native webVR capable android device to debug. I should have a fix today or tomorrow.

@Jacob_Durrant I am trying in chrome on a pixel 3. When trying with/without showError set to true I am seeing the same error. So far it looks like chrome has changed their webVR implementation as when testing threejs or aframe, neither succeed to enter daydream VR mode. And using the stable version of babylon the same issue occurs as it seems that the vr frame data is not populated. I’m pretty sure this used to work in the past so I’m leaning to this being a chrome issue. One thing to note is that if you move the createVRExperience call prior to the loaded model callback babylon will use its webVR fallback instead of daydream mode webvr.

I checked chrome://flags and webvr was disabled even though it was still allowing babylon to enter the daydream vr mode as shown in your picture. If you try updating you phone to the latest update, go to about://flags and enable webvr and restart chrome it looks like your playground will work. If this page works I believe Babylon will too 00 - Hello WebVR!

Much thanks for your help. I can confirm that my playground code works when I turn on the WebVR flag. Unfortunate that this isn’t on by default. Hopefully future versions of Chrome will fix that.

I can also confirm that the scene works even if WebVR is not turned on, as long as I run the scene.createDefaultVRExperience(); line before loading the babylon file, like this: https://playground.babylonjs.com/#MVXR2J#20

In my project, I’ve been running scene.createDefaultVRExperience(); after loading the babylon file because I want my VR-headset camera to start from the location/orientation of the camera described in the babylon file. Is there a good way to set the location/orientation of the helper camera to match that of another camera that is loaded later?

Thanks again.

@Jacob_Durrant, I believe the active camera is used when entering webVR so after loading what you need to load, set scene.activeCamera to the loaded camera, let me know if you don’t see that working.

Another option is to use vrHelper.teleportCamera and specify the position of the feet for the user where you want the camera to be at.

Hi @trevordev. Much thanks for your help with all this! Sure enough, simply setting the camera from the babylon file to the activeCamera worked perfectly. All the best.

2 Likes