1

I have PWA support in the application, and icons are not always visible on the screen.

After thoroughly examining all PWA forums, no answer seemed to solve the problem.

Here is the index.html file(web app manifest and icon attached):

<link rel="manifest" href="webmanifest.json" />
<link rel="apple-touch-icon" href="assets/icons/CC_192x192.png" />

The icon is provided in the mentioned location and accessible with the link. The web app manifest file is properly configured.

  "name": "Name",
  "short_name": "ShortName",
  "id": "/",
  "theme_color": "#000",
  "background_color": "#fff",
  "display": "standalone",
  "scope": "./",
  "start_url": "./",
  "icons": [
    {
      "src": "assets/icons/CC_192x192.svg",
      "type": "image/svg",
      "sizes": "192x192"
    },
    {
      "src": "assets/icons/CC_192x192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "assets/icons/CC_512x512.svg",
      "type": "image/svg",
      "sizes": "512x512"
    },
    {
      "src": "assets/icons/CC_512x512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ]

Please help.

Here are some sources I have read:

https://developer.chrome.com/en/docs/lighthouse/pwa/apple-touch-icon/ https://github.com/h5bp/html5-boilerplate/pull/1622 https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

Lilit Mazmanyan
  • 80
  • 1
  • 8
  • I'm having the same issue. The icon installs on some iPhones but not others. My manifest and supplied icon are correct. Haven't yet pinned it down to particular iPhone models or OS's. Anyone else in the same boat? – Shaun Jun 19 '23 at 04:49
  • No, neither the iOS nor the model had any connection with the bug. We came to the conclusion that the issue is caused by manifests of different browsers and closed the bug as not an issue. – Lilit Mazmanyan Jun 20 '23 at 08:03

0 Answers0