title: PWA Add To Home screen button in Chrome with Angular 4
body: <p>I have started working on PWA with Workbox3. And it is working out pretty amazing so far. I have added code to <strong>Add to Home Screen</strong> button so User can add it to there Mobile's Home screen. But the prompt box to add icon on Home screen showing only single time. Once I added that Icon to Home screen then after that it if I delete it and try same again then it shows nothing. </p>
  
  <p>I am checking in <strong>Desktop chrome from Chrome's DevTool->Application->Mainfest sectoin->Add to Home Screen</strong>. My <strong>Service worker</strong> is installed correctly and working fine.  </p>
  
  <p>It is showing no error no console anything. So I am not able to track what the issue is.</p>
  
  <p>Here is my code I have done so far for Add to Home Screen. I have added this Button at footer.</p>
  
  <pre><code>&lt;button name="addToHome" id="addToHome" class="addToHome"&gt;Add To Homescreen&lt;/button&gt; 
  
  var deferredPrompt;
  var btnSave = document.querySelectorAll('.addToHome')[0];
  
      window.addEventListener('beforeinstallprompt', function(e) {
        console.log('beforeinstallprompt Event fired');
        //e.preventDefault();   //I even try with this uncommented no luck so far
  
        // Stash the event so it can be triggered later.
        deferredPrompt = e;
  
        return false;
      });
  
      btnSave.addEventListener('click', function() {
        if(deferredPrompt !== undefined) {
          // The user has had a postive interaction with our app and Chrome
          // has tried to prompt previously, so let's show the prompt.
          deferredPrompt.prompt();
  
          // Follow what the user has done with the prompt.
          deferredPrompt.userChoice.then(function(choiceResult) {
  
            console.log(choiceResult.outcome);
  
            if(choiceResult.outcome == 'dismissed') {
              console.log('User cancelled home screen install');
            }
            else {
              console.log('User added to home screen');
            }
  
            // We no longer need the prompt.  Clear it up.
            deferredPrompt = null;
          });
        }
      });
  
      window.addEventListener('appinstalled', (evt) =&gt; {
        app.logEvent('a2hs', 'installed');
        console.log("dfadf    ");
      });
  </code></pre>
  
  <p>It only show <strong>beforeinstallprompt Event fired</strong> this console just one time. If again I try it show nothing.</p>