Looking to get testing with Progressive Web Apps (PWA) on Google Chrome Browser? Here’s a quick guide to know how to test PWA on Google Chrome Browser. Google Chrome fire the beforeinstallprompt event to show the Add to Homescreen prompt from Chrome 68.
As to test PWA on Google Chrome, first of all make sure that you have cleared the browsing data of browser. It’s because sometimes the browser’s cache web pages for faster loading of websites, due to that the files that we needed for PWA like manifest and Service Worker won’t get loaded in this case. If you have tried any service workers or PWA’s earlier the clearing of browsing data helps to resolve that case too.
1) Tap on the Browser menu (3 dots at the top right corner of Chrome Browser)
2) From the menu tap Settings, then tap Privacy
3) Within the Privacy page at the bottom you can see Clear browsing data, tap on it.
4) Once you tap it, you can see another page with Clear browsing data options. Select the Advanced tab
5) Then select Browsing history, Cookies and site data, Cached images and files, Site settings and Media Licenses. Then tap CLEAR DELETE.
1) Make sure that you have cleared the browsing data.
2) Visit the website that you have installed PWA
3) You can see a Add to Home screen prompt from the bottom of page
4) Tap the button, instantly the web app will be added to your Home screen with the icon which you added in manifest
5) Tap the icon, then the Progressive Web App of your website will be loaded.
6) You can see the Splash Screen with the icon and background color that you set earlier upon Manifest.
7) Navigate via some of the web pages, after that disconnect the internet on your device and close the web app
8) After that tap the web app icon again, you can notice that all the pages that you viewed earlier during online can be viewed and all the pages that you haven’t viewed will showed by an Offline page that you set upon the service worker.
If your website uses any caching plugins or addon’s or extensions don’t forget to clear the cache before testing. If you are using WordPress, try “Super Progressive Web Apps” on WordPress plugin directory.
Hope the article helps to know how to test PWA on Google Chrome Browser, if anything missing please do comment below so that we can add more details and make it more helpful for others.
Followed installation instructions and am not getting icon at bottom of page. Testing on Google Chrome.
Thanks,
Chet
Good day Chet! Please do share your website URL via our contact page, so that we can check it and revert you asap.
I am having the same issue.
Hi Prabal Moudgil,
Will you please elaborate more about your issue so that we will understand and help you.
Hi, the app keeps failing and it wouldn’t open. I am not sure what to do as I followed the guide.
Hi Hamsatu Bashir,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
Followed installation instructions and am not getting icon at bottom of page. Testing on Google Chrome, my website is https://smdconference.scoe.co.za
Please let me know.
Hi Stephen Guild,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
Same problem as Chet
https://www.liguebasketmayotte.yt
Hi Julien,
Will you please elaborate more about your issue so that we will understand and help you.
Hi there, i just cant figure out why SPWA’s not working on my website : https://cirque-electrique.com/
Could you help me with this, please ?
Adrian
Hi Adrian,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
hi,
I have set all the settings but in mobile add to home screen button not shown and neither its shown in the right side of chrome install site name. I have set in my subdomains.
Rgards,
Hi Ravi J,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
When I downloaded the icon of my PWA and added to the desktop appears my icon but next to a smaller google how do I remove that ?
Hi bryan,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible
Hello
When I click “Add to home” everything works fine but the app icon is the WordPress icon and not my icon. I’ve uploaded 2 images 192×192 and 512×512 png.
How can I fix the icon?
Hi Sergio,
Please clear the browsing data and try it out again. It will resolve the issue. If you have added the PWA earlier to your phone, please don’t forget to uninstall it from the app’s list. Hope that helps.
Tienes que borrar la caché del navegador de tu móvil, ve hacia el candando junto al hipervinculo y luego borra los datos de Uso y presiona el boton borrar y restablecer y listo , lo que paso es que lo probaste apenas lo instalaste y por lo mismo guardo los iconos y demás dato predeterminados
quiero agregar a mi landing page botones y banner que inviten a descargar la PWA de mi web como puedo hacerlo
Hi Jeison,
You can use Our CTA addon to add a shortcode button. For the free version, you can use “custom element to add to home screen” in the Advance section
olá boa tarde, eu configurei tudo, limpei o cache e nada de dar certo, não aparece o pop-up para baixar atalho na área de trabalho.
https://colinadosipes.com.br
Hi Elimara,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
Good day,
I followed all of the instructions, still there’s no prompt to add it in home screen.
I already finished the setup in wordpress and in google chrome in my phone.
Hi Gipre,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
I follow the instruction, but am not getting icon at bottom of page.
https://www.foerster.com.ar
Thank´s
Hi Guillermo,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.
Hi! Followed installation instructions and I don’t see on android web=pade instalation button PWA. I have https.
Hi Fireman,
Will you please contact our technical team from here- https://superpwa.com/contact/ they will help you as soon as possible.