White Screen with WKSuspendInBackground set to false

[write2sv]

In short, the app is showing a white overlay when brought to foreground from background.

Our users are complaining about seeing the app in all white. The below steps are the only way I was able to recreate the issue. Please note that users observed this issue even without opening any external window from app as suggested in the below steps. These steps are to easily recreate the issue so that we can think of a fix.

Steps to recreate:

1. Launch the app
2. Open any external window from app. For eg: inAppbrowser or open a pdf using documentViewer/file2 plugins
3. Put the app in background
4. Wait for iOS to send a suspend signal
5. Relaunch the app. Up on dismissing the external window (for example clicking on Done button) you will see the white overlay screen on the app.

Exact recreation steps in a Video: (The phone you are seeing on the left in this video is a real device)
You can skip the video from 30 seconds to 3 minutes to save some of your valuable time :)
https://youtu.be/gryhObPDDfA
At the end of the Video observe how Chrome inspect can actually see the screen and all the html entities are in place!

Here is a sample git repository that is helpful: (This is ionic tabs starter + cordova documentViewer, fileTransfer plugins + WKSuspendInBackground set to false)
https://github.com/write2sv/whitescreen_issue_ionic

My Ionic Info:
Ionic:

ionic (Ionic CLI) : 4.1.2 (/usr/local/lib/node_modules/ionic)
Ionic Framework : ionic-angular 3.9.2
@ionic/app-scripts : 3.2.0

Cordova:

cordova (Cordova CLI) : 8.1.1 (cordova-lib@8.1.0)
Cordova Platforms : ios 4.5.5
Cordova Plugins : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.2.0, (and 7 otherplugins)

System:

Android SDK Tools : 26.1.1 (/Users/shaggy/Library/Android/sdk)
ios-deploy : 1.9.2
ios-sim : 5.0.13
NodeJS : v8.4.0 (/usr/local/bin/node)
npm : 3.10.8
OS : macOS High Sierra
Xcode : Xcode 9.4.1 Build version 9F2000

I hope some one can help me figure out where the issue is.

[ghenry22]

out of curiosity if you close the external window before sending the app to the background does the problem still occur?

A work around maybe to close any open external viewers in the lifecycle event that is triggered when the app is sent to the background. You could always open them again in the lifecycle event when app is brought back to foreground.

[write2sv]

Yes that is exactly what I am doing in my app today but my point was not about this exact scenario. Users are seeing the white screen even without opening an external window and since this is so close to their issue description this might give us a valuable clue on what's going on.

…

On Tue, Oct 9, 2018, 9:31 PM Gaven Henry ***@***.***> wrote: out of curiosity if you close the external window is the problem resolved? A work around maybe to close any open external viewers in the lifecycle event that is triggered when the app is sent to the background. You could always open them again in the lifecycle event when app is brought back to foreground. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#189 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFkarYz3bK7C51IgouN0dEZ8cvnZULeUks5ujU4GgaJpZM4XTjFr> .

[ghenry22]

@write2sv out of interest are you using any code push plugins for updating that app? I think there are currently some known issues with some of the code push plugins under certain scenarios that will also result in a white screen and am curious if this is related.

[write2sv]

Well the sample template app code I have shared in this issue does not use any code push plugins but our production app does. It uses Ionic. However it is currently turned off. May I know the scenarios in which these code push plugins may cause the White screen issue. Thanks for your input here.

…

On Fri, Oct 12, 2018, 6:51 AM Gaven Henry ***@***.***> wrote: @write2sv <https://github.com/write2sv> out of interest are you using any code push plugins for updating that app? I think there are currently some known issues with some of the code push plugins under certain scenarios that will also result in a white screen and am curious if this is related. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#189 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AFkareTvxIC9f4oOiZ5FrgomJNP6cP8Nks5ukHQfgaJpZM4XTjFr> .

[gregavola]

We see this all the time, how can we prevent the WkWebview from being suspended in the background? This doesn't happen with other apps...

[T3chTobi]

Any news here? I'm experiencing the same issue...

[giladrom]

Same here... works great on iOS 12.1 but broken on 12.2.

[factionfour]

Same here. Anyone?

[giladrom]

Don't know about you guys, but I can't afford my application to break for hundreds of users the day iOS 12.2 hits GA. I've abandoned Ionic/Cordova and am rewriting my entire app using Swift.

[T3chTobi]

I guess that's not an option for 99,9 % of the plugin users

[giladrom]

FYI this is because the plugin used a private API to facilitate background operation, which Apple finally disabled - so will probably not get fixed. The alternative is having a non-functional application.

[factionfour]

So do we abandon the wkWebView plugin? Isn’t the UIWebview deprecated in iOS 12?

[giladrom]

I can't see a path forward, at least for me:

This plugin is broken - and any other method of running in the background using Ionic 3 is broken as well since the API isn't available anymore, so Ionic 3 simply doesn't work for me once 12.2 hits.

I'm left with two options:

1. Migrate to Ionic 4. There are several issues there:

• Seems like upgrading apps with lots of dependencies and customizations takes considerable effort and incur performance penalties. In addition, no one can tell if background operation is functional with Ionic 4.

• iBeacon plugin (maybe more? can't say) is broken on Ionic 4, and the maintainer has been MIA for months.

2. Rewrite my application natively

Conclusion:
Migrating to Ionic 4 possibly means i'll have to fix and maintain broken Ionic plugins and quite possibly
implement background functionality into Ionic, and maintain it. And after all this work, Apple might pull another rabbit out of their hat and break that as well.

Both tasks seem equally as painful - but at least with native code I know for a fact everything will work, and continue working.

[T3chTobi]

I'm not using Ionic, I'm just using the ionic-webview plugin, is there a way for me to use the ionic 4 webview?

[T3chTobi]

does it work with plugin version 4.0.0 or is the white screen error occurring there, too?

[factionfour]

I'm not using Ionic, I'm just using the ionic-webview plugin, is there a way for me to use the ionic 4 webview?

I don't want to give up on cordova just yet (also not using ionic) - so I second the question.

[T3chTobi]

So is there a fix for iOS 12.2 with the ionic webview to prevent the white screen? (because we can't use WKSuspendInBackground anymore)

[giladrom]

See this issue: #293

Looks like there will not be a fix.

[mlynch]

We released several fixes for this last week. Upgrade to 4.0 if you're able to drop the webserver (and iOS 10), or use the latest 2.x if you need to support iOS 10 still. Both have a fix for this issue.

This issue got lost as it's a duplicate of several others.