I'm running a PWA LightHouse audit with the ServiceWorker code below. The audit reports failures: -
- . Current page does not respond with a 200 when offline
- . start_url does not respond with a 200 when offline
The PWA is recognized as Installable.
I am using remote debugging.
The Chrome Network Tab says there was one access via ServiceWorker and a second via DiskCache.
Why is it going to Network/Disk when it is in cache?
const CACHE_NAME = "BrotkrumenV1.0"
self.addEventListener('install',
function (e) {
e.waitUntil(
caches.open(CACHE_NAME).then(function (cache) {
return cache.addAll([
'/TravelManager.html',
'/hg.png',
'/gingerbreadhouse.png',
'/striped-witch-hat.png',
'/brotkrumen.css',
'/echo.js',
'/registerserviceworker.js',
'/brotkrumen.json',
'/TravelManagerPolyfill.js',
'/HandleMap.js'
]).then(() => self.skipWaiting());
})
);
});
self.addEventListener('activate', function(e)
{
e.waitUntil(
caches.keys().then((keyList) => {
return Promise.all(keyList.map((key) => {
if (key !== CACHE_NAME) {
console.log('Removing cache', key);
return caches.delete(key);
}
}));
})
);
e.waitUntil(self.clients.claim());
});
self.addEventListener('fetch', function (e) {
console.log(e.request.url);
e.respondWith(
caches.match(e.request).then(function (response) {
console.log("Request " + e.request.url);
if (response)
console.log("Response " + response.url);
else
console.log("No MATCH");
return response || fetch(e.request);
})
);
});
The manifest start_url should match what's in cache and pass the audit.
{
"short_name": "Brotkrumen",
"name": "Brotkrumen Web App",
"description": "Native Background Geolocation POC",
"icons": [
{
"src": "gingerbreadhouse.png",
"sizes": "48x48 128x128 144x144 192x192 512x512",
"type": "image/png"
}
],
"start_url": "/TravelManager.html",
"background_color": "#00ccdd",
"theme_color": "#00ccdd",
"display": "fullscreen"
}
