PWA Splash doesn't show own App Icon

1

My PWA app shows the default NSB icon at startup, instead of the icon specified at project/common/icon.
And yes, it’s in the required size and format, 192x192 PNG.

Any idea on how to get this fixed, thanks!

2

Are there any messages in the console when you start the app?

3

The following errors are shown, which I believe are not causing the problem:
-[PWA] The installing service worker became redundant.
-Uncaught (in promise) TypeError: Request failed

But I’ve noticed another issue, if the app’s running on my own server, Chrome doesn’t show the install icon. Yesterday, I’ve pushed the same app to Volt and to my surprise Chrome suddenly recognizes the app as PWA.

4

Have you tried clearing the Chrome browser’s cache?

5

I just saw you sent me a PM with the links.

As you reported, the app works properly when deployed to Volt, but not from your server.

I then went to Chrome’s Audits menu and generated the report. The Volt version is a valid PWA, while your server fails the tests. It looks like your server does not reply properly when offline.

Give it try - it will give you some avenues to look at.

6

Thanks for checking, I’ll try to find the reason why it doesn’t fullfill all requirements to be recognized as PWA.

But it doesn’t answer the question why its not showing the app’s icon on the splash screen, this happens with the Volt deployment as well.

7

Have a look at your PWA Manifest. Right now, it looks like this:

{
  "short_name": "{title}",
  "name": "{title}",
  "display": "standalone",
  "start_url": "index.html",
  "background_color": "black",
  "theme_color": "black",
  "icons": [
    {
      "src": "nsb/images/192.png",
      "sizes": "192x192"
    },
    {
      "src": "nsb/images/512.png",
      "sizes": "512x512"
    }
  ]
}
8

Correct, do I have to adapt it to my icons? I was assuming AppStudio would create the different icons by itself, since the wiki states for SplashScreens “Starting with AppStudio 8, SpashScreens are created automatically”

9

Icons and splashes are created automatically for VoltBuilder, Cordova and PhoneGap. PWAs have a different set of requirements.

10

Good to know, thanks!

I’ve included the icons in the PWA manifest and updated the Volt build, but it’s still showing the default icon, even after clearing the browser cache, closing the app, etc.

Is there a way to show the splash screen programmatically in order to check what’s going on?

11

De- and reinstalling did the trick, it’s showing my own icon now :slight_smile: