My ionic application starts flickering black screen when video enters into the screen. I’m using html5 video tag in ionic 4. Any help would be great Thanks in advance.
video link of the issue : https://lh3.googleusercontent.com/XL-mNnKdyqfjaSX41cRokvJe6_O02b72eEbc6Bz7tWQc4Qz8Qimx94eC8x4sRRz7nWccN56crwsSKA=m37
Ionic:
Ionic CLI : 5.4.6 (C:\Users\TRIO\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : @ionic/angular 4.11.8
@angular-devkit/build-angular : 0.801.3
@angular-devkit/schematics : 8.1.3
@angular/cli : 8.1.3
@ionic/angular-toolkit : 2.0.0
Cordova:
Cordova CLI : 9.0.0 (cordova-lib@9.0.1)
Cordova Platforms : android 8.1.0
Cordova Plugins : cordova-plugin-ionic-keyboard 2.0.5, cordova-plugin-ionic-webview 4.1.3, (and 22 other plugins)
Utility:
cordova-res : 0.8.1
native-run : 0.2.9 (update available: 0.3.0)
System:
Android SDK Tools : 26.1.1 (C:\Users\TRIO\AppData\Local\Android\Sdk)
NodeJS : v12.11.1 (C:\Program Files\nodejs\node.exe)
npm : 6.11.3
OS : Windows 10
My users have been encountering this as well. A few notes:
- I am running PhoneGap; this appears to be a Cordova-wide issue.
- Specifically, it appears to be associated with Cordova Android 6.1.3 to 8.1.0 (your version), as it immediately started appearing for existing users when they upgraded the app from our Cordova Android 6.1.2 version to an upgraded Cordova 9.0 version.
- Haven’t yet isolated it to a specific Chrome or Android version (it appears to exist on Android 9 and 10, at a minimum). I suspect that it is related to the latest Chrome version since I haven’t this post is the only instance of this error that I’ve seen on the internet so far.
Would love to see if we can knock this issue out together; if anyone else has any thoughts that would be awesome
Cordova:
Cordova CLI : PhoneGap 7.0.0
Cordova Platforms : android 9.0.0
Cordova Plugins :
c.fovea.cordova.purchase
com.hutchind.cordova.plugins.streamingmedia
com.phonegap.plugins.videoplayer
com.rjfun.cordova.plugin.nativeaudio.NativeAudio
cordova-plugin-device
cordova-plugin-dialogs
cordova-plugin-googleplus
cordova-plugin-health
cordova-plugin-inapppurchase
cordova-plugin-splashscreen
cordova-plugin-whitelist
de.appplant.cordova.plugin.local-notification
nl.x-services.plugins.socialsharing
org.apache.cordova.inappbrowser
org.apache.cordova.network-information
System:
Android SDK Tools : 30.0.1
NodeJS : v14.5.0
npm : 6.14.5
OS : MacOS 10.15.4
Great! I’ve posted on the thread as well, thank you for filing this
1 Like
After experimenting with cordova, capacitor and iframe tag we understood that the issue was associated with video loading and rendering. Android system webview, a system component powered by Chrome that allows Android apps to display web content was causing this issue.
Most Samsung mobiles got automatically updated to the latest version of Android system webview.
It’s latest update caused this issue. Other mobile phones which also got updated to the latest version of Android system webview had the issue. Uninstalling it eliminated the video blackout/flickering issue in our application. I hope this resolves your issue too.
We are yet to find a solution for this issue in the code side. In the mean time what we have found is by August 25th there will be stable release in Chrome and Android system webview. In version 85 this issue will be resolved.
Hi VigneshBalakrishnan,
Thanks for your answer, could you provide any official sources of where you got those infos ?