title: Uncaught (in promise) TypeError: Request failed
body: <p>I am creating a Progressive Web App for a university project, but when I checked the console I have this error:</p>
  
  <blockquote>
    <p>Uncaught (in promise) TypeError: Request failed - serviceworker.js:1</p>
  </blockquote>
  
  <p>I don't understand where this error is coming from. </p>
  
  <p>The HTML and CSS are showing on as expected, but when I do a PWA audit from the Chrome Dev Tools, it's showing <a href="https://i.stack.imgur.com/IjthH.png" rel="noreferrer">these failures. They are 'no service worker', 'no 200 when offline' and 'user not prompted to install web app'.</a></p>
  
  <p>Any help is appreciated! </p>
  
  <p>Thanks in advance!
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>*{
    padding: 0;
    margin: 0;
    font-family: "Roboto", sans-serif;
    color: #4E5863;
  }
  
  .indexLogo{
    height: 180px;
    text-align: center;
    padding: 36px 0;
    border-bottom: 1px solid #E5E9F2;
  }
  
  .intuPotteriesLogo, .manchesterAirportLogo{
    width: 252px;
    height: auto;
  }
  
  .indexTitle{
    text-align: center;
    padding: 36px 0;
    font-weight: 500;
    border-bottom: 1px solid #E5E9F2;
    font-size: 24px;
  }
  
  header{
    width: 100%;
    text-align: center;
  }
  
  #headerStokeCityOfCulture{
    width: 100%;
  }
  
  #container{
    width: 100%;
    text-align: center;
  }
  
  .hotLinks{
    border: 2px solid #ABB5C3;
    width: 22%;
    margin: 10px 10px;
    display: inline-block;
  }
  
  .hotLinksLogos{
    width: 100%;
  }
  
  .hotLinksTitle{
    text-align: center;
    padding: 10px;
    border-top: 2px solid #ABB5C3;
  }
  
  .searchBarContainer{
    text-align: center;
    padding: 20px 0;
    border-bottom: 1px solid #E5E9F2;
  }
  
  .searchBox{
    width: 90%;
    height: 30px;
    font-size: 18px;
    text-align: center;
    background-color: #E5E9F2;
    border: none;
    color: black;
  }
  
  .bookingItem{
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px solid #E5E9F2;
    text-decoration: none;
    font-size: 20px;
  }
  
  .bookingItemIcon{
    height: 60px;
  }
  
  .bookingItemLeft{
    width: 25%;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
  }
  
  .bookingItemRight{
    width: 65%;
    display: inline-block;
    vertical-align: middle;
    padding-left: 15px;
  }
  
  .bookingTitle{
    font-size: 20px;
    font-weight: 500;
  }
  
  .bookingAddress{
    font-size: 18px;
    font-weight: 400;
  }
  
  #searchPageContainer{
    height: 1200px;
    background-color: #F7F8F8;
    text-align: center;
  }
  
  .searchIdeas{
    padding: 10px;
    color: #515B64;
  }
  
  .searchIdeasFirstItem{
    padding-top: 40px;
  }
  
  .profileContainer{
    border-bottom: 1px solid #E5E9F2;
  }
  
  .profilePictureContainer{
    text-align: center;
    padding: 20px;
    display: inline-block;
  }
  
  #profilePicture{
    height: 100px;
  }
  
  #userName{
    padding-top: 5px;
  }
  
  .profileDetailsContainer{
    display: inline-block;
    vertical-align: top;
    padding: 20px;
    width: 55%;
  }
  
  #fullUserName{
    padding-bottom: 5px;
  }
  
  #usersHometown{
    padding-bottom: 15px;
  }
  
  .tripsFriendsPhotosContainer{
    width: 40%;
    display: inline-block;
  }
  
  .recentTripLogos{
    border: 2px solid #ABB5C3;
    width: 42%;
    margin: 20px 0 0 20px;
    display: inline-block;
  }
  
  fieldset{
    margin: 20px;
    border: none;
  }
  
  input[type=text]{
      width: 80%;
      padding: 10px;
      margin: 10px 0;
      display: inline-block;
      border: 1px solid #ccc;
      border-radius: 4px;
      box-sizing: border-box;
  }
  
  input[type=radio]{
    margin: 10px 0;
  }
  
  label{
    padding-right: 10px;
  }
  
  textarea{
    width: 80%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 4px;
  }
  
  .formTitles{
    font-size: 20px;
    font-weight: 500;
  }
  
  #reviewInstructions{
    margin: 20px;
  }
  
  #submitButton{
    border-radius: 10px;
    padding: 10px;
    background-color: #48525E;
    color: white;
  }
  
  footer{
    width: 100%;
    text-align: center;
    border: 2px solid #ABB5C3;
    background-color: white;
    clear: both;
  }
  
  .footerLinks{
    display: inline-block;
    padding: 20px;
    text-decoration: none;
    color: black;
  }
  
  .footerIcons{
    height: 30px;
  }
  
  .discoverContainer, .discoverDescription, .discoverDirections, .discoverTitle, .discoverDirectionsTitle, .discoverReviewHeading,
  .discoverReview, .discoverReviewTitle, .discoverContentPhotos, .bookingQrCodesContainer, .profileContainer, .container{
    width: 90%;
    margin: 0 auto;
  }
  
  .discoverContainer, .bookingQrCodesContainer, .profileContainer{
    text-align: center;
    margin-bottom: 20px;
  }
  
  .discoverPhotos{
    width: 40%;
  }
  
  .recentTripsContainer a img{
    width: 25%;
  }
  
  h1{
    font-size: 20px;
    padding: 10px 0;
  }
  
  h2{
    font-size: 16px;
  }
  
  
  
  
  
  @media screen
    and (max-width: 600px) {
  
    .profileContainer, .container{
      text-align: left;
      width: 100%;
    }
  
    body{
      margin-bottom: 70px;
    }
  
    .hotLinks{
      border: 2px solid #ABB5C3;
      width: 43%;
      margin: 20px 10px;
      display: inline-block;
    }
  
    .footerLinks{
      display: inline;
      padding: 0;
    }
  
    .footerIconsContainer{
      display: inline-block;
      text-align: center;
      width: 24%;
    }
  
    .footerIcons{
      height: 20px;
      padding: 10px 0 0;
    }
  
    .footerIconText{
      font-size: 16px;
      padding: 5px;
    }
  
    footer{
      width: 100%;
      text-align: center;
      border: 2px solid #ABB5C3;
      background-color: white;
      clear: both;
      position: fixed;
      bottom: 0;
    }
  
    .discoverContainer{
      width: 100%;
      text-align: center;
    }
  
    .discoverLogo{
      padding: 20px 10px;
      width: 40%;
      float: left;
    }
  
    .discoverAddress{
      padding: 20px;
      font-size: 20px;
      font-weight: 500;
    }
  
    .discoverDescription, .discoverDirections, .discoverReview{
      clear: both;
      padding: 0 20px;
    }
  
    .discoverDirectionsTitle, .discoverTitle, .memberSinceTitle, .reviewsTitle{
      font-size: 18px;
      font-weight: 500;
      padding: 20px 20px 0 20px;
    }
  
    .discoverReviewTitle{
      font-size: 16px;
      font-weight: 500;
      padding: 10px 20px 0 20px;
    }
  
    #map{
      width: 90%;
      height: 600px;
      margin: 20px auto;
      background-color: grey;
    }
  
    .discoverContentPhotos{
      width: 100%;
      text-align: center;
    }
  
    .discoverTitle{
      text-align: left;
    }
  
    .discoverPhotos{
      width: 46%;
      padding-top: 10px;
    }
  
    .bookingQrCodesContainer{
      text-align: center;
      padding-bottom: 30px;
    }
  
    .aboutUserTitle{
      font-size: 20px;
      padding-top: 20px;
    }
  
    .aboutUserText, .aboutUserTitle, .usersReview{
      padding-left: 20px;
      padding-right: 20px;
    }
  
    .reviewTitles{
      font-size: 16px;
      font-weight: 500;
      padding: 0 20px;
    }
  
    #submitReviewsButton{
      margin: 10px 0 0 20px;
      border-radius: 10px;
      padding: 10px;
      background-color: #48525E;
      color: white;
    }
  
    .reviewForm{
      margin-left: 20px;
    }
  
    #todaysWeatherTitle{
      margin-bottom: 15px;
    }
  
    #container-openweathermap-widget-12 &gt; div{
      margin: 0 auto 100px;
    }
  
    .weather-left-card__wind, .weather-left-card__link, .weather-left-card__links span, .weather-left-card__rising{
      font-size: 16px !important;
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
    &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;meta name="theme-color" content="#000000"&gt;
      &lt;meta name="description" content="An application to learn about Stoke on Trent's events and places to visit!"&gt;
      &lt;title&gt;Voyage App&lt;/title&gt;
      &lt;link rel="stylesheet" href="style.css"&gt;
      &lt;link rel="manifest" href="manifest.json"&gt;
      &lt;link rel="icon" type="image/png" href="images/favicons.ico/favicon.ico" /&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;header&gt;
        &lt;h1 class="indexTitle"&gt;Discover Stoke-on-Trent&lt;/h1&gt;
      &lt;/header&gt;
      &lt;picture id="headerStokeCityOfCulture"&gt;
        &lt;source class="full-width" media="(min-width: 600px)" srcset="images/cityOfCulture-large.jpg"&gt;
        &lt;source class="full-width" media="(min-width: 420px)" srcset="images/cityOfCulture-medium.jpg"&gt;
        &lt;img src="images/cityOfCulture-small.jpg" alt="Stoke City of Culture" style="width:100%;"&gt;
      &lt;/picture&gt;
      &lt;div id="container"&gt;
        &lt;a href="intupotteries.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/intuPotteries.jpg" alt="intu Potteries Shopping Centre Logo"&gt;
            &lt;h4 class="hotLinksTitle"&gt;intu Potteries&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a href="emmabridgewater.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/emmaBridgewater.jpg" alt="Emma Bridgewater Pottery Logo"&gt;
            &lt;h4 class="hotLinksTitle"&gt;Emma Bridgewater&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a href="altontowers.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/altonTowers.jpg" alt="Alton Towers Theme Park Logo"&gt;
            &lt;h4 class="hotLinksTitle"&gt;Alton Towers&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a href="trenthamEstate.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/trenthamEstate.jpg" alt="Trentham Estate Logo"&gt;
            &lt;h4 class="hotLinksTitle"&gt;Trentham Estate&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a href="bet365.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/bet365.jpg" alt="Bet365 Stadium Logo - The home of Stoke City Football Club"&gt;
            &lt;h4 class="hotLinksTitle"&gt;Bet365 Stadium&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a href="freeportTalke.html"&gt;
          &lt;div class="hotLinks"&gt;
            &lt;img class="hotLinksLogos" src="images/freeportTalke.jpg" alt="Freeport Talke Shopping Centre Logo"&gt;
            &lt;h4 class="hotLinksTitle"&gt;Freeport Talke&lt;/h4&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;h4 id="todaysWeatherTitle"&gt;Todays Weather&lt;/h4&gt;
        &lt;div id="weatherContainer"&gt;&lt;/div&gt;
      &lt;/div&gt;
      &lt;footer&gt;
        &lt;a class="footerLinks" href="index.html"&gt;
          &lt;div id="discover" class="footerIconsContainer"&gt;
            &lt;img class="footerIcons" src="images/binoculars.jpg" alt="Binoculars icon"&gt;
            &lt;p class="footerIconText"&gt;Discover&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a class="footerLinks" href="bookings.html"&gt;
          &lt;div id="bookings" class="footerIconsContainer"&gt;
            &lt;img class="footerIcons" src="images/ticket.jpg" alt="Binoculars icon"&gt;
            &lt;p class="footerIconText"&gt;Bookings&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a class="footerLinks" href="search.html"&gt;
          &lt;div id="search" class="footerIconsContainer"&gt;
            &lt;img class="footerIcons" src="images/search.jpg" alt="Binoculars icon"&gt;
            &lt;p class="footerIconText"&gt;Search&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt;
        &lt;a class="footerLinks" href="account.html"&gt;
          &lt;div id="account" class="footerIconsContainer"&gt;
            &lt;img class="footerIcons" src="images/person.jpg" alt="Binoculars icon"&gt;
            &lt;p class="footerIconText"&gt;Account&lt;/p&gt;
          &lt;/div&gt;
        &lt;/a&gt;
      &lt;/footer&gt;
      &lt;script&gt;
        if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('serviceworker.js').then(function(registration) {
            console.log('Service worker registered successfully', registration);
          }).catch(function(err) {
            console.log('Service worker registration failed: ', err);
          });
        };
      &lt;/script&gt;
      &lt;script src="https://www.gstatic.com/firebasejs/4.10.0/firebase.js"&gt;&lt;/script&gt;
      &lt;script src="serviceworker.js"&gt;&lt;/script&gt;
      &lt;script src="scripts.js"&gt;&lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var cache_name = 'gih-cache';
  var cached_urls = [
    'offline.html',
    'fourohfour.html',
    'account.html',
    'altontowers.html',
    'bet365.html',
    'booking-altonTowers.html',
    'booking-manchesterAirport.html',
    'booking-northStaffsHotel.html',
    'bookings.html',
    'emmabridgewater.html',
    'freeportTalke.html',
    'index.html',
    'intupotteries.html',
    'search.html',
    'trenthamEstate.html',
    'style.css'
  ];
  
  self.addEventListener('install', function(event) {
    event.waitUntil(
      caches.open(cache_name)
      .then(function(cache) {
        return cache.addAll(cached_urls);
      })
    );
  });
  
  self.addEventListener('activate', function(event) {
    event.waitUntil(
      caches.keys().then(function(cacheNames) {
        return Promise.all(
          cacheNames.map(function(cacheName) {
            if (cacheName.startsWith('pages-cache-') &amp;&amp; staticCacheName !== cacheName) {
              return caches.delete(cacheName);
            }
          })
        );
      })
    );
  });
  
  self.addEventListener('fetch', function(event) {
      console.log('Fetch event for ', event.request.url);
      event.respondWith(
        caches.match(event.request).then(function(response) {
          if (response) {
            console.log('Found ', event.request.url, ' in cache');
            return response;
          }
          console.log('Network request for ', event.request.url);
          return fetch(event.request).then(function(response) {
            if (response.status === 404) {
              return caches.match('fourohfour.html');
            }
            return caches.open(cached_urls).then(function(cache) {
             cache.put(event.request.url, response.clone());
              return response;
            });
          });
        }).catch(function(error) {
          console.log('Error, ', error);
          return caches.match('offline.html');
        })
      );
    });</code></pre>
  </div>
  </div>
  </p>