Plane or Sky not visible on iOS Chrome and Firefox

[arsenik]

Description: When going into VR mode on iOS Chrome or iOS Firefox the green plane is not visible.

I found out that if you reverse order of plane and sky, then it's the sky that is not visible.

<a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
<a-sky color="#ECECEC"></a-sky>

• A-Frame Version: 1.2.0
• Platform / Device: Chrome iOS, Firefox iOS
• Reproducible Code Snippet or URL: https://aframe.io/examples/showcase/helloworld/

[arsenik]

Apparently this is because these browsers are using deprecated WebVR api.

[dmarcos]

This is a regression introduced by THREE js with https://github.com/mrdoob/three.js/pull/16287

[dmarcos]

For reference:

This commit is bad https://github.com/mrdoob/three.js/commit/03514f70f3

Parent is good https://github.com/mrdoob/three.js/commit/a539666a2b51a94024e75942c82ef9369e6000ae

[rsiqueira]

I still can not see the sky when using VR mode with iPhone. Here is the example with a simple sky: https://js.do/vr/sky.html It becomes blank when entering VR (cardboard) mode using iPhone.

[dmarcos]

It’s a regression in three as pointed above. I haven’t had time to investigate. Any help / PRs are more than welcome