spinners
spinners

Reputation: 2679

Prevent PWA install prompt chrome 76 on desktop?

Chrome 76 has introduced a button in the omnibox to "Install App" if the PWA criteria is met.

Is there a way to prevent this button from appearing in the omnibox for chrome desktop?

Upvotes: 11

Views: 5681

Answers (2)

Harry Theo
Harry Theo

Reputation: 784

For making your PWA installable only on mobile and not on desktop you can choose one of the following methods:

  1. Redirect to a subdomain or another domain that does not have a manifest file

  2. If you are using Server-Side-Rendering, remove the manifest link tag before sending to the client

    <!-- do not include this if the client userAgent is a desktop device (wide screen) -->
    <link rel="manifest" href="./manifest.json"/> 
    
  3. Remove manifest on the client once the page is loaded on desktop

    window.addEventListener("load", function() {
      if (navigator.userAgent.indexOf('Mobile') === -1) {
        document.querySelector('link[rel="manifest"]').remove();
      }
    });
    

That way it will make your PWA not installable and thus not showing the Add to Home screen in the omnibox.

Upvotes: 3

Emmanuel
Emmanuel

Reputation: 447

Supposing you want to prevent the default so as to show a customized install banner, read here.

However, this script would totally prevent the install banner!

window.addEventListener('beforeinstallprompt', (e) => {
    // Prevent Chrome 67 and earlier from automatically showing the prompt
    e.preventDefault();
});

Upvotes: 3

Related Questions