fix(patchUrlMappings): recreate script elements when patching their src attribute

docs/local-sdk-development.md

@@ -11,3 +11,4 @@ To test changes to the SDK, locally, with either of these projects, you must do
 
 1. From terminal, navigate to the root of either project's directory, (i.e. examples/discord-application-start or examples/sdk-playground)
 2. Start up the example's web server with `pnpm dev`.
+3. In another terminal, start up the SDK's development pipeline with `pnpm dev` from the root of the repository.

src/utils/patchUrlMappings.ts

@@ -96,7 +96,10 @@ export function patchUrlMappings(
         if (mutation.type === 'attributes' && mutation.attributeName === 'src') {
           attemptSetNodeSrc(mutation.target, mappings);
         } else if (mutation.type === 'childList') {
-          mutation.addedNodes.forEach((node) => recursivelyRemapChildNodes(node, mappings));
+          mutation.addedNodes.forEach((node) => {
+            attemptSetNodeSrc(node, mappings);
+            recursivelyRemapChildNodes(node, mappings);
+          });
         }
       }
     };
@@ -128,7 +131,30 @@ function attemptSetNodeSrc(node: Node, mappings: Mapping[]) {
   if (node instanceof HTMLElement && node.hasAttribute('src')) {
     const url = absoluteURL(node.getAttribute('src') ?? '');
     if (url.host === window.location.host) return;
-    node.setAttribute('src', attemptRemap({url, mappings}).toString());
+
+    if (node.tagName.toLowerCase() === 'script') {
+      // Scripts are a special case, and need to be wholly recreated since
+      // modifying a script tag doesn't refetch.
+      attemptRecreateScriptNode(node, {url, mappings});
+    } else {
+      node.setAttribute('src', attemptRemap({url, mappings}).toString());
+    }
+  }
+}
+
+function attemptRecreateScriptNode(node: HTMLElement, {url, mappings}: RemapInput) {
+  const newUrl = attemptRemap({url, mappings});
+  if (url.toString() !== newUrl.toString()) {
+    // Note: Script tags cannot be duplicated via `node.clone()` because their internal 'already started'
+    // state prevents the new one from being fetched. We must manually recreate the duplicate tag instead.
+    const newNode = document.createElement(node.tagName);
+    newNode.innerHTML = node.innerHTML;
+    for (const attr of node.attributes) {
+      newNode.setAttribute(attr.name, attr.value);
+    }
+    newNode.setAttribute('src', attemptRemap({url, mappings}).toString());
+    node.after(newNode);
+    node.remove();
   }
 }
 

tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "./tsconfig-base.json",
   "compilerOptions": {
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
     "rootDir": "src",
     // TODO: Enable this check. It is stricter.
     // https://app.asana.com/0/1202090529698493/1205406173366739/f