<video-360> demo doesn't start to play on old iPhon and iPod touch

MozillaReality / immersive-custom-elements

Immersive Custom Elements

https://mixedreality.mozilla.org/immersive-custom-elements/examples/index.html

Mozilla Public License 2.0

134 stars 8 forks source link

<video-360> demo doesn't start to play on old iPhon and iPod touch #66

Closed takahirox closed 4 years ago

takahirox commented 4 years ago

From #60

It seems on some mobile browsers <video-360> (demo) doesn't start to play. I haven't checked any console errors yet. The platforms I ever confirmed are

iOS (iPod touch) + Safari
~Android (Galaxy S8+) + Firefox~ (Update: Resolved)

takahirox commented 4 years ago

Investigating on Android (Galaxy S8+) + Firefox. No console error. It seems 'canplaythrough' event isn't fired.

takahirox commented 4 years ago

It seems the issue is resolved on Android (Galaxy S8+) + Firefox but still the video doesn't start to play on iOS (iPod touch) + Safari. ~I open another issue as iOS + Safari specific issue.~

takahirox commented 4 years ago

I don't have platform where I can debug on iOS + Safari. I need help.

takahirox commented 4 years ago

I can reproduce this problem even on iOS + Chrome. Maybe (mobile?) iOS specific issue regardless of browsers.

takahirox commented 4 years ago

I can reproduce this problem on iPad + Safari.

takahirox commented 4 years ago

It seems 'canplaythrough' event isn't fired on my iPod touch + Safari/Chrome. I tried browserstack, but no error log in the console...

takahirox commented 4 years ago

I can reproduce this problem on iPad + Safari.

iPad + Safari/Chrome works now, not sure why tho. Seems like I did some misoperations?

takahirox commented 4 years ago

but no error log in the console...

I should've set error event listener, not seeing console log. So, error event is fired with error code 4. Error code 4 is

https://developer.mozilla.org/en-US/docs/Web/API/MediaError/code

MEDIA_ERR_SRC_NOT_SUPPORTED	4	The associated resource or media provider object (such as a MediaStream) has been found to be unsuitable.

I converted the mp4 video to ogg, and webm but I still see the same error. Hm...

takahirox commented 4 years ago

I've done further investigation. iPod touch/iPhone may not accept huge file size video or high resolution video.

On this site http://www.videosmaller.com/, I tried to reduce the video file size/resolution.

Original video file 29.2MB 3840x1920 doesn't work
File size reduced video file 5.5MB 3840x1920 doesn't work
File size and resolution reduced file 670KB 1024x512 works

So reducing them may be a solution but video quality becomes bad. Users may have worse experience, Hm..

Update: I tried iPhoneX and iPhone 6s on browserstack. canplaythrough event is fired with the original video on iPhoneX but isn't fired on iPhone6. And my device is iPod touch 6th. This issue may occurs only on old mobile iPhone/iPod touch. Feeling like lowering the priority of solving this issue...