createGraphicsDevice defautls options.xrCompatible to true (#5349)

Co-authored-by: Martin Valigursky <[email protected]>

src/platform/graphics/graphics-device-create.js

@@ -1,4 +1,5 @@
 import { Debug } from '../../core/debug.js';
+import { platform } from '../../core/platform.js';
 
 import { WebgpuGraphicsDevice } from './webgpu/webgpu-graphics-device.js';
 import { DEVICETYPE_WEBGL2, DEVICETYPE_WEBGL1, DEVICETYPE_WEBGPU } from './constants.js';
@@ -24,6 +25,8 @@ import { WebglGraphicsDevice } from './webgl/webgl-graphics-device.js';
  * {@link DEVICETYPE_WEBGPU} type is added to deviceTypes array. Not used for
  * {@link DEVICETYPE_WEBGL} device type creation.
  * @param {string} [options.twgslUrl] - An url to twgsl script, required if glslangUrl was specified.
+ * @param {boolean} [options.xrCompatible] - Boolean that hints to the user agent to use a
+ * compatible graphics adapter for an immersive XR device.
  * @returns {Promise} - Promise object representing the created graphics device.
  */
 function createGraphicsDevice(canvas, options = {}) {
@@ -38,6 +41,11 @@ function createGraphicsDevice(canvas, options = {}) {
         deviceTypes.push(DEVICETYPE_WEBGL1);
     }
 
+    // XR compatibility if not specified
+    if (platform.browser && !!navigator.xr) {
+        options.xrCompatible ??= true;
+    }
+
     let device;
     for (let i = 0; i < deviceTypes.length; i++) {
         const deviceType = deviceTypes[i];