Fixed sequential execution of scripts when using instant loading

material/assets/manifest.json

@@ -1,14 +1,14 @@
 {
-  "assets/javascripts/bundle.js": "assets/javascripts/bundle.b0a2e822.min.js",
+  "assets/javascripts/bundle.js": "assets/javascripts/bundle.d23ec273.min.js",
-  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.b0a2e822.min.js.map",
+  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.d23ec273.min.js.map",
-  "assets/javascripts/vendor.js": "assets/javascripts/vendor.48dbe4ba.min.js",
+  "assets/javascripts/vendor.js": "assets/javascripts/vendor.11f47dfd.min.js",
-  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.48dbe4ba.min.js.map",
+  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.11f47dfd.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.fae956e7.min.js",
   "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.fae956e7.min.js.map",
-  "assets/stylesheets/main.css": "assets/stylesheets/main.ff5e881c.min.css",
+  "assets/stylesheets/main.css": "assets/stylesheets/main.a32019b5.min.css",
-  "assets/stylesheets/main.css.map": "assets/stylesheets/main.ff5e881c.min.css.map",
+  "assets/stylesheets/main.css.map": "assets/stylesheets/main.a32019b5.min.css.map",
-  "assets/stylesheets/overrides.css": "assets/stylesheets/overrides.9399043a.min.css",
+  "assets/stylesheets/overrides.css": "assets/stylesheets/overrides.76317e44.min.css",
-  "assets/stylesheets/overrides.css.map": "assets/stylesheets/overrides.9399043a.min.css.map",
+  "assets/stylesheets/overrides.css.map": "assets/stylesheets/overrides.76317e44.min.css.map",
-  "assets/stylesheets/palette.css": "assets/stylesheets/palette.a99d9558.min.css",
+  "assets/stylesheets/palette.css": "assets/stylesheets/palette.38c36bb3.min.css",
-  "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.a99d9558.min.css.map"
+  "assets/stylesheets/palette.css.map": "assets/stylesheets/palette.38c36bb3.min.css.map"
 }

material/assets/stylesheets/overrides.76317e44.min.css

