I have a Progressive Web App that meets all the Google Chrome criteria for installation and passes the Audit tests. Using Chrome, when I surf to the PWA's URL and select "Add To Home screen" (either from the menu or from the popup) it will install as an app via WebAPK - as expected. The correct icon shows in the app list. However, the app icon is not added to the Home screen - it is not on any of the home screens.
Shouldn't it also be added to the home screen as that is the expectation of "Add to Home screen"?
This SO thread suggests adding to both is the usual functionality. But that is not happening for me. PWA add to home screen does not work as expected
If it should also be added to the home screen, any suggestions as to what I may be doing wrong or where to investigate?
If it doesn't also add to home screen - shouldn't it? Or change the menu item to "Install App" - so the user expectation is set correctly?
EDIT 2021-09-18:
It's been 2 years since this post and I've been distracted with other things (as many have the last 18 months). But coming back to this project, I still have this issue. Thanks to CherryDT for suggesting to update this post instead of creating a new one.
I created a minimal PWA (called PWATest) that successfully registers a service worker and shows the browser prompt to install the PWA. The browser prompt in Android Chrome (now Version 91.0.4472.124) shows at the bottom of the mobile screen and says "Add PWATest to Home screen". When I tap that prompt, the "Install app" dialog shows and I select "Install". I see "Adding PWATest...". After it is installed, the app icon is in the applications area with all the other app icons but there is no PWATest icon on the home screen (any of them).
I have cleared the cache and asked a friend to try with no difference.
I just went to bmw.com and installed their pwa. Same thing. The app icon showed only with the other application icons - no icon on the home screen.
I tried my pwa using Samsung Internet and again same result.
Related
I have configured a G Suite market place application and it's still in the test level. After filling the configuration page of the market application I got a button named "Integrate with Google" in the top of the Marketplace SDK configuration page
After clicking the button I get a pop up with the title "Domain wide install" there we have the "Continue" button. Previously that button redirected users to the consent screen, but it doesn't redirect to anything now. I did not change anything in the configuration so I guess this is probably a change from Google side.
Please let me know what the issue is?
There is an open Issue on Google's Issue tracker about this at:
https://issuetracker.google.com/153243016
You should add a start next to the issue number, for it to get more visibility.
I have a PWA setup with a manifest and service worker such that I can manually add to the homescreen on Chrome in Android if I select the 'add to homescreen' button under the menu. I also verified on the Desktop that I can add it as a webapp in Chrome.
However, it seems that the installation banner only pops up based on some heuristics that Google selects e.g. user must interact with the site for 30 seconds etc.
What I would like is a button on my homepage, such that when I trigger it, the add to homescreen banner will automatically pop up in Chrome. How do I do this?
I want something similar to the 'Install' button on this example site: http://airhorner.com, which manually triggers the banner. However, what I would like is a minimal working example that demonstrates this.
The first thing to check is with the Chrome Audit tools.
Run the Progressive Web App audit
Under Passed Audits, you should see
--- "User can be prompted to Install the Web App"
Notes I have for A2HS
Source code links there for my working example
https://ng-chicago.github.io/2018/06/18/add-2-home-screen/
There are also reference articles I used
Most of the work when testing your A2HS is constantly clearing out your browser and previous installs (Chrome desktop and mobile) to test again.
I'm using the IOS simulator iPad/ ISO 4.3.2 (8H7)
I'm working on a web based app for the iPad, it works fine being viewed as a webpage on my local host.
However, when I click add to homepage button and access the site via the icon on the homepage.
All the 'a' tags stop working.
EDIT: I've found another post that people mention the same issue. See the second and third posts down.
iPad WebApp Full Screen in Safari
The only way I have been able to get this to work is by changing all my 'a' tags to the following.
a href="javascript:this.location = 'page.php'"
For some reason when you link with javascript it stays in the same window.
My app tab is not visible in my app page. I did following steps, but app is not visible.
1) Created app from https://developers.facebook.com/apps/
2) Added all fields to Page Tab configuration
But I cannot see tab in my application facebook page (https://www.facebook.com/apps/application.php?id=appid).
You'll need to do as #DannyKK says, then head to the Apps section of your Page administration, and find your app in the list. Click 'edit settings', then on the Profile tab of the resulting dialog you'll have the option to finally add the custom tab to your page.
I find the process wildly unintuitive. Possibly it's been streamlined and the step DannyKK didn't mention is no longer necessary, but just in case...
Is there a way of telling whether my Web Application has been launched from a button on the user's iPhone home screen? I want to display a "add this WebApp to your home screen" prompt if the user has accessed the WebApp via safari by typing in a URL.
window.navigator.standalone
True if you have launched from the Home Screen. False if in the Safari browser.
Documented here:
https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
It works with OS 2.1 and up.
In Safari, the scrollY will start at a negative value if inside Safari, and at 0 if running as an application.
Likely the viewport will change as well (if it does, this is a more reliable method)
jQTouch detects this (try the demo). It's open source, so you should be able to find out how.
If I remember correctly there's a thing in the server log that shows what the user's previous page was. So the only way I can think of is if the user was on a previous page display the "add" thing, and if they didn't don't