Guard for presence of page-content in JS (#5138) [deploy]

* Guard for presence of page-content in JS

* Modify offline states sw

* Change from skipping . to skipping .js and .css

* Bump static cache version

app/assets/javascripts/base.js.erb

@@ -113,12 +113,11 @@ var instantClick
   }
 
   function changePage(title, body, newUrl, scrollY, pop) {
-    // NOT TOTALLY SURE THIS WORKS FOR ALL CASES
-    // HACKALICIOUS
+    var pageContentDiv = document.getElementById("page-content");
     if (document.getElementById("navigation-butt")) {
       document.getElementById("navigation-butt").classList.remove('showing')
     }
-    document.getElementsByTagName("BODY")[0].replaceChild(body, document.getElementById("page-content"))
+    document.getElementsByTagName("BODY")[0].replaceChild(body, pageContentDiv)
 
     var prog = document.getElementById("navigation-progress");
     prog.classList.remove("showing");
@@ -297,8 +296,8 @@ var instantClick
     }
 
     $timing.ready = +new Date - $timing.start
-
-    if (xhr.status === 200 && xhr.getResponseHeader('Content-Type').match(/\/(x|ht|xht)ml/)) {
+    var pageContentDiv = document.getElementById("page-content");
+    if (pageContentDiv && xhr.status === 200 && xhr.getResponseHeader('Content-Type').match(/\/(x|ht|xht)ml/)) {
       var doc = document.implementation.createHTMLDocument('');
       doc.documentElement.innerHTML = removeNoscriptTags(xhr.responseText)
       var title = doc.title

app/assets/javascripts/initializers/initializeFooterMod.js

@@ -2,9 +2,11 @@
 
 function initializeFooterMod() {
   var footerContainer = document.getElementById('footer-container');
+  var pageContent = document.getElementById('page-content')
   if (
     footerContainer &&
-    document.getElementById('page-content').className.indexOf('stories-show') >
+    pageContent && 
+    pageContent.className.indexOf('stories-show') >
       -1 &&
     !document.getElementById('IS_CENTERED_PAGE')
   ) {

app/views/service_worker/index.js.erb

@@ -1,6 +1,6 @@
 // Serviceworkers file. This code gets installed in users browsers and runs code before the request is made.
 <% unless Rails.env.test? %>
-  const staticCacheName = 'static-1';
+  const staticCacheName = 'static-1.1';
   const expectedCaches = [
     staticCacheName
   ];
@@ -88,7 +88,8 @@
         !event.request.referrer.includes('/signout_confirm') && // If this is the referrer, we instead want to flush.
         !url.href.includes('i=i') && // Parameter representing "internal" navigation.
         !url.href.includes('?signin') && // Don't run on sign in.
-        !url.href.includes('.') && // Don't run on sign in.
+        !url.href.includes('.js') && // Don't run on JS.
+        !url.href.includes('.css') && // Don't run on CSS.
         !url.href.includes('/onboarding') && // Don't run on onboarding.
         !url.href.includes('/api/') && // Don't run on API endpoints.
         !url.href.includes('/users/auth') && // Don't run on authentication.
@@ -118,7 +119,7 @@
               ]))
             }
           })
-        });
+        }).catch(err => caches.match('/offline.html'));
         return;
       }
 

public/offline.html

@@ -100,6 +100,10 @@
       margin-top: 20px;
     }
 
+    #footer-container {
+      display: none;
+    }
+
     @media only screen and (max-height: 700px) {
       h2 {
         font-size: 1.5em;