[Bug - next-pwa]: Apk opens in browser mode

OrelsProjects commented 1 month ago

Provide environment information

"next": "^14.2.0",
"@ducanh2912/next-pwa": "^10.2.6",

Link to reproduction - Issues with a link to complete (but minimal) reproduction code help us address them faster

https://github.com/OrelsProjects/PinkyPartner

To reproduce

Build the APK and try to install it @ https://www.pinkypartner.com

Describe the bug

When I create an apk (also uploaded to Play Store) via pwabuilder and install it on my phone, it opens with the browser navigation bar.

Expected behavior

The app should open without the navigation bar

Screenshots (if relevant)

No response

Additional information (if relevant)

Manifest:

{
  "name": "PinkyPartner",
  "id": "com.orelsprojects.pinkypartner",
  "short_name": "PinkyPartner",
  "theme_color": "#ffffff",
  "background_color": "#FFFFFF",
  "display": "standalone",
  "display_override": [
    "standalone",
    "window-controls-overlay"
  ],
  "description": "PinkyPartner is a habits building app that let's you build them with a partner.",
  "orientation": "portrait",
  "start_url": "https://www.pinkypartner.com/home",
  "dir": "auto",
  "scope": "/",
  "icons": [
    {
      "src": "windows11/SmallTile.scale-100.png",
      "sizes": "71x71"
    },
    {
      "src": "windows11/SmallTile.scale-125.png",
      "sizes": "89x89"
    },
 ....
  ],
  "lang": "en",
  "categories": [
    "entertainment",
    "productivity"
  ]
}

Next config:

// @ts-check
import * as PWA from "@ducanh2912/next-pwa";

/** @type {import('next').NextConfig} */
const nextConfig = {
  headers: async () => [
    {
      source: "/sw.js",
      headers: [
        {
          key: "Service-Worker-Allowed",
          value: "/",
        },
      ],
    },
  ],
  images: {
    unoptimized: true,
    remotePatterns: [
      {
        protocol: "https",
        hostname: "storage.googleapis.com",
      },
      {
        protocol: "https",
        hostname: "lh3.googleusercontent.com",
      },
    ],
  },
};

const withPWA = PWA.default({
  dest: "public",
  cacheOnFrontEndNav: true,
  aggressiveFrontEndNavCaching: true,
});

export default withPWA(nextConfig);

Thanks in advance!