title: Chrome 67 won't fire the 'beforeinstallprompt' for my PWA
body: <p>I am working on an example web app that I want my users to be able to install to their chrome home screen. As far as I can tell, all of the following criteria are met:</p>
  <blockquote>
  <p>The web app is not already installed</p>
  </blockquote>
  <blockquote>
  <ul>
  <li>Meets a user engagement heuristic (currently, the user has interacted with the domain for at least 30 seconds)</li>
  </ul>
  </blockquote>
  <ul>
  <li><p>Includes a web app manifest that includes:
  short_name or name</p>
  </li>
  <li><p>icons must include a 192px and a 512px sized icons
  start_url</p>
  </li>
  <li><p>display must be one of: fullscreen, standalone, or minimal-ui</p>
  </li>
  <li><p>Served over HTTPS (required for service workers)</p>
  </li>
  <li><p>Has registered a service worker with a fetch event handler</p>
  </li>
  <li><p>hard to actually measure</p>
  </li>
  <li><p>I do include a manifest:</p>
  </li>
  </ul>
  <pre><code>    {
          &quot;short_name&quot;: &quot;React Notes&quot;,
          &quot;name&quot;: &quot;React Notes Sample&quot;,
          &quot;icons&quot;: [
            {
              &quot;src&quot;: &quot;staticAssets/favicon.ico&quot;,
              &quot;sizes&quot;: &quot;64x64 32x32 24x24 16x16&quot;,
              &quot;type&quot;: &quot;image/png&quot;
            },
            {
              &quot;src&quot;: &quot;staticAssets/icon-192.png&quot;,
              &quot;sizes&quot;: &quot;192x192&quot;,
              &quot;type&quot;: &quot;image/png&quot;
            },
            {
              &quot;src&quot;: &quot;staticAssets/icon-512.png&quot;,
              &quot;sizes&quot;: &quot;512x512&quot;,
              &quot;type&quot;: &quot;image/png&quot;
            }
          ],
          &quot;start_url&quot;: &quot;/&quot;,
          &quot;display&quot;: &quot;standalone&quot;,
          &quot;theme_color&quot;: &quot;#000000&quot;,
          &quot;background_color&quot;: &quot;#ffffff&quot;
      }
  </code></pre>
  <ul>
  <li><p>As you can see from my manifest, I'm serving icons.</p>
  </li>
  <li><p>I'm using a Paid heroku dyno, so there's no reason it should be served over https</p>
  </li>
  <li><p>I'm registering a service worker with a fetch handler:</p>
  <p>importScripts(&quot;/precache-manifest.2dbaa71ff348edf029d7ff098089b7cd.js&quot;, &quot;/workbox-v3.3.1/workbox-sw.js&quot;);
  workbox.setConfig({modulePathPrefix: &quot;/workbox-v3.3.1&quot;});
  /* eslint-disable */</p>
  <p>self.__precacheManifest = [].concat(self.__precacheManifest || []);
  workbox.precaching.suppressWarnings();
  workbox.precaching.precacheAndRoute(self.__precacheManifest, {});</p>
  <p>self.addEventListener('fetch', (e) =&gt; {
  console.log(e);
  });</p>
  </li>
  </ul>
  <p>S, the problem that I'm running into, is that the <code>beforeinstallprompt</code> event is never firing for me to do anything with. I've run my app through Lighthouse at least a dozen times, and every single time I get the same error:</p>
  <blockquote>
  <p>Failures: Service worker does not successfully serve the manifest’s start_url, No start URL to fetch: No usable web app manifest on page…</p>
  </blockquote>
  <p>And I'm officially at a loss for why this isn't working.</p>