Mobile App Icon Missing on Android

There are scenarios which might lead to a missing mobile app icon on an Android device after installing the PWA (progressive web app). This is most generally a result of installing with a browser other than the native Chrome. The details below can help you address the issue. If you are unable to address the issue, please refer to the party that supports your device.

Try the easy fix:

In Chrome:

• Click the iMonnit install button on the iMonnit login screen.
• A new item will be displayed in the google chrome dropdown menu (3 dots, upper right corner)
• Select Install App or Add to Home Screen.

What Causes the “Invisible PWA” Issue?

1. Browser-Specific Installation Behavior
   • Chrome on Android installs PWAs as standalone apps. They appear in the app drawer and home screen, and are listed in system settings.

   • Other browsers (like Edge or Firefox) may only create a shortcut or partial install. These often don’t show up in the app drawer or may not register fully with the OS.

     Manifest or Icon Configuration Issues

   • If your manifest.json is missing required icon sizes (especially 192x192 and 512x512 ), Android may fail to generate a proper home screen icon.

   • Icons that don’t support masking (for circular icons) may be rejected or appear broken.

     Service Worker or HTTPS Issues

   • A missing or misconfigured service worker, or serving the app over HTTP instead of HTTPS, can prevent the install prompt or proper registration.

     OS-Level Shortcut Permissions

   • Some Android devices restrict apps from adding shortcuts unless explicitly granted permission. This can cause the install to silently fail or not appear on the home screen.

     Cached or Corrupted Install State

   • If a user installs the app, then deletes the icon without uninstalling it from system settings, Android may think it’s still installed—causing the “limbo” state you described.

🛠️ How to Resolve It

1. Recommend Chrome for Installation

   • Install the PWA using Chrome, especially on Android. Chrome handles full PWA installs best and avoids partial shortcut behavior seen in other browsers.

     Audit Your Manifest

   • Ensure your manifest.json includes:

     json

{
  "icons": [
    {
      "src": "icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "display": "standalone",
  "start_url": "/",
  "background_color": "#ffffff",
  "theme_color": "#000000"
}

• Also include <link rel="manifest" href="/manifest.json"> in your HTML head.

  Clear Install State

  • Go to Settings > Apps > iMonnit and uninstall it.

  • Then reinstall via Chrome to ensure a clean install.

    Use Lighthouse Audit

• Run a audit in Chrome DevTools to verify installability, icon presence, and service worker registration.

  Handle Edge Cases Gracefully

• Consider detecting the browser and showing a custom install prompt or warning if the user is not using Chrome.

Deleting the app if it was installed with Edge or Chrome

For Edge on Android

1. Clear Site Data
   • Open Edge.
   • Go to Settings > Privacy and security > Site permissions > All sites .
   • Find and tap on imonnit.com .

   • Tap Clear data and Reset permissions.

     Check Edge’s Internal App List

   • In the Edge address bar, type edge://apps .

   • If the PWA is listed, tap the three-dot menu next to it and select Remove.

     Clear Edge Cache (Optional Cleanup)

   • Go to Android Settings > Apps > Edge > Storage & cache.
   • Tap Clear cache (and optionally Clear storage, but this logs the user out of Edge).

For Firefox on Android

1. Clear Site Data
   • Open Firefox.
   • Go to Settings > Site permissions or Settings > Privacy > Clear browsing data .

   • Tap Manage Website Data, find imonnit.com , and remove it.

     Check for Saved Shortcuts

   • Firefox doesn’t have a dedicated PWA manager. If the icon isn’t on the home screen, clearing site data is the only way to remove the install state.

Why This Happens

Browsers like Edge and Firefox often create web shortcuts rather than true app installs. If the shortcut is deleted or fails to appear, the browser may still retain service worker data and permissions, causing the “already installed” behavior.