PWA - Add to home screen issues

sonicviz

Hi,
I’m testing a simple PWA and working on testing the Add to Home screen functionality as laid out in https://developers.google.com/web/fundamentals/engage-and-retain/app-install-banners/

ie:
"Testing the app install banner
Once you’ve got your web app manifest set up, you’ll want to validate that it’s defined correctly. You’ve got two approaches at your disposal. One is manual, and the other is automated.
To manually trigger the app install banner:

Open Chrome DevTools.
Go to the Application panel.
Go to the Manifest tab.
Click Add to homescreen, highlighted in red in the screenshot below."

Using the default PWA framework in the manifest.json it has " “src”: “/statics/icons/icon-192x192.png”,

I have my test app deployed to Gitlab pages but when I try the above test I get an error:
icon-192x192.png:1 GET https://sonicviz.gitlab.io/statics/icons/icon-192x192.png 404 ()

but the file does exist correctly at https://sonicviz.gitlab.io/fopra/statics/icons/icon-192x192.png

If I change the manifest.json path to “src”: “./statics/icons/icon-192x192.png”, I now get an error
file does exist correctly at https://sonicviz.gitlab.io/fopra/statics/statics/icons/icon-192x192.png

So the relative linking is not working correctly in the manifest with gitlab it seems?

Any clues to fix it?

ty!

sonicviz

Updated the manifest file with full start url but it’s still getting the url wrong for static icons

{
  "name": "Fopra App",
  "short_name": "Fopra-PWA",
  "icons": [
    {
      "src": "/statics/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/statics/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "start_url": "https://sonicviz.gitlab.io/fopra",
  "display": "standalone",
  "background_color": "#ffffff",
  "theme_color": "#027be3"
}

sonicviz

Resolved. Seemed to be an issue purely with gitlab pages as when I deployed to netlify the offline add to homepage works just fine.

No More Posting New Topics!

PWA - Add to home screen issues