From 36e20fd110151cdf532b7483369d18fd82888441 Mon Sep 17 00:00:00 2001
From: Hikaru Y <47855854+hikaru-y@users.noreply.github.com>
Date: Tue, 4 Jan 2022 07:58:09 +0900
Subject: [PATCH] Guarantee execution order of <script> elements (#1574)

---
 ts/reviewer/index.ts | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/ts/reviewer/index.ts b/ts/reviewer/index.ts
index 5aca4410e..0726edfc4 100644
--- a/ts/reviewer/index.ts
+++ b/ts/reviewer/index.ts
@@ -59,7 +59,16 @@ export function _queueAction(action: Callback): void {
     _updatingQueue = _updatingQueue.then(action);
 }
 
-function setInnerHTML(element: Element, html: string): void {
+function replaceScriptPromise(script: HTMLScriptElement): Promise<void> {
+    return new Promise((resolve) => {
+        const newScript = script.cloneNode(true);
+        newScript.addEventListener("load", () => resolve());
+        newScript.addEventListener("error", () => resolve());
+        script.replaceWith(newScript);
+    });
+}
+
+async function setInnerHTML(element: Element, html: string): Promise<void> {
     for (const oldVideo of element.getElementsByTagName("video")) {
         oldVideo.pause();
 
@@ -73,14 +82,11 @@ function setInnerHTML(element: Element, html: string): void {
     element.innerHTML = html;
 
     for (const oldScript of element.getElementsByTagName("script")) {
-        const newScript = document.createElement("script");
-
-        for (const attribute of oldScript.attributes) {
-            newScript.setAttribute(attribute.name, attribute.value);
+        if (oldScript.src) {
+            await replaceScriptPromise(oldScript);
+        } else {
+            oldScript.replaceWith(oldScript.cloneNode(true));
         }
-
-        newScript.appendChild(document.createTextNode(oldScript.innerHTML));
-        oldScript.parentNode!.replaceChild(newScript, oldScript);
     }
 }