Ionic Pro Deploy White Screen after Downloaded Update

I get currently a Issue with Ionic Pro Deploy.
I deploy a Build to the Production Channel, restart the App the Update is downloading after unzipping i get a White Screen.
This Error appears only if i use the Deploy Method auto the Background Method is working fine.

Here is my XCode Log :

2017-12-15 14:42:19.931014+0100 Tets-App[5900:2080081] Zip Extraction: 99%
2017-12-15 14:42:19.966530+0100 Tets-App[5900:2080081] Zip Extraction: 99%
2017-12-15 14:42:19.999886+0100 Tets-App[5900:2080081] Zip Extraction: 100%
2017-12-15 14:42:20.002165+0100 Tets-App[5900:2080081] Version Count: 3
2017-12-15 14:42:20.003235+0100 Tets-App[5900:2080081] Excluding /var/mobile/Containers/Data/Application/4296D66F-B5FB-4886-B906-6BD9339B550C/Library/Application Support/18a05788-f741-4540-a854-bf112d9f5433 from backup
2017-12-15 14:42:20.003678+0100 Tets-App[5900:2080081] updating version label
2017-12-15 14:42:20.006734+0100 Tets-App[5900:2080081] Unzipped...
2017-12-15 14:42:20.007064+0100 Tets-App[5900:2080081] Removing www.zip 1
2017-12-15 14:42:25.038418+0100 Tets-App[5900:2080081] uuid is: 18a05788-f741-4540-a854-bf112d9f5433
2017-12-15 14:42:25.038591+0100 Tets-App[5900:2080081] ignore version: NOTHING_TO_IGNORE
2017-12-15 14:42:25.073572+0100 Tets-App[5900:2080155] Redirecting to: file:/var/mobile/Containers/Data/Application/4296D66F-B5FB-4886-B906-6BD9339B550C/Library/Application%20Support/18a05788-f741-4540-a854-bf112d9f5433/index.html?cordova_js_bootstrap_resource=/var/containers/Bundle/Application/89E3198C-4274-4F67-A9DF-A53A7C67BE6A/Tets-App.app/www/cordova.js
2017-12-15 14:42:25.073770+0100 Tets-App[5900:2080081] Reloading the web view.
2017-12-15 14:42:25.077837+0100 Tets-App[5900:2080081] Resetting plugins due to page load.
2017-12-15 14:42:25.096566+0100 Tets-App[5900:2080081] Failed to load webpage with error: The operation couldn’t be completed. (NSURLErrorDomain error -999.)
2017-12-15 14:42:25.097035+0100 Tets-App[5900:2080081] Resetting plugins due to page load.
2017-12-15 14:42:25.173229+0100 Tets-App[5900:2080081] Finished load of: file:///var/mobile/Containers/Data/Application/4296D66F-B5FB-4886-B906-6BD9339B550C/Library/Application%20Support/18a05788-f741-4540-a854-bf112d9f5433/index.html?cordova_js_bootstrap_resource=/var/containers/Bundle/Application/89E3198C-4274-4F67-A9DF-A53A7C67BE6A/Tets-App.app/www/cordova.js
2017-12-15 14:44:33.288995+0100 Tets-App[5900:2080081] THREAD WARNING: ['IonicCordovaCommon'] took '41.830078' ms. Plugin should use a background thread.
2017-12-15 14:44:33.302752+0100 Tets-App[5900:2080081] deviceready has not fired after 5 seconds.

Have Anyone the same Issue ?

I updated cordova-plugin-ionic to the latest Version but i still get the white Screen.
I also tried the Deploy Method Background but also get a White Screen.
Same on Android.
I try now Deploy Method None to implement my own Update logic.

I forgot to say I’m using Ionic v1.

1 Like

Android Console Ouput:

I/IONIC.DEPLOY.EXTRACT: Progress: 85%
I/IONIC.DEPLOY.EXTRACT: Progress: 86%
I/IONIC.DEPLOY.EXTRACT: Progress: 86%
I/IONIC.DEPLOY.EXTRACT: Progress: 86%
I/System.out: [rm, -r, /data/user/0/de.karls.direktmarketerapp/files/www.zip]
I/System.out: null
I/System.out: null
I/System.out: Calling by::className:com.ionicframework.deploy.IonicDeploy  MethodName:unzip
I/IONIC.DEPLOY.REMOVE: Removed www.zip
I/HwSecImmHelper: mSecurityInputMethodService is null
I/HwSecImmHelper: mSecurityInputMethodService is null
I/HwSecImmHelper: mSecurityInputMethodService is null

