[w3c/manifest] beforeinstallprompt not firing automatically (#680)

I want to add to my app "Add To home screen banner", I went through the manual
https://developers.google.com/web/fundamentals/engage-and-retain/app-install-banners/#testing-the-app-install-banner

Have fulfilled the conditions
1) Manifest file
 {
 "name": "Project clean as pwa",
 "short_name": "Pro Clean",
 "icons":[
  {
   "src": "/icons/icons8-washing-machine-48.png",
   "type": "image/png",
   "sizes": "48x48"
  },
  {
   "src": "/icons/icons8-washing-machine-96.png",
   "type": "image/png",
   "sizes": "96x96"
  },
  {
   "src": "/icons/app-icon-192x192.png",
   "type": "image/png",
   "sizes": "192x192"
  },
  {
   "src": "/icons/icons8-washing-machine-480.png",
   "type": "image/png",
   "sizes": "480x480"
  },
  {
   "src": "/icons/icons8-washing-machine-512.png",
   "type": "image/png",
   "sizes": "512x512"
  }
 ],
 "start_url":"/initial",
 "scope": "../",
 "display":"standalone",
 "orientation":"any",
 "background_color":"#fff",
 "theme_color":"#3f51b5",
 "description":"Simple dry clean description",
 "dir":"ltr",
 "lang":"en-US"
}

2) Registered service worker
if("serviceWorker" in navigator){
 navigator.serviceWorker.register('/sw.js')
 .then(function(){
  console.log("Service worker registered");
 });
};

3) Added fetch event handler in serviceworker file
self.addEventListener("fetch",function(event){
 event.respondWith(fetch(event.request));
});

4) Saving beforeinstallprompt event for later use
window.addEventListener("beforeinstallprompt",function(event){
 console.log("beforeinstallprompt fired");//this never appears after waiting for long
        event.preventDefault();
 event.prompt();
 deferredPrompt = event;
 return false;
});

5) Using the event later
function collectOrder(){
 console.log("Using the event ", deferredPrompt);//on call of the funtion the event comes undefined
 if(deferredPrompt){
  deferredPrompt.prompt();

  deferredPrompt.userChoice.then(function(choiceResult){
   console.log(choiceResult.outcome);
   if(choiceResult.outcome==="dismissed")
    console.log("User cancelled installation");
   else
    console.log("User added to homescreen");
  });
  deferredPrompt = null;
 };
}

6) The lighthouse test says the app is pass for "install banner"

Help me with if anything is missing.



-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/manifest/issues/680

Received on Tuesday, 22 May 2018 07:35:03 UTC