Search code examples
androidgoogle-chromehomescreenprogressive-web-apps

How can you debug "add to home screen" on Chrome on android?

I am trying to add an internal web application to the homescreen of an android device for testing. This should be as a real chrome-wrapped web app with full screen, custom icon, etc.

But it doesn't work, and I see no ways of debugging/troubleshooting the problem.

The manifest is added and linked. The server is on an IP address, non-standard port and with a self-signed SSL certificate - could any if these details be the problem?

Any help on getting this to work, would be much appreciated!

Solution

  • There are couple of ways that you can test to see if you have the configuration correct.

    • Use Mounir Lamouri's Manifest Validator to see if there are any obvious errors
    • Check Chrome Dev tools.
      • Chrome will always attempt to download the manifest and the icons if they are found (via link rel=manifest) and you have a service worker
      • If you don't have a service worker, manually do an "add to homescreen" from Chrome on Android (whilst you are connected via USB debugging see chrome://inspect) and you will see it fetch the manifest.

    manifest being downloaded

    If you don't see the manifest being downloaded then it is very likely that your page is mis-configured so ensure that you have a <link rel="manifest" href="{url to your manifest}"> in your page