From d42ce1bffa8b4715420f6853beffd1ab569bef62 Mon Sep 17 00:00:00 2001
From: Matthew Somerville <matthew@mysociety.org>
Date: Mon, 20 Jan 2020 11:20:33 +0000
Subject: [PATCH] Catch POST in service worker, not by rewriting button.

---
 .../web/base/offline/service_worker.html      | 38 ++++++++++++++++++-
 web/cobrands/fixmystreet/offline.js           | 23 -----------
 2 files changed, 36 insertions(+), 25 deletions(-)

diff --git a/templates/web/base/offline/service_worker.html b/templates/web/base/offline/service_worker.html
index 025c2fe3dc4..0feb26ce663 100644
--- a/templates/web/base/offline/service_worker.html
+++ b/templates/web/base/offline/service_worker.html
@@ -6,6 +6,8 @@
 
 ~%]
 
+importScripts('https://cdn.jsdelivr.net/npm/idb-keyval@3/dist/idb-keyval-iife.min.js');
+
 const requiredOffline = [
   "[% version('/cobrands/' _ c.cobrand.asset_moniker _ '/base.css') %]",
   "[% version('/cobrands/' _ c.cobrand.asset_moniker _ '/layout.css') %]",
@@ -37,7 +39,39 @@
   const request = fetchEvent.request;
   const url = new URL(request.url);
 
-  if (request.method !== "GET" || url.origin !== location.origin) {
+  if (url.origin !== location.origin) {
+      return;
+  }
+
+  // Handle inspection form submission if offline...
+  if (request.method === 'POST' && RegExp('/report/\\d+$').test(url)) {
+    fetchEvent.respondWith(async function() {
+      const fetchPromise = fetch(request.clone());
+      try {
+        return await fetchPromise;
+      }
+      catch {
+        fetchEvent.waitUntil(async function() {
+          var text = await request.text();
+          let formData = new URLSearchParams(text);
+          formData.set('save', 2);
+          formData.set('saved_at', Math.floor(+new Date() / 1000));
+          formData = formData.toString();
+
+          var data = await idbKeyval.get('offlineData') || { cachedReports: {}, forms: [] };
+          var forms = data.forms;
+          if (!forms.length || formData != forms[forms.length - 1][1]) {
+            forms.push([request.url, formData]);
+          }
+          return idbKeyval.set('offlineData', data);
+        }());
+
+        return Response.redirect('/my/planned?saved=1');
+      };
+    }());
+  }
+
+  if (request.method !== "GET") {
       return;
   }
 
@@ -67,4 +101,4 @@
 });
 
 var offlineResponse = () =>
-    new Response('Service Unavailable', { status: 503, statusText: 'Service Unavailable', headers: { 'Content-Type': 'text/html' }});
\ No newline at end of file
+    new Response('Service Unavailable', { status: 503, statusText: 'Service Unavailable', headers: { 'Content-Type': 'text/html' }});
diff --git a/web/cobrands/fixmystreet/offline.js b/web/cobrands/fixmystreet/offline.js
index 6c984072bc2..e375bccc95a 100644
--- a/web/cobrands/fixmystreet/offline.js
+++ b/web/cobrands/fixmystreet/offline.js
@@ -146,15 +146,6 @@ fixmystreet.offlineData = (function() {
         getForms: function() {
             return getData().then(function(data) { return data.forms; });
         },
-        addForm: function(action, formData) {
-            updateData(function(data) {
-                var forms = data.forms;
-                if (!forms.length || formData != forms[forms.length - 1][1]) {
-                    forms.push([action, formData]);
-                }
-                fixmystreet.offlineBanner.update();
-            });
-        },
         shiftForm: function(idx) {
             updateData(function(data) {
                 data.forms.shift();
@@ -329,20 +320,6 @@ fixmystreet.offline = (function() {
                 });
             }
         });
-
-        // If we catch the form submit, e.g. Chrome still seems to
-        // try and submit and we get the Chrome offline error page
-        var btn = $('#report_inspect_form input[type=submit]');
-        btn.click(function() {
-            var form = $(this).closest('form');
-            var data = form.serialize() + '&save=1&saved_at=' + Math.floor(+new Date() / 1000);
-            fixmystreet.offlineData.addForm(form.attr('action'), data);
-            location.href = '/my/planned?saved=1';
-            return false;
-        });
-        btn[0].type = 'button';
-
-        return true;
     }
 
     return {