title: Fetch event not getting executed in very first time page load in service worker because client not registered
body: <p>Hi Am facing a wired behavior in service worker. After clearing all the cache load the page service worker loading everything to Cache API. then i went offline and reload the page the page is not getting loaded. I went online and loaded the page again then went offline a load the page this time the page getting loaded correctly. i dont know why this behavior is it anything related to the wait time of service worker how to fix this.  </p>
  
  <p>After few debugging i found that my fetch code is not getting executed on very first page load. from second page load onward its getting the hit</p>
  
  <p>my sample application hosted here <a href="https://ajeeshc.github.io/#/comments" rel="nofollow noreferrer">https://ajeeshc.github.io/#/comments</a></p>
  
  <p>My service worker file is available in <a href="https://github.com/ajeeshc/ajeeshc.github.io/blob/master/service-worker.js" rel="nofollow noreferrer">here</a></p>
  
  <p>complete demo code location <a href="https://github.com/ajeeshc/ajeeshc.github.io" rel="nofollow noreferrer">here</a></p>
  
  <p>Please help me out here am really in critical state. 
  I have few reading towards the delay in registering the service worker cause this issue how to fix this ? </p>
  
  <p>below is my service worker registration code. </p>
  
  <pre><code>if ('serviceWorker' in navigator) {
    navigator.serviceWorker
      .register('service-worker.js', { scope: './' })
      .then(function (registration) {
        console.log("Service worker registered - from the 24 ", registration)
        registration.addEventListener('updatefound', () =&gt; {
          newWorker = registration.installing;
          newWorker.addEventListener('statechange', () =&gt; {
            switch (newWorker.state) {
              case 'installed':
                if (navigator.serviceWorker.controller) {
  
                  showUpdateBar();
                }
                break;
            }
          });
        });
      })
      .catch(function (err) {
        console.log("Service Worker Failes to Register", err)
      })
  
    navigator.serviceWorker.addEventListener('message', function (event) {
      document.getElementById("cache-generic-msg").style.display = "block";
      console.log("Got reply from service worker: " + event.data);
    });
  
    let refreshing;
    navigator.serviceWorker.addEventListener('controllerchange', function () {
      if (refreshing) return;
      window.location.reload();
      refreshing = true;
    });
  
  }
  </code></pre>