Videosphere not working with Cordova/Capacitor JS

[dchan38098]

Description:

I've created a simple vr app using Cordova following the guidelines on your website but when I click on the VR button I get this error:

webvr-polyfill.js:382 Uncaught (in promise) TypeError: Failed to execute 'exitFullscreen' on 'Document': Document not active
    at O (webvr-polyfill.js:382)
    at webvr-polyfill.js:3039
    at new Promise (<anonymous>)
    at w.v.requestPresent (webvr-polyfill.js:2953)
    at HTMLElement.value (a-scene.js:337)
    at i.onEnterVRButtonClick (vr-mode-ui.js:72)
    at bind.js:12
    at HTMLButtonElement.<anonymous> (vr-mode-ui.js:193)

and then all I see is a grey screen behind the VR canvas. When I try to exit VR mode the video disappears altogether.

• A-Frame Version: 1.2.0
• Platform / Device: Android
• Reproducible Code Snippet or URL:

[dmarcos]

AFAIK, the WebXR API is not available in Cordova. A-Frame defaults to the polyfill in that case. Make sure the fullscreen API is available / enabled. I have no experience working with Cordova so I don’t know if that’s the case.

[dchan38098]

@dmarcos Thank you for your reply, my friend. I'm aware that it uses the polyfill as well. The confusing part is that all the components of Aframe work. It's only when I use the Videosphere. Is there a specific way to check whether the fullscreen API is available/enabled? or is there a non-minified version of Aframe where I could modify the webvr polyfill code slightly to see if it helps?

[dmarcos]

Do the other examples work fine? https://aframe.io/aframe/examples/

Does the videosphere work as expected in your device in a regular browser (non cordova)?

[dchan38098]

Sorry for the delayed reply. The examples work, apart from the Videosphere of course.

Actually, it does work in the browser as expected. Just not when it's built within a Cordova application.