pwa-module icon indicating copy to clipboard operation
pwa-module copied to clipboard

Question: How do i trigger the showpopup in nuxt?

Open 0x4139 opened this issue 4 years ago • 2 comments

Basically what i am trying to achieve is this but i can't figure out how to trigger the popup.

// Initialize deferredPrompt for use later to show browser install prompt.
let deferredPrompt;

window.addEventListener('beforeinstallprompt', (e) => {
  // Prevent the mini-infobar from appearing on mobile
  e.preventDefault();
  // Stash the event so it can be triggered later.
  deferredPrompt = e;
  // Update UI notify the user they can install the PWA
  showInstallPromotion();
  // Optionally, send analytics event that PWA install promo was shown.
  console.log(`'beforeinstallprompt' event was fired.`);
});

0x4139 avatar Sep 05 '21 16:09 0x4139

layouts/default.vue

const workbox = await window.$workbox;
if (workbox) {
  workbox.addEventListener('beforeinstallprompt', (event) => {
     // your stuff here
  });
}

maybe?

podlebar avatar Nov 03 '21 10:11 podlebar

I used this module to create the install-experience: https://github.com/pwa-builder/pwa-install see example on www.ikvergelijk.nl(at bottom of screen) Looks like there is a new pwa module from Microsoft: https://www.pwabuilder.com/ Don't think there are nuxt modules available. I just added the scripts in the head and somehow got it working.

janwillemwilmsen avatar Nov 09 '21 20:11 janwillemwilmsen