VR mode not working on iOS devices

[tomasbrownnz]

Description:

• A-Frame Version: 1.3.0
• Platform / Device: iPhone 11 Pro - iOS 15.3.1 - Safari (latest)
• Reproducible Code Snippet or URL: Link

A blank white screen is showing on mobile and tablets trying to access VR mode on personal projects and A-Frame examples. Image shows console logs that are being thrown when this issue is replicated.

[rsiqueira]

I also have this problem (blank screen when using A-FRAME VR mode in iphone). I see that previous version (e.g. 1.1.0) works partially, but I need to use it with the most recent version.

Thanks.

[EricRorich]

same problem here http://quantumscans.de/gallery/loewe/loewe.html

Problem occurs on iPhone 11, IOS 15.3.1 with the newest Cardboard app installed in Safari, Firefox and Google Chrome (newest versions respectively). And other apple devices.

[shabarito]

AFRAME uses THREE.js WebXRManager or WebVRManager for VR. But as the XR is becoming more acceptable and defined on the browsers, VR is receiving less attention. IOS uses WebVRManager as navigator.xr is not available yet.

On the last AFRAME update (1.3.0) and THREE recent updates some functions became classes. This happened to EventDispatcher And also, some changes implemented for WebXRManager broke WebVRManager.

The first error is because EventDispatcher became a class and does not have enumerable methods anymore. Therefore, Object.assign between WebVRManager and EventDispatcher do not work.

To fix it, you can copy the EventDispatcher function from an older THREE version and replace it on aframe 1.3.0 . It looks something like this.

Or you can replace/add this just after WebVRManager.

For the other errors, this.render inside WebGLRenderer function was changed. Noting is being passed to the xr.getCamera function. This leads to the camera errors.

But, WebVRManager requires the camera on that function.

Adding the camera on this.render, fixes the problem. And, I believe this change does not break anything else, as WebXRManager does not use it.

@dmarcos is this something that can be officially added to allow CDN usage again?

[vincentfretin]

@shabarito If you figured out all the changes needed and you have it working, you probably should create a PR to have further discussion on it and have a chance for the changes to be merged.

[shabarito]

Thanks @vincentfretin. I am new to GIT. This was my first PR. I think I did everything correctly.

[vincentfretin]

Don't worry, we all did our first PR at one point. :) When you create a PR, it's nice to reference the issue. Here the PR you created is #5102

[dmarcos]

This has been fixed in master by https://github.com/aframevr/aframe/pull/5102 Can reopen if necessary.