Bug in interaction between A-Frame, Vimeo and iOS18 Safari

[Fishbonecreek]

Hi,

I am experiencing a very specific bug when using video links served by Vimeo toward A-Frame 1.6.0 running on iOS 18 Safari browser.

I am submitting this same bug report to both Vimeo, A-Frame and Apple because it is beyond my developer knowledge to understand where the problem lies here. I don’t know the A-Frame internals, which player or player part uses or effectively render the pixels, I don’t know at which level A-Frame and the Vimeo link served interact, I don’t know what changed in Safari between the iOS17 and iOS18 version, etc.

I was able to reproduce the bug here:

https://glitch.com/~debugvideosphere

If you check the source, you can see that I try to open, in sequence:

• an HLS 360 video from Vimeo (a “grotta azzurra” video)
• the same video at a fixed resolution, also from Vimeo
• a default 360 video hosted on Bitmovin CDN

on an iPhone running iOS18 AND opening this app with the Safari browser, the Vimeo links will fail to open and the video source will fall back to the Bitmovin video.

so:

On iOS 17 everything will work with both Safari and Chrome
On iOS 18 AND Chrome it will work.
On iOS 18 AND Safari it will NOT work.

• I checked the “all audiences content” on Vimeo, being warned that some players could have problems in opening videos without that information set.

• I tried with other videos from Vimeo and the problem remains, so it seems related to how Vimeo serves the link and/or A-Frame interprets that link.

• I can reproduce videos correctly in A-Frame loading them from other sources apart from Bitmoving (i.e, Github Pages)

• obviously, all the videos served from Vimeo work perfectly when opened directly from the links in both Safari and Chrome on iOS 18 (and everywhere else, for what it matters).

Hope someone can sort this out, even if obviously everybody here can say “my part works with third party stuff”.

Thanks,
Aaron

PS: referring #5603 , maybe this adds something...

[mrxz]

I am submitting this same bug report to both Vimeo, A-Frame and Apple because it is beyond my developer knowledge to understand where the problem lies here.

The first step would be identifying where things go wrong. Does the video also play through the <video> element on the page (without A-Frame)?
If not, then the problem happens before A-Frame even gets a chance to do anything with the video.

On iOS 18 AND Safari it will NOT work.

What does 'NOT work' mean exactly? Is there any error in the dev console and/or network tab?

[Fishbonecreek]

hi @mrxz ,

The first step would be identifying where things go wrong. Does the video also play through the <video> element on the page (without A-Frame)? If not, then the problem happens before A-Frame even gets a chance to do anything with the video.

Well, I didn't bother to test it in a normal <video> tag, it would be quite a mess if Vimeo would serve a not-working link given that is exactly their core business :)

Anyway, yes, everything works as expected in a <video> tag:

https://glitch.com/~debugvideosphere2

same sources, copy-and-pasted as the flawed https://glitch.com/~debugvideosphere example, and the videos from Vimeo do work as expected here.

On iOS 18 AND Safari it will NOT work.

What does 'NOT work' mean exactly? Is there any error in the dev console and/or network tab?

That is exactly why I am here. The bug exibits ONLY on iOS18 (i.e, running on an iPhone) and Safari, and I have little or no experience at all in web development, leave it alone in remote debugging on devices...

thanks, later
Aaron

[dmarcos]

@Fishbonecreek would be very useful if you can debug and provide more info. You just have to plug your phone to a mac and use Safari to debug the same way you debug on desktop. Consider people are volunteering their time to help you out. The easier you make it the more effective the help.