@@ -1,3 +1,3 @@
 .md-typeset .tx-insiders{color:#e91e63}.md-typeset .tx-switch button{cursor:pointer;transition:opacity 250ms}.md-typeset .tx-switch button:hover{opacity:.75}.md-typeset .tx-switch button>code{display:block;color:var(--md-primary-bg-color);background-color:var(--md-primary-fg-color)}.md-typeset .tx-columns{-moz-columns:2;columns:2}.md-typeset .tx-columns>*{-moz-column-break-inside:avoid;break-inside:avoid}.md-announce a,.md-announce a:focus,.md-announce a:hover{color:currentColor}.md-announce strong{white-space:nowrap}.md-announce .twitter{margin-left:.2em;color:#00acee}.tx-container{padding-top:1rem;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1123 258'><path d='M1124,2c0,0 0,256 0,256l-1125,0l0,-48c0,0 16,5 55,5c116,0 197,-92 325,-92c121,0 114,46 254,46c140,0 214,-167 572,-166Z' style='fill: hsla(0, 0%, 100%, 1)' /></svg>") no-repeat bottom,linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%)}[data-md-color-scheme=slate] .tx-container{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1123 258'><path d='M1124,2c0,0 0,256 0,256l-1125,0l0,-48c0,0 16,5 55,5c116,0 197,-92 325,-92c121,0 114,46 254,46c140,0 214,-167 572,-166Z' style='fill: hsla(232, 15%, 21%, 1)' /></svg>") no-repeat bottom,linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%)}@-webkit-keyframes tx-heart{0%,40%,80%,100%{transform:scale(1)}20%,60%{transform:scale(1.15)}}@keyframes tx-heart{0%,40%,80%,100%{transform:scale(1)}20%,60%{transform:scale(1.15)}}.tx-content__footer{margin-top:1rem;text-align:center}.tx-content__footer a{display:inline-block;color:#e91e63;transition:transform 250ms cubic-bezier(0.1, 0.7, 0.1, 1),color 125ms}.tx-content__footer a:focus,.tx-content__footer a:hover{transform:scale(1.2)}.tx-content__footer hr{display:inline-block;width:2rem;margin:1em;vertical-align:middle;background-color:currentColor;border:none}.tx-heart{-webkit-animation:tx-heart 1000ms infinite;animation:tx-heart 1000ms infinite}.tx-hero{margin:0 .8rem;color:var(--md-primary-bg-color)}.tx-hero h1{margin-bottom:1rem;color:currentColor;font-weight:700}@media screen and (max-width: 29.9375em){.tx-hero h1{font-size:1.4rem}}.tx-hero__content{padding-bottom:6rem}@media screen and (min-width: 60em){.tx-hero{display:flex;align-items:stretch}.tx-hero__content{max-width:19rem;margin-top:3.5rem;padding-bottom:14vw}.tx-hero__image{order:1;width:38rem;transform:translateX(4rem)}}@media screen and (min-width: 76.25em){.tx-hero__image{transform:translateX(8rem)}}.tx-hero .md-button{margin-top:.5rem;margin-right:.5rem;color:var(--md-primary-bg-color)}.tx-hero .md-button:hover,.tx-hero .md-button:focus{color:var(--md-default-bg-color);background-color:var(--md-accent-fg-color);border-color:var(--md-accent-fg-color)}.tx-hero .md-button--primary{color:#894da8;background-color:var(--md-primary-bg-color);border-color:var(--md-primary-bg-color)}
 
-/*# sourceMappingURL=overrides.9399043a.min.css.map*/
+/*# sourceMappingURL=overrides.76317e44.min.css.map*/

material/base.html

@@ -41,9 +41,9 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.ff5e881c.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.a32019b5.min.css' | url }}">
       {% if palette.scheme or palette.primary or palette.accent %}
-        <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.a99d9558.min.css' | url }}">
+        <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.38c36bb3.min.css' | url }}">
       {% endif %}
       {% if palette.primary %}
         {% import "partials/palette.html" as map %}
@@ -182,8 +182,8 @@
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/vendor.48dbe4ba.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/vendor.11f47dfd.min.js' | url }}"></script>
-      <script src="{{ 'assets/javascripts/bundle.b0a2e822.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.d23ec273.min.js' | url }}"></script>
       {%- set translations = {} -%}
       {%- for key in [
         "clipboard.copy",

material/overrides/main.html

@@ -22,7 +22,7 @@
   <meta name="twitter:title" content="{{ title }}">
   <meta name="twitter:description" content="{{ config.site_description }}">
   <meta name="twitter:image" content="{{ image }}">
-  <link rel="stylesheet" href="{{ 'assets/stylesheets/overrides.9399043a.min.css' | url }}">
+  <link rel="stylesheet" href="{{ 'assets/stylesheets/overrides.76317e44.min.css' | url }}">
 {% endblock %}
 {% block announce %}
   <a href="https://twitter.com/squidfunk">

src/assets/javascripts/patches/script/index.ts

@@ -20,8 +20,15 @@
  * IN THE SOFTWARE.
  */
 
-import { Observable } from "rxjs"
+import { EMPTY, Observable, noop, of } from "rxjs"
-import { map, skip, withLatestFrom } from "rxjs/operators"
+import {
+  concatMap,
+  filter,
+  map,
+  skip,
+  switchMap,
+  withLatestFrom
+} from "rxjs/operators"
 
 import {
   createElement,
@@ -63,15 +70,31 @@ export function patchScripts(
       map(([, el]) => getElements<HTMLScriptElement>("script", el))
     )
 
-  /* Evaluate all scripts via replacement */
+  /* Evaluate all scripts via replacement in order */
-  els$.subscribe(els => {
+  els$
-    for (const el of els) {
+    .pipe(
-      if (el.src || /(^|\/javascript)$/i.test(el.type)) {
+      switchMap(els => of(...els)),
+      filter(el => !!el.src || /(^|\/javascript)$/i.test(el.type)),
+      concatMap(el => {
         const script = createElement("script")
-        const key = el.src ? "src" : "textContent"
+        if (el.src) {
-        script[key] = el[key]!
+          script.src = el.src
-        replaceElement(el, script)
+          replaceElement(el, script)
-      }
+
-    }
+          /* Complete when script is loaded */
-  })
+          return new Observable(observer => {
+            script.onload = () => {
+              observer.complete()
+            }
+          })
+
+        /* Complete immediately */
+        } else {
+          script.textContent = el.textContent!
+          replaceElement(el, script)
+          return EMPTY
+        }
+      })
+    )
+      .subscribe(noop)
 }