googlecodelabs / your-first-pwapp

Code associated with Your First Progressive Web App codelab
https://g.co/codelabs/pwa
Apache License 2.0
638 stars 555 forks source link

After adding manifest.json I can't get index.html to update #83

Closed JamieMason closed 7 years ago

JamieMason commented 7 years ago

Thanks for this great course.

I've reached as far as 8. Support native integration, created the manifest.json, and added the following to my index.html;

  <!-- Add to home screen for Android -->
  <link rel="manifest" href="/manifest.json">

  <!-- Add to home screen for Safari on iOS -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="Weather PWA">
  <link rel="apple-touch-icon" href="images/icons/icon-152x152.png">

  <!-- Tile icon for Windows -->
  <meta name="msapplication-TileImage" content="images/icons/icon-144x144.png">
  <meta name="msapplication-TileColor" content="#2F3BA2">
</head>
  1. I changed the value of the cacheName var.
  2. I have "Update on reload" checked in Devtools.

But I still see the version of index.html from before I added these meta tags. If someone could give me some pointers that would be great. As far as I can tell, I don't think the 'activate' event is firing.

Thanks.

JamieMason commented 7 years ago

I was affected by this gotcha where you need to avoid any cache headers on the ServiceWorker JS file, setting the cache to max-age=0 solves the problem.

I was using the http-server npm package and learned after reading this that it sets max-age=2600 by default. Starting the server using -c-1 disables that so your service worker behaves more predictably.

http-server -c-1 -p 8081