White Screen of Death

ionic-v1
1

Hi,

I am randomly receiving the white screen of death on my iOS device. I am not able to test this through my browser because my application has bluetooth features and it needs to be able to talk to the connected device. I have tried to use the safari debugger and for the first time I was able to see the white screen while being connected to the debugger. Unfortunately there were not JS errors in the console.log. I am not sure how to debug this as I it seems to happen randomly. Any ideas or suggestions are very appreciated.

Thanks,

2

You don’t see any errors because they happen before you connect Safari Web Inspector. You can use live reload on the device with console logging to see the errors that happen on start of the app.

Read this: http://gonehybrid.com/how-to-debug-the-white-screen-of-death-in-your-ionic-app/

3

Hi @ashteya,

I was actually connected to Safari in before hand when the error occurred. In fact I had to go through a couple of screens before the error happened. There was still nothing on the console.
I have already read your blog post. I am not entirely sure if I understand this correctly. I need to run the application on my iPod itself. Will live reload work?

4

I am able to reproduce it sometimes, when clicking between two screens back and forth very quickly for a couple of times. Not sure if this is related to the transitions. The html shows this:

The body HTML shows this:

<div class="backdrop"></div><div class="loading-container"><div class="loading"><span>Loading</span><br><ion-spinner icon="lines" class="spinner spinner-lines"><svg viewBox="0 0 64 64"><g stroke-width="7" stroke-linecap="round"><line x1="10" x2="10"><animate attributeName="y1" dur="750ms" values="16;18;28;18;16;16" repeatCount="indefinite"></animate><animate attributeName="y2" dur="750ms" values="48;46;36;44;48;48" repeatCount="indefinite"></animate><animate attributeName="stroke-opacity" dur="750ms" values="1;.4;.5;.8;1;1" repeatCount="indefinite"></animate></line><line x1="24" x2="24"><animate attributeName="y1" dur="750ms" values="16;16;18;28;18;16" repeatCount="indefinite"></animate><animate attributeName="y2" dur="750ms" values="48;48;46;36;44;48" repeatCount="indefinite"></animate><animate attributeName="stroke-opacity" dur="750ms" values="1;1;.4;.5;.8;1" repeatCount="indefinite"></animate></line><line x1="38" x2="38"><animate attributeName="y1" dur="750ms" values="18;16;16;18;28;18" repeatCount="indefinite"></animate><animate attributeName="y2" dur="750ms" values="44;48;48;46;36;44" repeatCount="indefinite"></animate><animate attributeName="stroke-opacity" dur="750ms" values=".8;1;1;.4;.5;.8" repeatCount="indefinite"></animate></line><line x1="52" x2="52"><animate attributeName="y1" dur="750ms" values="28;18;16;16;18;28" repeatCount="indefinite"></animate><animate attributeName="y2" dur="750ms" values="36;44;48;48;46;36" repeatCount="indefinite"></animate><animate attributeName="stroke-opacity" dur="750ms" values=".5;.8;1;1;.4;.5" repeatCount="indefinite"></animate></line></g></svg></ion-spinner></div></div><iframe src="gap://ready" style="display: none;"></iframe></body>

5

Did you ever find the problem?

6

Yes, You need to set the below into your app.js specifically in the app.config. Hope this helps.

$ionicConfigProvider.views.swipeBackEnabled(false);

Full code:

app.config(['$httpProvider', '$ionicConfigProvider', function ($httpProvider, $ionicConfigProvider)
{
    $ionicConfigProvider.views.swipeBackEnabled(false);
}]);