Have you fixed that or found any workaround? I am having exactly the same issue

No the Problem is still not fixed

By debugging the app at all possible stages I figured out what is going on and created a bug report for ionic team at zendesk.
I am having ionic 1 project with following files structure:
www/
—js
—templates
—fonts
—css
—img

—lib
Inside lib folder i have libraries installed through bower. Like angular, moment, etc.
These files are linked in index.html = script src=lib/moment/min/moment.min.js

What happens is that after auto update is delivered and unpacked these files are not loaded or not accessible. I have 404 for them. This causes to have a white screen - the angularjs - core library file cannot be loaded.
I believe that’s the issue at ionic pro side and it has to be fixed. Files from /www folder must be present in the location they actually are and can be accessed.

I am still waiting for response from ionic team on the bug report if they can come up with any relevant workaround.

NOTE: Indeed, this happens only with files that are in sub directories of lib/ folder.
So if you link script src=“lib/moment/min/moment.min.js” - will not work after update is delivered.
BUT if you put them like this script src=“lib/moment.min.js” then the files will be loaded to cordova browsers and app will work. This is my assumption and this is what I see for files that are just under the lib/ folder. Still I want to get the answer from ionic team since I pay for pro service and I do not want to mess with my project structure or bower/gulp.

So, the issue is solved with help of Ionic team.
The problem was that my necessary project files were installed with bower(ionic v1.) and thus the contents of lib/ directory was in .gitignore file. So that, when the auto update was delivered, the app could not load necessary files in index.html. like angular.js. This caused white error page.

I just added all the internals file to git repo and removed lib/ folder from .gitignore - that’s what Ionic team proposed to do - and it worked out.

The new deploy process uses git to deliver updates on the devices. So it is pretty natural it follows .gitignore file rules.

3 Likes

Ok, Thank you much for finding out :wink:
Makes sense with the .gitigignore File.
Thanks as well to the Ionic Team.
I tested and it works.

This took me hours of searching to find! I think this needs to be higher up in the docs.

I also had a “dist” folder where I was putting a concatenated version of my app.js after building. I had to make sure that was not in the .gitignore also

HI I am having the same issue in iOS after the deploy finish

2018-02-09 15:32:25.021058-0500 PMR Samp[1601:665586] Failed to load webpage with error: The operation couldn’t be completed. (NSURLErrorDomain error -999.)
2018-02-09 15:32:25.021361-0500 PMR Samp[1601:665586] Resetting plugins due to page load.
2018-02-09 15:32:25.218327-0500 PMR Samp[1601:665609] NSURLConnection finished with error - code -1100
2018-02-09 15:32:25.221174-0500 PMR Samp[1601:665609] NSURLConnection finished with error - code -1100
2018-02-09 15:32:25.223738-0500 PMR Samp[1601:665606] NSURLConnection finished with error - code -1100
2018-02-09 15:32:25.225074-0500 PMR Samp[1601:665606] NSURLConnection finished with error - code -1100

Also an Ionic 1 Project but everything inside the lib folder is in the repository, not being ignore.

Any ideas?

That’s exactly the errors I saw when my files were ignored by git.
NSURLErrorDomain error - it tries to load the page or a file that does not exists.

I would try to localize the problem by doing following:

  1. Disable all the pages of your app except start page like home or login.
    Disable all other pages by commenting them out and do not forget to comment them in index.html to make sure your app is not requesting them,
    Then make sure your application is still working via ionic serve.
    After that, upload it to the cloud again to initiate live code update and check:
  1. if it is success - then the problem is within your pages setup or any related file that pages involve.
  2. If it is still an error - then this is more likely related to the installed libraries. Then you need to make sure that everything is requested by your app - this is what is included in your index.html file is in the git and not in .gitignore

The nice option also is to install the app from git in another new folder, as if you are a new programmer who joins the project and installs the environment. This would also help you to localize the files that are probably missing i git for project to function.(important, check errors on emulators or on real devices)

I hope it helps.

1 Like

Thanks, i just found the problem.

Some dependencies having a dist folder inside, and in the default .gitignore created by the ionic cli any dist folder is ignored.