title: ServiceWorker's 'fetch': Object that was not a Response was passed to respondWith()
body: <p>Service worker 'fetch' not returning Response object</p>
  <p>I'm trying to answer the request with cached content. If the cache doesn't have the required content, I'm fetching from the server, putting the response in the cache and returning it.</p>
  
  <pre class="lang-js prettyprint-override"><code>self.addEventListener('fetch', function (event) {
    if (event.request.method != 'GET')
      return;
    event.waitUntil((async () =&gt; {
      // some IndexedDB stuff which works fine
    })());
    event.respondWith((async () =&gt; { //&lt;----------- this is line 154
      var freshResource = fetch(event.request).then(async function (response) {
        if (!response || response.status !== 200 || response.type !== 'basic') {
          return response;
        }
        if (ENABLE_DYNAMIC_CACHING) {
          var responseToCache = response.clone();
          caches.open(DYNAMIC_CACHE).then(function (cache) {
            cache.put(event.request, responseToCache);
          });
        }
        return response;
      }).catch(function (error) {
        console.err('Error: ' + error.message);
      });
      caches.match(event.request).then(async function (resp) {
        return resp || freshResource;
      }).catch(function (e) {
        return freshResource;
      });
    })());
  });
  </code></pre>
  <p>When I request a page, it doesn't load, and I get this:</p>
  <blockquote>
  <p>The FetchEvent for &quot;http://localhost:64228&quot; resulted in a network error response: an object that was not a Response was passed to respondWith(). ... @service-worker.js:154</p>
  </blockquote>
  <p>I wonder if this could have to do with the async stuff...</p>