Added service worker

sw/service-worker.ts

@@ -1,26 +1,36 @@
 // pack:ignore
 
-var CACHE = "v-alpha"
+var CACHE = "v-1"
 
 self.addEventListener("install", (evt: any) => {
-	console.log("The service worker is being installed.")
-
-	evt.waitUntil(installCache())
+	evt.waitUntil(
+		(self as any).skipWaiting().then(() => {
+			return installCache()
+		})
+	)
 })
 
 self.addEventListener("activate", (evt: any) => {
-	evt.waitUntil((self as any).clients.claim())
+	evt.waitUntil(
+		(self as any).clients.claim()
+	)
 })
 
 self.addEventListener("fetch", async (evt: any) => {
 	let request = evt.request
+	let isAuth = request.url.includes("/auth/") || request.url.includes("/logout")
 
-	console.log("Serving:", request.url, request, request.method)
+	// Delete existing cache on authentication
+	if(isAuth) {
+		caches.delete(CACHE)
+	}
 
 	// Do not use cache in some cases
-	if(request.method !== "GET" || request.url.includes("/auth/") || request.url.includes("chrome-extension")) {
+	if(request.method !== "GET" || isAuth || request.url.includes("chrome-extension")) {
 		return evt.waitUntil(evt.respondWith(fetch(request)))
 	}
+
+	let servedCachedResponse = false
 	
 	// Start fetching the request
 	let refresh = fetch(request).then(response => {
@@ -28,15 +38,33 @@ self.addEventListener("fetch", async (evt: any) => {
 
 		// Save the new version of the resource in the cache
 		caches.open(CACHE).then(cache => {
-			cache.put(request, clone)
+			return cache.put(request, clone)
+		}).then(() => {
+			if(!servedCachedResponse) {
+				return
+			}
+
+			let contentType = clone.headers.get("Content-Type")
+
+			if(contentType && contentType.startsWith("text/html") && clone.headers.get("ETag") && request.headers.get("X-Reload") !== "true") {
+				reloadContent(clone)
+			}
 		})
 
 		return response
 	})
 
+	// Forced reload
+	if(request.headers.get("X-Reload") === "true") {
+		return evt.waitUntil(refresh)
+	}
+
 	// Try to serve cache first and fall back to network response
-	let networkOrCache = fromCache(request).catch(error => {
-		console.log("Cache MISS:", request.url)
+	let networkOrCache = fromCache(request).then(response => {
+		servedCachedResponse = true
+		return response
+	}).catch(error => {
+		// console.log("Cache MISS:", request.url)
 		return refresh
 	})
 
@@ -57,7 +85,7 @@ function fromCache(request) {
 	return caches.open(CACHE).then(cache => {
 		return cache.match(request).then(matching => {
 			if(matching) {
-				console.log("Cache HIT:", request.url)
+				// console.log("Cache HIT:", request.url)
 				return Promise.resolve(matching)
 			}
 
@@ -66,8 +94,16 @@ function fromCache(request) {
 	})
 }
 
-function updateCache(request, response) {
-	return caches.open(CACHE).then(cache => {
-		cache.put(request, response)
+function reloadContent(response) {
+	return (self as any).clients.matchAll().then(clients => {
+		clients.forEach(client => {
+			var message = {
+				type: 'content changed',
+				url: response.url,
+				eTag: response.headers.get('ETag')
+			}
+
+			client.postMessage(JSON.stringify(message))
+		})
 	})
 }