iOS Video playsinline not always playing inline in cordova app

Question

Seems like there's a bug in safari web view that causes the video to not play inline under certain circumstances. Rebooting the device solved the issue.

Has anybody seen this before? Is there a way to fix? If not, is there a way to detect a video going full screen and abort it?

Answer 1

I had the same issue, resolved by adding playsinline and webkit-playsinline to the web app's <video> tag:

<video src="foo.mp4" playsinline webkit-playsinline />

This is a fix introduced by Apple. For iOS 10+ devices, playsinline is sufficient. For iOS 8 and iOS 9, both tags are required. Devices below iOS8 do not support HTML5 videos.

From Safari documentation:

webkit-playsinline: Indicates that a video element should play inline instead of full-screen. Enabled only in a UIWebView with the allowsInlineMediaPlayback property set to YES.