Synchronize HTML page cache with sessions (#6815)

2 files changed, 26 insertions, 6 deletions

diff --git a/.babelrc b/.babelrc
index de922f389..ed28aa500 100644
--- a/.babelrc
+++ b/.babelrc
@@ -4,6 +4,8 @@
     [
       "env",
       {
+        "debug": true,
+        "exclude": ["transform-async-to-generator", "transform-regenerator"],
         "loose": true,
         "modules": false,
         "targets": {
diff --git a/app/javascript/mastodon/service_worker/entry.js b/app/javascript/mastodon/service_worker/entry.js
index ad933b95e..8b65f27a3 100644
--- a/app/javascript/mastodon/service_worker/entry.js
+++ b/app/javascript/mastodon/service_worker/entry.js
@@ -1,5 +1,9 @@
 import './web_push_notifications';
 
+function openCache() {
+  return caches.open('mastodon-web');
+}
+
 function fetchRoot() {
   return fetch('/', { credentials: 'include' });
 }
@@ -7,10 +11,7 @@ function fetchRoot() {
 // Cause a new version of a registered Service Worker to replace an existing one
 // that is already installed, and replace the currently active worker on open pages.
 self.addEventListener('install', function(event) {
-  const promises = Promise.all([caches.open('mastodon-web'), fetchRoot()]);
-  const asyncAdd = promises.then(([cache, root]) => cache.put('/', root));
-
-  event.waitUntil(asyncAdd);
+  event.waitUntil(Promise.all([openCache(), fetchRoot()]).then(([cache, root]) => cache.put('/', root)));
 });
 self.addEventListener('activate', function(event) {
   event.waitUntil(self.clients.claim());
@@ -19,12 +20,29 @@ self.addEventListener('fetch', function(event) {
   const url = new URL(event.request.url);
 
   if (url.pathname.startsWith('/web/')) {
-    event.respondWith(fetchRoot().then(response => {
+    const asyncResponse = fetchRoot();
+    const asyncCache = openCache();
+
+    event.respondWith(asyncResponse.then(async response => {
       if (response.ok) {
-        return response;
+        const cache = await asyncCache;
+        await cache.put('/', response);
+        return response.clone();
       }
 
       throw null;
     }).catch(() => caches.match('/')));
+  } else if (url.pathname === '/auth/sign_out') {
+    const asyncResponse = fetch(event.request);
+    const asyncCache = openCache();
+
+    event.respondWith(asyncResponse.then(async response => {
+      if (response.ok || response.type === 'opaqueredirect') {
+        const cache = await asyncCache;
+        await cache.delete('/');
+      }
+
+      return response;
+    }));
   }
 });