I have a Cordova 9.0 hybrid app that uses HTML5 tags. On iOS, the videos work great, but on Android, they exhibit the following behavior:
- Tapping the fullscreen button on the first instance (of the app running) works as expected
- Tapping the fullscreen button on every subsequent instance does not put the video to full screen - it does result in a very quick screen flash and nothing else
- If you lock->unlock the phone - or go to home screen->reopen the app - the video shows up as full screen
- Hard closing the app->opening it restarts the cycle from #1
A few things that I do know:
- Looking at Chrome developer tools, it appears that 1) in the working instance, #top-layer is getting assigned to the video, and 2) in the broken instance, #top-layer isn't getting assigned to the video
- In a broken instance, maximizing the Notifications Drawer does not result in the video being shown full screen.
- Running video_element.requestFullScreen() and video_element.webkitRequestFullScreen() does not return any errors
- The full screen button is never disabled in any scenario
- I have not found a configuration of setSystemUiVisibility options that gets around this (including disabling functionality in CordovaActivity.java lifecycle events, as well as disabling the cordova "fullscreen" preference)
- This is the case on newer Chrome versions (not prior to Chrome 74)
- This is still the case when I've removed 100% of the html/javascript and am just operating with the below markup (based on the W3Schools HTML5 video object):
<html>
<head>
</head>
<body>
<video id="video1" style="width:600px;max-width:100%;" controls="">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>
</body>
</html>
Would love any help! Thanks for reading.