Geek Answers Handbook

How to return the "Add to Home" banner for a progressive web application after removing the icon from the main screen?

The reason - I created the Progressive web app open in the browser - everything is in order, and the browser suggested that I add it to the main screen.

Now I want to demonstrate this at a presentation, and therefore - removed the icon from the main screen. But over the last whole day, I played a lot with the website in chrome, and the banner never appeared.

Is this really a once in a lifetime thing? Or do I need something specific?

+7
progressive-web-apps
source share
2 answers

An invitation to install the application is usually displayed after you have visited the site at least twice, at least 5 minutes between each visit. Using the Chrome flag, you can bypass these checks so that the banner always displays on every visit:

  • Open Android Chrome.
  • Go to chrome://flags/#bypass-app-banner-engagement-checks
  • Click Enable
  • Click Disable Now

You can also simulate the Add To Homescreen event from Chrome DevTools:

  • Open Android Chrome on your phone and go to https://paperplanes.world (PWA).
  • Connect to your Android using a USB cable.
  • On the Chrome DevTools desktop, select Menu> Advanced Tools> Remote Devices . OR CTRL SHIFT P (or CMD SHIFT P for macOS) and enter “Remote Devices”.
  • Select your phone by name.
  • Click the Inspect button next to the Paper Plans list item.
  • In the new DevTools pop-up menu for Paper Planes, go to the Application panel and click Add to the main screen . This should lead to the installation application banner in Android Chrome. Please note that the banner will not appear in the Chrome DevTools screen mirror.

(the steps above with Chrome 55 on MacOS Sierra and Android Chrome 57)

+11
source share

I found another solution - when I go to the chrome mobile settings and select History → Clear browsing data and click the Clear Data button - after that I get the app install banner again to add the application to the home screen.

Apparently - it cleans not only the data, but also makes the browser forget everything about this website.

(Strange - the old icon does not disappear ... so now I have several icons on the main screen: D ...)

+4
source share

More articles:


All Articles