Fixed whitelisting for instant loading on localhost and Netlify previews

material/assets/manifest.json

@@ -1,12 +1,12 @@
 {
-  "assets/javascripts/bundle.js": "assets/javascripts/bundle.1fe7f735.min.js",
-  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.1fe7f735.min.js.map",
-  "assets/javascripts/vendor.js": "assets/javascripts/vendor.8caa27b7.min.js",
-  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.8caa27b7.min.js.map",
+  "assets/javascripts/bundle.js": "assets/javascripts/bundle.569c471b.min.js",
+  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.569c471b.min.js.map",
+  "assets/javascripts/vendor.js": "assets/javascripts/vendor.39a969d5.min.js",
+  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.39a969d5.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.37585f48.min.js",
   "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.37585f48.min.js.map",
-  "assets/stylesheets/main.css": "assets/stylesheets/main.90238df2.min.css",
-  "assets/stylesheets/main.css.map": "assets/stylesheets/main.90238df2.min.css.map",
-  "assets/stylesheets/palette.css": "assets/stylesheets/palette.85bb4ebe.min.css",
-  "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.85bb4ebe.min.css.map"
+  "assets/stylesheets/main.css": "assets/stylesheets/main.dce57e4d.min.css",
+  "assets/stylesheets/main.css.map": "assets/stylesheets/main.dce57e4d.min.css.map",
+  "assets/stylesheets/palette.css": "assets/stylesheets/palette.c929de0b.min.css",
+  "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.c929de0b.min.css.map"
 }

material/base.html

@@ -41,9 +41,9 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.90238df2.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.dce57e4d.min.css' | url }}">
       {% if palette.primary or palette.accent %}
-        <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.85bb4ebe.min.css' | url }}">
+        <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.c929de0b.min.css' | url }}">
       {% endif %}
       {% if palette.primary %}
         {% import "partials/palette.html" as map %}
@@ -178,8 +178,8 @@ <h1>{{ page.title | default(config.site_name, true)}}</h1>
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/vendor.8caa27b7.min.js' | url }}"></script>
-      <script src="{{ 'assets/javascripts/bundle.1fe7f735.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/vendor.39a969d5.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.569c471b.min.js' | url }}"></script>
       {%- set translations = {} -%}
       {%- for key in [
         "clipboard.copy",

src/assets/javascripts/index.ts

@@ -24,7 +24,7 @@
 // which must be tackled after we gathered some feedback on v5.
 // tslint:disable
 
-import { values } from "ramda"
+import { sortBy, prop, values } from "ramda"
 import {
   merge,
   combineLatest,
@@ -367,9 +367,31 @@ export function initialize(config: unknown) {
             pluck("response")
           )
         ),
-        map(document => (
-          getElements("loc", document).map(node => node.textContent!)
-        ))
+        withLatestFrom(base$),
+        map(([document, base]) => {
+          const urls = getElements("loc", document)
+            .map(node => node.textContent!)
+
+          // Hack: This is a temporary fix to normalize instant loading lookup
+          // on localhost and Netlify previews. If this approach proves to be
+          // suitable, we'll refactor URL whitelisting anyway. We take the two
+          // shortest URLs and determine the common prefix to isolate the
+          // domain. If there're no two domains, we just leave it as-is, as
+          // there isn't anything to be loaded anway.
+          if (urls.length > 1) {
+            const [a, b] = sortBy(prop("length"), urls)
+
+            /* Determine common prefix */
+            let index = 0
+            while (a.charAt(index) === b.charAt(index))
+              index++
+
+            /* Replace common prefix (i.e. base) with effective base */
+            for (let i = 0; i < urls.length; i++)
+              urls[i] = urls[i].replace(a.slice(0, index), `${base}/`)
+          }
+          return urls
+        })
       )
         .subscribe(urls => {
           setupInstantLoading(urls, { document$, location$, viewport$ })