VR not appear when apply it

I applied the VR view in my code by adding this code

renderer.xr.enabled = true;
renderer.xr.setReferenceSpaceType( 'local' );
document.body.appendChild( VRButton.createButton( renderer ) );

The VR view is enabled on my computer, I tried the examples of three.js.

But I get these bugs with gray page :

alai na


  1. These aren’t bugs / errors.
  2. These are just logs from Grammarly, likely 100% unrelated to what you’re coding.
  3. What do you mean by “VR view is enabled on my computer” ? You need an VR device (ex. Meta Quest 2 / 3) to use VR.

Hi @mjurczyk
I noticed above that I tried the examples of webxr in Google Chrome and it worked well, but when I tried to add the feature to my code, it was not working, and I got this error, I don’t know why!

This example from three.js examples In google chrome :

You did import VRButton, didn’t you?

import { VRButton } from 'three/addons/webxr/VRButton.js';

Hi @PavelBoytchev

I already imported it by script tag, and the button of VR view appeared.

Any answer :slight_smile:

Without a live example that can be edited and debugged, it will be just a blind guess. It could be anything, including a wrong position of the camera (because camera positioning in VR differs from non-VR).

My only suggestion is to try to figure out whether nothing is shown because of a bug, or because the image is out of the visible area.

You can also clone one of the official examples and check whether it works locally. Then, if it works, replace the scene with your scene.