Add preference to bypass service worker cache

jmerle · jmerle · commit 0e9aa8847b3a · 2019-07-07T14:11:39.000+02:00
diff --git a/assets/javascripts/app/settings.coffee b/assets/javascripts/app/settings.coffee
@@ -5,6 +5,7 @@ class app.Settings
     'manualUpdate'
     'fastScroll'
     'arrowScroll'
+    'bypassCache'
     'docs'
     'dark'
     'layout'
@@ -91,6 +92,11 @@ class app.Settings
     @set 'size', value
     return
 
+  setBypassCache: (value) ->
+    @set 'bypassCache', value
+    app.serviceWorker?.updateInBackground()
+    return
+
   dump: ->
     @store.dump()
 
diff --git a/assets/javascripts/templates/pages/settings_tmpl.coffee b/assets/javascripts/templates/pages/settings_tmpl.coffee
@@ -15,6 +15,10 @@ app.templates.settingsPage = (settings) -> """
         <input type="checkbox" form="settings" name="layout" value="_sidebar-hidden"#{if settings['_sidebar-hidden'] then ' checked' else ''}>Automatically hide and show the sidebar
         <small>Tip: drag the edge of the sidebar to resize it.</small>
       </label>
+      <label class="_settings-label">
+        <input type="checkbox" form="settings" name="bypassCache" value="1"#{if settings.bypassCache then ' checked' else ''}>Bypass Service Worker cache
+        <small>When this is checked, the Service Worker will always fetch the latest version of requested files. Useful when making changes to the DevDocs source code.</small>
+      </label>
     </div>
   </div>
 
diff --git a/assets/javascripts/views/content/settings_page.coffee b/assets/javascripts/views/content/settings_page.coffee
@@ -14,6 +14,7 @@ class app.views.SettingsPage extends app.View
     settings.dark = app.settings.get('dark')
     settings.smoothScroll = !app.settings.get('fastScroll')
     settings.arrowScroll = app.settings.get('arrowScroll')
+    settings.bypassCache = app.settings.get('bypassCache')
     settings[layout] = app.settings.hasLayout(layout) for layout in app.settings.LAYOUTS
     settings
 
@@ -32,6 +33,10 @@ class app.views.SettingsPage extends app.View
     app.settings.set('fastScroll', !enable)
     return
 
+  toggleBypassCache: (enable) ->
+    app.settings.setBypassCache(!!enable)
+    return
+
   toggle: (name, enable) ->
     app.settings.set(name, enable)
     return
@@ -75,6 +80,8 @@ class app.views.SettingsPage extends app.View
         @toggleSmoothScroll input.checked
       when 'import'
         @import input.files[0], input
+      when 'bypassCache'
+        @toggleBypassCache input.checked
       else
         @toggle input.name, input.checked
     return
diff --git a/docs/adding-docs.md b/docs/adding-docs.md
@@ -2,6 +2,8 @@ Adding a documentation may look like a daunting task but once you get the hang o
 
 **Note:** please read the [contributing guidelines](../.github/CONTRIBUTING.md) before submitting a new documentation.
 
+**Note:** when editing any of the files in the `assets` directory or the `public` directory, you'll have to bypass the service worker cache. To do this, go to the Preferences page on your local instance of DevDocs, check "Bypass Service Worker cache" and refresh the page.
+
 1. Create a subclass of `Docs::UrlScraper` or `Docs::FileScraper` in the `lib/docs/scrapers/` directory. Its name should be the [PascalCase](http://api.rubyonrails.org/classes/String.html#method-i-camelize) equivalent of the filename (e.g. `my_doc` → `MyDoc`)
 2. Add the appropriate class attributes and filter options (see the [Scraper Reference](./scraper-reference.md) page).
 3. Check that the scraper is listed in `thor docs:list`.
diff --git a/lib/app.rb b/lib/app.rb
@@ -220,6 +220,10 @@ def dark_theme?
       app_theme == 'dark'
     end
 
+    def bypass_cache?
+      !memoized_cookies['bypassCache'].nil?
+    end
+
     def redirect_via_js(path)
       response.set_cookie :initial_path, value: path, expires: Time.now + 15, path: '/'
       redirect '/', 302
diff --git a/views/service-worker.js.erb b/views/service-worker.js.erb
@@ -31,13 +31,16 @@ self.addEventListener('activate', event => {
   event.waitUntil((async () => {
     const keys = await caches.keys();
     const jobs = keys.map(key => key !== cacheName ? caches.delete(key) : Promise.resolve());
-    return await Promise.all(jobs);
+    return Promise.all(jobs);
   })());
 });
 
 <%# Handle HTTP requests %>
 self.addEventListener('fetch', event => {
   event.respondWith((async () => {
+    <% if bypass_cache? %>
+    return fetch(event.request);
+    <% else %>
     const cachedResponse = await caches.match(event.request);
     if (cachedResponse) return cachedResponse;
 
@@ -56,5 +59,6 @@ self.addEventListener('fetch', event => {
 
       throw err;
     }
+    <% end %>
   })());
 });
