workbox/test/workbox-precaching/static/precache.html

<html>
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <h3>precache.install() &amp; precache.activate()</h3>
    <button class="js-index-install">Install</button>
    <button class="js-index-activate">Activate</button>

    <script>
      // Make sure there is scope available for core.
      self.registration = {
        scope: 'injected-scope',
      };
    </script>
    <script src="../../../../packages/workbox-core/build/browser/workbox-core.dev.js"></script>
    <script src="../../../../packages/workbox-precaching/build/browser/workbox-precaching.dev.js"></script>

    <script>
      let lastInstallValues = [];
      let flipFile = 'example-a.html';
      const installBtn = document.querySelector('.js-index-install');
      installBtn.addEventListener('click', (event) => {
        const precacheController = new workbox.precaching.PrecacheController();

        lastInstallValues = [
          './project/index.html',
          `./project/${flipFile}`,
          {url: './project/example.html'},
          {url: './project/example-2.html', revision: '123'},
          {url: './project/example-timestamp.html', revision: Date.now()},
        ];
        precacheController.addToCacheList(lastInstallValues);

        precacheController.install(event);

        if (flipFile === 'example-a.html') {
          flipFile = 'example-b.html';
        } else {
          flipFile = 'example-a.html';
        }
      });

      const activateBtn = document.querySelector('.js-index-activate');
      activateBtn.addEventListener('click', (event) => {
        const precacheController = new workbox.precaching.PrecacheController();
        precacheController.addToCacheList(lastInstallValues);
        precacheController.activate(event);
      });
    </script>
  </body>
</html>