From 48d38f9c8576de5e8433b9dd67272a456b218a7c Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 16:24:10 +0900
Subject: [PATCH 01/14] refactor: use import() to load assets

---
 .babelrc                                    |   4 +
 .eslintrc.json                              |   1 +
 package-lock.json                           | 235 +++++++++++++++++++-
 package.json                                |   4 +
 src/core/algorithms.js                      |  16 +-
 src/core/best-practices.js                  |  13 +-
 src/core/caniuse.js                         |  21 +-
 src/core/examples.js                        |  15 +-
 src/core/highlight-vars.js                  |  14 +-
 src/core/highlight.js                       |  18 +-
 src/core/issues-notes.js                    |  13 +-
 src/core/style.js                           |  29 ++-
 src/core/ui.js                              |  24 +-
 src/core/webidl-clipboard.js                |  24 +-
 src/core/webidl.js                          |  16 +-
 src/core/worker.js                          |  29 ++-
 src/jsconfig.json                           |   5 +-
 src/type-helper.d.ts                        |   4 +
 tools/babel-plugin-import-meta-requirejs.js |  54 +++++
 tools/builder.js                            |   6 +
 20 files changed, 485 insertions(+), 60 deletions(-)
 create mode 100644 tools/babel-plugin-import-meta-requirejs.js

diff --git a/.babelrc b/.babelrc
index 3097139d3e..97615bd82f 100644
--- a/.babelrc
+++ b/.babelrc
@@ -7,5 +7,9 @@
         "modules": "amd"
       }
     ]
+  ],
+  "plugins": [
+    "./tools/babel-plugin-import-meta-requirejs",
+    "dynamic-import-amd"
   ]
 }
diff --git a/.eslintrc.json b/.eslintrc.json
index 633a658a71..7560bdfa8e 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -8,6 +8,7 @@
     "worker": true
   },
   "extends": ["eslint:recommended", "plugin:prettier/recommended"],
+  "parser": "babel-eslint",
   "parserOptions": {
     "sourceType": "module",
     "ecmaVersion": 2019
diff --git a/package-lock.json b/package-lock.json
index d47b873087..2b22eabd75 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -428,6 +428,15 @@
         "@babel/helper-plugin-utils": "^7.0.0"
       }
     },
+    "@babel/plugin-syntax-import-meta": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.2.0.tgz",
+      "integrity": "sha512-Hq6kFSZD7+PHkmBN8bCpHR6J8QEoCuEV/B38AIQscYjgMZkGlXB7cHNFzP5jR4RCh5545yP1ujHdmO7hAgKtBA==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.0.0"
+      }
+    },
     "@babel/plugin-syntax-json-strings": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-json-strings/-/plugin-syntax-json-strings-7.2.0.tgz",
@@ -1451,6 +1460,189 @@
       "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
       "dev": true
     },
+    "babel-code-frame": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
+      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
+      "dev": true,
+      "requires": {
+        "chalk": "^1.1.3",
+        "esutils": "^2.0.2",
+        "js-tokens": "^3.0.2"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+          "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+          "dev": true
+        },
+        "ansi-styles": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
+          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
+          "dev": true
+        },
+        "chalk": {
+          "version": "1.1.3",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^2.2.1",
+            "escape-string-regexp": "^1.0.2",
+            "has-ansi": "^2.0.0",
+            "strip-ansi": "^3.0.0",
+            "supports-color": "^2.0.0"
+          }
+        },
+        "js-tokens": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
+          "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+          "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^2.0.0"
+          }
+        },
+        "supports-color": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
+          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
+          "dev": true
+        }
+      }
+    },
+    "babel-eslint": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.0.1.tgz",
+      "integrity": "sha512-z7OT1iNV+TjOwHNLLyJk+HN+YVWX+CLE6fPD2SymJZOZQBs+QIexFjhm4keGTm8MW9xr4EC9Q0PbaLB24V5GoQ==",
+      "dev": true,
+      "requires": {
+        "@babel/code-frame": "^7.0.0",
+        "@babel/parser": "^7.0.0",
+        "@babel/traverse": "^7.0.0",
+        "@babel/types": "^7.0.0",
+        "eslint-scope": "3.7.1",
+        "eslint-visitor-keys": "^1.0.0"
+      },
+      "dependencies": {
+        "eslint-scope": {
+          "version": "3.7.1",
+          "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz",
+          "integrity": "sha1-PWPD7f2gLgbgGkUq2IyqzHzctug=",
+          "dev": true,
+          "requires": {
+            "esrecurse": "^4.1.0",
+            "estraverse": "^4.1.1"
+          }
+        }
+      }
+    },
+    "babel-messages": {
+      "version": "6.23.0",
+      "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
+      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=",
+      "dev": true,
+      "requires": {
+        "babel-runtime": "^6.22.0"
+      }
+    },
+    "babel-plugin-dynamic-import-amd": {
+      "version": "github:holyzfy/babel-plugin-dynamic-import-amd#1bbaf86d4472c2eef0fc01f3199d637a4b6c51e2",
+      "from": "github:holyzfy/babel-plugin-dynamic-import-amd",
+      "dev": true,
+      "requires": {
+        "babel-plugin-syntax-dynamic-import": "^6.18.0",
+        "babel-template": "^6.22.0"
+      }
+    },
+    "babel-plugin-syntax-dynamic-import": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
+      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=",
+      "dev": true
+    },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+      "dev": true,
+      "requires": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      }
+    },
+    "babel-template": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
+      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=",
+      "dev": true,
+      "requires": {
+        "babel-runtime": "^6.26.0",
+        "babel-traverse": "^6.26.0",
+        "babel-types": "^6.26.0",
+        "babylon": "^6.18.0",
+        "lodash": "^4.17.4"
+      }
+    },
+    "babel-traverse": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
+      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=",
+      "dev": true,
+      "requires": {
+        "babel-code-frame": "^6.26.0",
+        "babel-messages": "^6.23.0",
+        "babel-runtime": "^6.26.0",
+        "babel-types": "^6.26.0",
+        "babylon": "^6.18.0",
+        "debug": "^2.6.8",
+        "globals": "^9.18.0",
+        "invariant": "^2.2.2",
+        "lodash": "^4.17.4"
+      },
+      "dependencies": {
+        "globals": {
+          "version": "9.18.0",
+          "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
+          "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==",
+          "dev": true
+        }
+      }
+    },
+    "babel-types": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
+      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=",
+      "dev": true,
+      "requires": {
+        "babel-runtime": "^6.26.0",
+        "esutils": "^2.0.2",
+        "lodash": "^4.17.4",
+        "to-fast-properties": "^1.0.3"
+      },
+      "dependencies": {
+        "to-fast-properties": {
+          "version": "1.0.3",
+          "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
+          "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
+          "dev": true
+        }
+      }
+    },
+    "babylon": {
+      "version": "6.18.0",
+      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
+      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==",
+      "dev": true
+    },
     "backo2": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
@@ -1688,7 +1880,7 @@
     },
     "browserify-aes": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
+      "resolved": "http://registry.npmjs.org/browserify-aes/-/browserify-aes-1.2.0.tgz",
       "integrity": "sha512-+7CHXqGuspUn/Sl5aO7Ea0xWGAtETPXNSAjHo48JfLdPWcMng33Xe4znFvQweqc/uzk5zSOI3H52CYnjCfb5hA==",
       "dev": true,
       "requires": {
@@ -1733,7 +1925,7 @@
     },
     "browserify-rsa": {
       "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
+      "resolved": "http://registry.npmjs.org/browserify-rsa/-/browserify-rsa-4.0.1.tgz",
       "integrity": "sha1-IeCr+vbyApzy+vsTNWenAdQTVSQ=",
       "dev": true,
       "requires": {
@@ -1778,7 +1970,7 @@
     },
     "buffer": {
       "version": "4.9.1",
-      "resolved": "https://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
+      "resolved": "http://registry.npmjs.org/buffer/-/buffer-4.9.1.tgz",
       "integrity": "sha1-bRu2AbB6TvztlwlBMgkwJ8lbwpg=",
       "dev": true,
       "requires": {
@@ -2508,7 +2700,7 @@
     },
     "create-hash": {
       "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
+      "resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
       "integrity": "sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==",
       "dev": true,
       "requires": {
@@ -2521,7 +2713,7 @@
     },
     "create-hmac": {
       "version": "1.1.7",
-      "resolved": "https://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
+      "resolved": "http://registry.npmjs.org/create-hmac/-/create-hmac-1.1.7.tgz",
       "integrity": "sha512-MJG9liiZ+ogc4TzUwuvbER1JRdgvUFSB5+VR/g5h82fGaIRWMWddtKBHi7/sVhfjQZ6SehlyhvQYrcYkaUIpLg==",
       "dev": true,
       "requires": {
@@ -2762,7 +2954,7 @@
     },
     "diffie-hellman": {
       "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
+      "resolved": "http://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
       "integrity": "sha512-kqag/Nl+f3GwyK25fhUMYj81BUOrZ9IuJsjIcDE5icNM9FJHAVm3VcUDxdLPoQtTuUylWm6ZIknYJwwaPxsUzg==",
       "dev": true,
       "requires": {
@@ -4693,7 +4885,7 @@
     },
     "got": {
       "version": "6.7.1",
-      "resolved": "https://registry.npmjs.org/got/-/got-6.7.1.tgz",
+      "resolved": "http://registry.npmjs.org/got/-/got-6.7.1.tgz",
       "integrity": "sha1-JAzQV4WpoY5WHcG0S0HHY+8ejbA=",
       "requires": {
         "create-error-class": "^3.0.0",
@@ -4749,6 +4941,23 @@
         "function-bind": "^1.1.1"
       }
     },
+    "has-ansi": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
+      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
+      "dev": true,
+      "requires": {
+        "ansi-regex": "^2.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "2.1.1",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
+          "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
+          "dev": true
+        }
+      }
+    },
     "has-binary2": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
@@ -7606,6 +7815,12 @@
         "regenerate": "^1.4.0"
       }
     },
+    "regenerator-runtime": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
+      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
+      "dev": true
+    },
     "regenerator-transform": {
       "version": "0.13.4",
       "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.13.4.tgz",
@@ -9170,7 +9385,7 @@
     },
     "through": {
       "version": "2.3.8",
-      "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
       "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
     },
     "through2": {
@@ -9981,7 +10196,7 @@
     },
     "wrap-ansi": {
       "version": "2.1.0",
-      "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
       "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=",
       "requires": {
         "string-width": "^1.0.1",
@@ -10003,7 +10218,7 @@
         },
         "string-width": {
           "version": "1.0.2",
-          "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
           "requires": {
             "code-point-at": "^1.0.0",
diff --git a/package.json b/package.json
index 3092b221b0..704c0f78e3 100644
--- a/package.json
+++ b/package.json
@@ -23,8 +23,12 @@
   "devDependencies": {
     "@babel/cli": "^7.4.3",
     "@babel/core": "^7.4.3",
+    "@babel/plugin-syntax-import-meta": "^7.2.0",
     "@babel/preset-env": "^7.4.3",
+    "@babel/template": "^7.4.0",
     "@types/pluralize": "0.0.29",
+    "babel-eslint": "^10.0.1",
+    "babel-plugin-dynamic-import-amd": "github:holyzfy/babel-plugin-dynamic-import-amd",
     "chai": "^4.2.0",
     "clipboard": "^2.0.4",
     "domReady": "github:requirejs/domReady#d85bdc38a6df868ead52ab3e80715aaf60e68765",
diff --git a/src/core/algorithms.js b/src/core/algorithms.js
index dff03f0ad9..354af83308 100644
--- a/src/core/algorithms.js
+++ b/src/core/algorithms.js
@@ -1,11 +1,21 @@
+// @ts-check
 /**
 Currently used only for adding 'assert' class to algorithm lists
 */
 
-import css from "text!../../assets/algorithms.css";
-
 export const name = "core/algorithms";
 
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/algorithms.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/algorithms.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
 export async function run() {
   const elements = Array.from(document.querySelectorAll("ol.algorithm li"));
   elements
@@ -13,7 +23,7 @@ export async function run() {
     .forEach(li => li.classList.add("assert"));
   if (document.querySelector(".assert")) {
     const style = document.createElement("style");
-    style.textContent = css;
+    style.textContent = await loadStyle();
     document.head.appendChild(style);
   }
 }
diff --git a/src/core/best-practices.js b/src/core/best-practices.js
index 03b90e0889..82f1ea49d8 100644
--- a/src/core/best-practices.js
+++ b/src/core/best-practices.js
@@ -4,13 +4,21 @@
 // The summary is generated if there is a section in the document with ID bp-summary.
 // Best practices are marked up with span.practicelab.
 import { addId } from "./utils";
-import css from "text!../../assets/bp.css";
 import hyperHTML from "hyperhtml";
 import { pub } from "./pubsubhub";
 
 export const name = "core/best-practices";
 
-export function run() {
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/bp.css")).default;
+  } catch {
+    const res = await fetch(new URL("../../assets/bp.css", import.meta.url));
+    return await res.text();
+  }
+}
+
+export async function run() {
   let num = 0;
   const bps = document.querySelectorAll("span.practicelab");
   const ul = document.createElement("ul");
@@ -27,6 +35,7 @@ export function run() {
   }
   const bpSummary = document.getElementById("bp-summary");
   if (bps.length) {
+    const css = await loadStyle();
     document.head.insertBefore(
       hyperHTML`<style>${[css]}</style>`,
       document.head.querySelector("link")
diff --git a/src/core/caniuse.js b/src/core/caniuse.js
index ee4d06f184..1c473e7b51 100644
--- a/src/core/caniuse.js
+++ b/src/core/caniuse.js
@@ -4,7 +4,6 @@
  * Usage options: https://github.com/w3c/respec/wiki/caniuse
  */
 import { pub, sub } from "./pubsubhub";
-import caniuseCss from "text!../../assets/caniuse.css";
 import { createResourceHint } from "./utils";
 import hyperHTML from "hyperhtml";
 
@@ -42,6 +41,17 @@ const supportTitles = new Map([
   ["d", "Disabled by default (needs to enabled)."],
 ]);
 
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/caniuse.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/caniuse.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
 export async function run(conf) {
   if (!conf.caniuse) {
     return; // nothing to do.
@@ -56,9 +66,12 @@ export async function run(conf) {
     hint: "preconnect",
     href: "https://respec.org",
   });
-  document.head.appendChild(link);
-  document.head.appendChild(hyperHTML`
-    <style class="removeOnSave">${caniuseCss}</style>`);
+  const caniuseCss = await loadStyle();
+  document.head.append(
+    link,
+    hyperHTML`
+      <style class="removeOnSave">${caniuseCss}</style>`
+  );
 
   const headDlElem = document.querySelector(".head dl");
   const contentPromise = new Promise(async resolve => {
diff --git a/src/core/examples.js b/src/core/examples.js
index d3187b936b..502bf1e254 100644
--- a/src/core/examples.js
+++ b/src/core/examples.js
@@ -7,7 +7,6 @@
 // be used by a containing shell to extract all examples.
 
 import { addId } from "./utils";
-import css from "text!../../assets/examples.css";
 import { lang as defaultLang } from "../core/l10n";
 import html from "hyperhtml";
 import { pub } from "./pubsubhub";
@@ -58,13 +57,25 @@ function makeTitle(conf, elem, num, report) {
   `;
 }
 
-export function run(conf) {
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/examples.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/examples.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
+export async function run(conf) {
   /** @type {NodeListOf<HTMLElement>} */
   const examples = document.querySelectorAll(
     "pre.example, pre.illegal-example, aside.example"
   );
   if (!examples.length) return;
 
+  const css = await loadStyle();
   document.head.insertBefore(
     html`
       <style>
diff --git a/src/core/highlight-vars.js b/src/core/highlight-vars.js
index e44d5742d3..cbcf740be3 100644
--- a/src/core/highlight-vars.js
+++ b/src/core/highlight-vars.js
@@ -6,17 +6,16 @@
  * All is done while keeping in mind that exported html stays clean
  * on export.
  */
-import hlVars from "text!../../assets/var.css";
 import { sub } from "./pubsubhub";
 
 export const name = "core/highlight-vars";
 
-export function run(conf) {
+export async function run(conf) {
   if (!conf.highlightVars) {
     return;
   }
   const styleElement = document.createElement("style");
-  styleElement.textContent = hlVars;
+  styleElement.textContent = await loadStyle();
   styleElement.classList.add("removeOnSave");
   document.head.appendChild(styleElement);
 
@@ -30,6 +29,15 @@ export function run(conf) {
   });
 }
 
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/var.css")).default;
+  } catch {
+    const res = await fetch(new URL("../../assets/var.css", import.meta.url));
+    return await res.text();
+  }
+}
+
 function highlightListener(ev) {
   ev.stopPropagation();
   const { target: varElem } = ev;
diff --git a/src/core/highlight.js b/src/core/highlight.js
index 4fbb08f47e..aa8dac32df 100644
--- a/src/core/highlight.js
+++ b/src/core/highlight.js
@@ -3,10 +3,9 @@
  *
  * Performs syntax highlighting to all pre and code elements.
  */
-import ghCss from "text!../../assets/github.css";
 import html from "hyperhtml";
 import { msgIdGenerator } from "./utils";
-import { worker } from "./worker";
+import { workerPromise } from "./worker";
 export const name = "core/highlight";
 
 const nextMsgId = msgIdGenerator("highlight");
@@ -45,13 +44,14 @@ async function highlightElement(elem) {
   elem.setAttribute("aria-busy", "false");
 }
 
-function sendHighlightRequest(code, languages) {
+async function sendHighlightRequest(code, languages) {
   const msg = {
     action: "highlight",
     code,
     id: nextMsgId(),
     languages,
   };
+  const worker = await workerPromise;
   worker.postMessage(msg);
   return new Promise((resolve, reject) => {
     const timeoutId = setTimeout(() => {
@@ -69,6 +69,17 @@ function sendHighlightRequest(code, languages) {
   });
 }
 
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/github.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/github.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
 export async function run(conf) {
   // Nothing to highlight
   if (conf.noHighlightCSS) return;
@@ -86,6 +97,7 @@ export async function run(conf) {
   if (!highlightables.length) {
     return;
   }
+  const ghCss = await loadStyle();
   const promisesToHighlight = highlightables
     .filter(elem => elem.textContent.trim())
     .map(highlightElement);
diff --git a/src/core/issues-notes.js b/src/core/issues-notes.js
index bee4c51bcf..f5d55ad9bd 100644
--- a/src/core/issues-notes.js
+++ b/src/core/issues-notes.js
@@ -11,7 +11,6 @@
 // If the configuration has issueBase set to a non-empty string, and issues are
 // manually numbered, a link to the issue is created using issueBase and the issue number
 import { addId, joinAnd, parents } from "./utils";
-import css from "text!../../assets/issues-notes.css";
 import { lang as defaultLang } from "../core/l10n";
 import { fetchAndStoreGithubIssues } from "./github-api";
 import hyperHTML from "hyperhtml";
@@ -266,6 +265,17 @@ function createLabel(label, repoURL) {
     href="${issuesURL.href}">${name}</a>`;
 }
 
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/issues-notes.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/issues-notes.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
 export async function run(conf) {
   const query = ".issue, .note, .warning, .ednote";
   /** @type {NodeListOf<HTMLElement>} */
@@ -273,6 +283,7 @@ export async function run(conf) {
   if (!issuesAndNotes.length) {
     return; // nothing to do.
   }
+  const css = await loadStyle();
   /** @type {Map<number, GitHubIssue>} */
   const ghIssues = conf.githubAPI
     ? await fetchAndStoreGithubIssues(conf)
diff --git a/src/core/style.js b/src/core/style.js
index 7dbce61abd..21d7f95e96 100644
--- a/src/core/style.js
+++ b/src/core/style.js
@@ -8,17 +8,32 @@
 // CONFIGURATION
 //  - noReSpecCSS: if you're using a profile that loads this module but you don't want
 //    the style, set this to true
-import css from "text!../../assets/respec2.css";
 export const name = "core/style";
 
 // Opportunistically inserts the style, with the chance to reduce some FOUC
-const styleElement = document.createElement("style");
-styleElement.id = "respec-mainstyle";
-styleElement.textContent = css;
-document.head.appendChild(styleElement);
+const styleElement = insertStyle();
 
-export function run(conf) {
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/respec2.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/respec2.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
+async function insertStyle() {
+  const styleElement = document.createElement("style");
+  styleElement.id = "respec-mainstyle";
+  styleElement.textContent = await loadStyle();
+  document.head.appendChild(styleElement);
+  return styleElement;
+}
+
+export async function run(conf) {
   if (conf.noReSpecCSS) {
-    styleElement.remove();
+    (await styleElement).remove();
   }
 }
diff --git a/src/core/ui.js b/src/core/ui.js
index 9d93b51977..fa5a616109 100644
--- a/src/core/ui.js
+++ b/src/core/ui.js
@@ -9,7 +9,6 @@
 //  - make a release candidate that people can test
 //  - once we have something decent, merge, ship as 3.2.0
 
-import css from "text!../../assets/ui.css";
 import hyperHTML from "hyperhtml";
 import { markdownToHtml } from "./utils";
 import shortcut from "../shortcut";
@@ -17,12 +16,25 @@ import { sub } from "./pubsubhub";
 export const name = "core/ui";
 
 // Opportunistically inserts the style, with the chance to reduce some FOUC
-const styleElement = document.createElement("style");
-styleElement.id = "respec-ui-styles";
-styleElement.textContent = css;
-styleElement.classList.add("removeOnSave");
+insertStyle();
 
-document.head.appendChild(styleElement);
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/ui.css")).default;
+  } catch {
+    const res = await fetch(new URL("../../assets/ui.css", import.meta.url));
+    return await res.text();
+  }
+}
+
+async function insertStyle() {
+  const styleElement = document.createElement("style");
+  styleElement.id = "respec-ui-styles";
+  styleElement.textContent = await loadStyle();
+  styleElement.classList.add("removeOnSave");
+  document.head.appendChild(styleElement);
+  return styleElement;
+}
 
 function ariaDecorate(elem, ariaMap) {
   if (!elem) {
diff --git a/src/core/webidl-clipboard.js b/src/core/webidl-clipboard.js
index 8e68f3019e..5e887493bd 100644
--- a/src/core/webidl-clipboard.js
+++ b/src/core/webidl-clipboard.js
@@ -6,15 +6,8 @@
  *
  */
 import Clipboard from "clipboard";
-import svgClipboard from "text!../../assets/clipboard.svg";
 export const name = "core/webidl-clipboard";
 
-// This button serves a prototype that we clone as needed.
-const copyButton = document.createElement("button");
-copyButton.innerHTML = svgClipboard;
-copyButton.title = "Copy IDL to clipboard";
-copyButton.classList.add("respec-button-copy-paste", "removeOnSave");
-
 const clipboardOps = {
   text: trigger => {
     return document
@@ -26,7 +19,24 @@ const clipboardOps = {
   },
 };
 
+async function loadImage() {
+  try {
+    return (await import("text!../../assets/clipboard.svg")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/clipboard.svg", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
 export async function run() {
+  // This button serves a prototype that we clone as needed.
+  const copyButton = document.createElement("button");
+  copyButton.innerHTML = await loadImage();
+  copyButton.title = "Copy IDL to clipboard";
+  copyButton.classList.add("respec-button-copy-paste", "removeOnSave");
+
   Array.from(document.querySelectorAll("pre.idl"))
     .map(elem => {
       const button = copyButton.cloneNode(true);
diff --git a/src/core/webidl.js b/src/core/webidl.js
index b9d0b69f30..1a8d5f256f 100644
--- a/src/core/webidl.js
+++ b/src/core/webidl.js
@@ -6,7 +6,6 @@
 //  - don't use generated content in the CSS!
 import * as webidl2 from "webidl2";
 import { flatten, normalizePadding } from "./utils";
-import css from "text!../../assets/webidl.css";
 import { findDfn } from "./dfn-finder";
 import hyperHTML from "hyperhtml";
 import { pub } from "./pubsubhub";
@@ -274,7 +273,18 @@ function getDefnName(defn) {
   return "";
 }
 
-export function run() {
+async function loadStyle() {
+  try {
+    return (await import("text!../../assets/webidl.css")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/webidl.css", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
+export async function run() {
   const idls = document.querySelectorAll("pre.idl");
   if (!idls.length) {
     return;
@@ -283,7 +293,7 @@ export function run() {
     const link = document.querySelector("head link");
     if (link) {
       const style = document.createElement("style");
-      style.textContent = css;
+      style.textContent = await loadStyle();
       link.before(style);
     }
   }
diff --git a/src/core/worker.js b/src/core/worker.js
index 5b034073b2..a4bb58bbb7 100644
--- a/src/core/worker.js
+++ b/src/core/worker.js
@@ -6,10 +6,9 @@
  */
 export const name = "core/worker";
 
-// Opportunistically preload syntax highlighter, which is used by the worker
 import { createResourceHint } from "./utils";
 import { expose } from "./expose-modules";
-import workerScript from "text!../../worker/respec-worker.js";
+
 // Opportunistically preload syntax highlighter
 const hint = {
   hint: "preload",
@@ -19,9 +18,25 @@ const hint = {
 const link = createResourceHint(hint);
 document.head.appendChild(link);
 
-const workerURL = URL.createObjectURL(
-  new Blob([workerScript], { type: "application/javascript" })
-);
-export const worker = new Worker(workerURL);
+async function loadWorkerScript() {
+  try {
+    return (await import("text!../../assets/respec-worker.js")).default;
+  } catch {
+    const res = await fetch(
+      new URL("../../assets/respec-worker.js", import.meta.url)
+    );
+    return await res.text();
+  }
+}
+
+async function createWorker() {
+  const workerScript = await loadWorkerScript();
+  const workerURL = URL.createObjectURL(
+    new Blob([workerScript], { type: "application/javascript" })
+  );
+  const worker = new Worker(workerURL);
+  expose(name, { worker });
+  return worker;
+}
 
-expose(name, { worker });
+export const workerPromise = createWorker();
diff --git a/src/jsconfig.json b/src/jsconfig.json
index 5f395f2fc4..ed124461ec 100644
--- a/src/jsconfig.json
+++ b/src/jsconfig.json
@@ -1,7 +1,8 @@
 {
   "compilerOptions": {
-    "target": "es2019",
+    "target": "esnext",
     "moduleResolution": "node",
-    "noImplicitThis": true
+    "noImplicitThis": true,
+    "module": "esnext"
   }
 }
diff --git a/src/type-helper.d.ts b/src/type-helper.d.ts
index c89578008c..3f7a805185 100644
--- a/src/type-helper.d.ts
+++ b/src/type-helper.d.ts
@@ -34,3 +34,7 @@ interface Node {
 }
 
 declare function fetch(input: URL, init?: RequestInit): Promise<Response>;
+
+interface ImportMeta {
+  url: string;
+}
diff --git a/tools/babel-plugin-import-meta-requirejs.js b/tools/babel-plugin-import-meta-requirejs.js
new file mode 100644
index 0000000000..2b1234cf0e
--- /dev/null
+++ b/tools/babel-plugin-import-meta-requirejs.js
@@ -0,0 +1,54 @@
+"use strict";
+
+const { ast } = require("@babel/template").default;
+const { default: inherits } = require("@babel/plugin-syntax-import-meta");
+
+module.exports = () => ({
+  inherits,
+  visitor: {
+    Program(path) {
+      const metas = [];
+      const identifiers = new Set();
+
+      path.traverse({
+        MetaProperty(path) {
+          const {
+            node: { meta, property },
+            scope,
+          } = path;
+
+          if (meta && meta.name === "import" && property.name === "meta") {
+            metas.push(path);
+          }
+
+          for (const name of Object.keys(scope.getAllBindings())) {
+            identifiers.add(name);
+          }
+        },
+      });
+
+      if (!metas.length) {
+        return;
+      }
+
+      const metaId = getUid("importMeta");
+      const module = getUid("module");
+
+      path.node.body.unshift(
+        ast`import * as ${module} from 'module';`,
+        ast`const ${metaId} = { url: new URL(${module}.uri, document.baseURI).href };`
+      );
+
+      for (const meta of metas) {
+        meta.replaceWith(ast`${metaId}`);
+      }
+
+      function getUid(id) {
+        while (identifiers.has(id)) {
+          id = path.scope.generateUidIdentifier(id).name;
+        }
+        return id;
+      }
+    },
+  },
+});
diff --git a/tools/builder.js b/tools/builder.js
index 82f49076a9..771cd33c4d 100755
--- a/tools/builder.js
+++ b/tools/builder.js
@@ -147,6 +147,12 @@ const Builder = {
         alias: { text: "raw-loader" },
       },
       devtool: "source-map",
+      plugins: [
+        // prevents generating empty 1.respec-w3c-common.js
+        new webpack.optimize.LimitChunkCountPlugin({
+          maxChunks: 1,
+        }),
+      ],
     };
     const buildDir = path.resolve(__dirname, "../builds/");
     const workerDir = path.resolve(__dirname, "../worker/");

From 5dddf720c2d5fc9ea666f9431b5048cd22fbb0c8 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 16:27:41 +0900
Subject: [PATCH 02/14] fix a mistake

---
 src/core/worker.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/core/worker.js b/src/core/worker.js
index a4bb58bbb7..cd20957561 100644
--- a/src/core/worker.js
+++ b/src/core/worker.js
@@ -20,10 +20,10 @@ document.head.appendChild(link);
 
 async function loadWorkerScript() {
   try {
-    return (await import("text!../../assets/respec-worker.js")).default;
+    return (await import("text!../../worker/respec-worker.js")).default;
   } catch {
     const res = await fetch(
-      new URL("../../assets/respec-worker.js", import.meta.url)
+      new URL("../../worker/respec-worker.js", import.meta.url)
     );
     return await res.text();
   }

From 1c757881687e3a2dd0336b56cec152696fae8fb1 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 17:14:02 +0900
Subject: [PATCH 03/14] fix requirejs error

---
 .babelrc                                    |  2 +-
 src/core/algorithms.js                      |  3 +-
 src/core/best-practices.js                  |  3 +-
 src/core/caniuse.js                         | 14 +++---
 src/core/examples.js                        |  3 +-
 src/core/highlight-vars.js                  |  4 +-
 src/core/highlight.js                       |  4 +-
 src/core/issues-notes.js                    | 14 +++++-
 src/core/style.js                           |  3 +-
 src/core/ui.js                              |  3 +-
 src/core/webidl-clipboard.js                |  3 +-
 src/core/webidl.js                          |  3 +-
 src/core/worker.js                          |  3 +-
 src/type-helper.d.ts                        |  2 +-
 tools/babel-plugin-import-meta-ignore.js    | 33 +++++++++++++
 tools/babel-plugin-import-meta-requirejs.js | 54 ---------------------
 16 files changed, 77 insertions(+), 74 deletions(-)
 create mode 100644 tools/babel-plugin-import-meta-ignore.js
 delete mode 100644 tools/babel-plugin-import-meta-requirejs.js

diff --git a/.babelrc b/.babelrc
index 97615bd82f..4181632eab 100644
--- a/.babelrc
+++ b/.babelrc
@@ -9,7 +9,7 @@
     ]
   ],
   "plugins": [
-    "./tools/babel-plugin-import-meta-requirejs",
+    "./tools/babel-plugin-import-meta-ignore",
     "dynamic-import-amd"
   ]
 }
diff --git a/src/core/algorithms.js b/src/core/algorithms.js
index 354af83308..6d4438e1d7 100644
--- a/src/core/algorithms.js
+++ b/src/core/algorithms.js
@@ -5,9 +5,10 @@ Currently used only for adding 'assert' class to algorithm lists
 
 export const name = "core/algorithms";
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/algorithms.css")).default;
+    return await import("text!../../assets/algorithms.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/algorithms.css", import.meta.url)
diff --git a/src/core/best-practices.js b/src/core/best-practices.js
index 82f1ea49d8..dc80490dd4 100644
--- a/src/core/best-practices.js
+++ b/src/core/best-practices.js
@@ -9,9 +9,10 @@ import { pub } from "./pubsubhub";
 
 export const name = "core/best-practices";
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/bp.css")).default;
+    return await import("text!../../assets/bp.css");
   } catch {
     const res = await fetch(new URL("../../assets/bp.css", import.meta.url));
     return await res.text();
diff --git a/src/core/caniuse.js b/src/core/caniuse.js
index 1c473e7b51..d193a1e1e8 100644
--- a/src/core/caniuse.js
+++ b/src/core/caniuse.js
@@ -1,3 +1,4 @@
+// @ts-check
 /**
  * Module: "core/caniuse"
  * Adds a caniuse support table for a "feature" #1238
@@ -41,9 +42,10 @@ const supportTitles = new Map([
   ["d", "Disabled by default (needs to enabled)."],
 ]);
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/caniuse.css")).default;
+    return await import("text!../../assets/caniuse.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/caniuse.css", import.meta.url)
@@ -90,13 +92,13 @@ export async function run(conf) {
     }
     resolve(content);
   });
-  const definitionPair = hyperHTML.bind(document.createDocumentFragment())`
+  const definitionPair = hyperHTML`
     <dt class="caniuse-title">Can I Use this API?</dt>
     <dd class="caniuse-stats">${{
       any: contentPromise,
       placeholder: "Fetching data from caniuse.com...",
     }}</dd>`;
-  headDlElem.appendChild(definitionPair);
+  headDlElem.append(...definitionPair.childNodes);
   await contentPromise;
 
   // remove from export
@@ -168,7 +170,7 @@ function createTableHTML(featureURL, stats) {
 
 /**
  * Add a browser and it's support to table.
- * @param {[ string, ApiResponse["browserName"] ]}
+ * @param {[ string, ApiResponse["browserName"] ]} args
  */
 function addBrowser([browserName, browserData]) {
   /** @param {string[]} supportKeys */
@@ -182,7 +184,7 @@ function addBrowser([browserName, browserData]) {
     };
   };
 
-  /** @param {[string, string[]]} */
+  /** @param {[string, string[]]} args */
   const addLatestVersion = ([version, supportKeys]) => {
     const { className, title } = getSupport(supportKeys);
     const buttonText = `${BROWSERS.get(browserName) || browserName} ${version}`;
@@ -190,7 +192,7 @@ function addBrowser([browserName, browserData]) {
       <button class="${className}" title="${title}">${buttonText}</button>`;
   };
 
-  /** @param {[string, string[]]} */
+  /** @param {[string, string[]]} args */
   const addBrowserVersion = ([version, supportKeys]) => {
     const { className, title } = getSupport(supportKeys);
     return `<li class="${className}" title="${title}">${version}</li>`;
diff --git a/src/core/examples.js b/src/core/examples.js
index 502bf1e254..c563fc207b 100644
--- a/src/core/examples.js
+++ b/src/core/examples.js
@@ -57,9 +57,10 @@ function makeTitle(conf, elem, num, report) {
   `;
 }
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/examples.css")).default;
+    return await import("text!../../assets/examples.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/examples.css", import.meta.url)
diff --git a/src/core/highlight-vars.js b/src/core/highlight-vars.js
index cbcf740be3..ce6e710c45 100644
--- a/src/core/highlight-vars.js
+++ b/src/core/highlight-vars.js
@@ -1,3 +1,4 @@
+// @ts-check
 /**
  * Module core/highlight-vars
  * Highlights occurrences of a <var> within a section on click.
@@ -29,9 +30,10 @@ export async function run(conf) {
   });
 }
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/var.css")).default;
+    return await import("text!../../assets/var.css");
   } catch {
     const res = await fetch(new URL("../../assets/var.css", import.meta.url));
     return await res.text();
diff --git a/src/core/highlight.js b/src/core/highlight.js
index aa8dac32df..d037b7a011 100644
--- a/src/core/highlight.js
+++ b/src/core/highlight.js
@@ -1,3 +1,4 @@
+// @ts-check
 /**
  * Module core/highlight
  *
@@ -69,9 +70,10 @@ async function sendHighlightRequest(code, languages) {
   });
 }
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/github.css")).default;
+    return await import("text!../../assets/github.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/github.css", import.meta.url)
diff --git a/src/core/issues-notes.js b/src/core/issues-notes.js
index f5d55ad9bd..b60c48a8eb 100644
--- a/src/core/issues-notes.js
+++ b/src/core/issues-notes.js
@@ -1,3 +1,4 @@
+// @ts-check
 // Module core/issues-notes
 // Manages issues and notes, including marking them up, numbering, inserting the title,
 // and injecting the style sheet.
@@ -16,6 +17,11 @@ import { fetchAndStoreGithubIssues } from "./github-api";
 import hyperHTML from "hyperhtml";
 import { pub } from "./pubsubhub";
 
+/**
+ * @typedef {import("./github-api").GitHubIssue} GitHubIssue
+ * @typedef {import("./github-api").GitHubLabel} GitHubLabel
+ */
+
 export const name = "core/issues-notes";
 
 const localizationStrings = {
@@ -92,7 +98,9 @@ function handleIssues(ins, ghIssues, conf) {
           text += ` ${issueNum}`;
         } else if (dataNum) {
           text += ` ${dataNum}`;
-          const link = linkToIssueTracker(dataNum, conf, { isFeatureAtRisk });
+          const link = linkToIssueTracker(Number(dataNum), conf, {
+            isFeatureAtRisk,
+          });
           if (link) {
             title.before(link);
             link.append(title);
@@ -120,6 +128,7 @@ function handleIssues(ins, ghIssues, conf) {
         }
         titleParent.append(createLabelsGroup(labels, report.title, repoURL));
       }
+      /** @type {HTMLElement | DocumentFragment} */
       let body = inno;
       inno.replaceWith(div);
       body.classList.remove(type);
@@ -265,9 +274,10 @@ function createLabel(label, repoURL) {
     href="${issuesURL.href}">${name}</a>`;
 }
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/issues-notes.css")).default;
+    return await import("text!../../assets/issues-notes.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/issues-notes.css", import.meta.url)
diff --git a/src/core/style.js b/src/core/style.js
index 21d7f95e96..0b539acb13 100644
--- a/src/core/style.js
+++ b/src/core/style.js
@@ -13,9 +13,10 @@ export const name = "core/style";
 // Opportunistically inserts the style, with the chance to reduce some FOUC
 const styleElement = insertStyle();
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/respec2.css")).default;
+    return await import("text!../../assets/respec2.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/respec2.css", import.meta.url)
diff --git a/src/core/ui.js b/src/core/ui.js
index fa5a616109..0b44a1e9e1 100644
--- a/src/core/ui.js
+++ b/src/core/ui.js
@@ -18,9 +18,10 @@ export const name = "core/ui";
 // Opportunistically inserts the style, with the chance to reduce some FOUC
 insertStyle();
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/ui.css")).default;
+    return await import("text!../../assets/ui.css");
   } catch {
     const res = await fetch(new URL("../../assets/ui.css", import.meta.url));
     return await res.text();
diff --git a/src/core/webidl-clipboard.js b/src/core/webidl-clipboard.js
index 5e887493bd..3a004a5d52 100644
--- a/src/core/webidl-clipboard.js
+++ b/src/core/webidl-clipboard.js
@@ -19,9 +19,10 @@ const clipboardOps = {
   },
 };
 
+/** @return {Promise<any>} */
 async function loadImage() {
   try {
-    return (await import("text!../../assets/clipboard.svg")).default;
+    return await import("text!../../assets/clipboard.svg");
   } catch {
     const res = await fetch(
       new URL("../../assets/clipboard.svg", import.meta.url)
diff --git a/src/core/webidl.js b/src/core/webidl.js
index 1a8d5f256f..a2b025b636 100644
--- a/src/core/webidl.js
+++ b/src/core/webidl.js
@@ -273,9 +273,10 @@ function getDefnName(defn) {
   return "";
 }
 
+/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return (await import("text!../../assets/webidl.css")).default;
+    return await import("text!../../assets/webidl.css");
   } catch {
     const res = await fetch(
       new URL("../../assets/webidl.css", import.meta.url)
diff --git a/src/core/worker.js b/src/core/worker.js
index cd20957561..5ef939428a 100644
--- a/src/core/worker.js
+++ b/src/core/worker.js
@@ -18,9 +18,10 @@ const hint = {
 const link = createResourceHint(hint);
 document.head.appendChild(link);
 
+/** @return {Promise<any>} */
 async function loadWorkerScript() {
   try {
-    return (await import("text!../../worker/respec-worker.js")).default;
+    return await import("text!../../worker/respec-worker.js");
   } catch {
     const res = await fetch(
       new URL("../../worker/respec-worker.js", import.meta.url)
diff --git a/src/type-helper.d.ts b/src/type-helper.d.ts
index 3f7a805185..c80a343920 100644
--- a/src/type-helper.d.ts
+++ b/src/type-helper.d.ts
@@ -12,7 +12,7 @@ interface Element {
 
 declare module "text!*" {
   const value: string;
-  export default value;
+  export = value;
 }
 
 declare var respecConfig: any;
diff --git a/tools/babel-plugin-import-meta-ignore.js b/tools/babel-plugin-import-meta-ignore.js
new file mode 100644
index 0000000000..ade5653385
--- /dev/null
+++ b/tools/babel-plugin-import-meta-ignore.js
@@ -0,0 +1,33 @@
+"use strict";
+
+const { ast } = require("@babel/template").default;
+const { default: inherits } = require("@babel/plugin-syntax-import-meta");
+
+module.exports = () => ({
+  inherits,
+  visitor: {
+    Program(path) {
+      const metas = [];
+
+      path.traverse({
+        MetaProperty(path) {
+          const {
+            node: { meta, property },
+          } = path;
+
+          if (meta && meta.name === "import" && property.name === "meta") {
+            metas.push(path);
+          }
+        },
+      });
+
+      if (!metas.length) {
+        return;
+      }
+
+      for (const meta of metas) {
+        meta.replaceWith(ast`({})`);
+      }
+    },
+  },
+});
diff --git a/tools/babel-plugin-import-meta-requirejs.js b/tools/babel-plugin-import-meta-requirejs.js
deleted file mode 100644
index 2b1234cf0e..0000000000
--- a/tools/babel-plugin-import-meta-requirejs.js
+++ /dev/null
@@ -1,54 +0,0 @@
-"use strict";
-
-const { ast } = require("@babel/template").default;
-const { default: inherits } = require("@babel/plugin-syntax-import-meta");
-
-module.exports = () => ({
-  inherits,
-  visitor: {
-    Program(path) {
-      const metas = [];
-      const identifiers = new Set();
-
-      path.traverse({
-        MetaProperty(path) {
-          const {
-            node: { meta, property },
-            scope,
-          } = path;
-
-          if (meta && meta.name === "import" && property.name === "meta") {
-            metas.push(path);
-          }
-
-          for (const name of Object.keys(scope.getAllBindings())) {
-            identifiers.add(name);
-          }
-        },
-      });
-
-      if (!metas.length) {
-        return;
-      }
-
-      const metaId = getUid("importMeta");
-      const module = getUid("module");
-
-      path.node.body.unshift(
-        ast`import * as ${module} from 'module';`,
-        ast`const ${metaId} = { url: new URL(${module}.uri, document.baseURI).href };`
-      );
-
-      for (const meta of metas) {
-        meta.replaceWith(ast`${metaId}`);
-      }
-
-      function getUid(id) {
-        while (identifiers.has(id)) {
-          id = path.scope.generateUidIdentifier(id).name;
-        }
-        return id;
-      }
-    },
-  },
-});

From 28d1130cab0b1428a2f87a470dc1a1849ff3cbe6 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 18:39:02 +0900
Subject: [PATCH 04/14] fix requirejs/webpack interop

---
 .babelrc                                      |   2 +-
 package-lock.json                             | 189 +-----------------
 package.json                                  |   3 +-
 src/core/algorithms.js                        |   3 +-
 src/core/best-practices.js                    |   3 +-
 src/core/caniuse.js                           |   3 +-
 src/core/examples.js                          |   3 +-
 src/core/highlight-vars.js                    |   3 +-
 src/core/highlight.js                         |   3 +-
 src/core/issues-notes.js                      |   3 +-
 src/core/style.js                             |   3 +-
 src/core/ui.js                                |   3 +-
 src/core/webidl-clipboard.js                  |   3 +-
 src/core/webidl.js                            |   3 +-
 src/core/worker.js                            |   3 +-
 .../babel-plugin-dynamic-import-requirejs.js  |  31 +++
 16 files changed, 55 insertions(+), 206 deletions(-)
 create mode 100644 tools/babel-plugin-dynamic-import-requirejs.js

diff --git a/.babelrc b/.babelrc
index 4181632eab..502ac32a8f 100644
--- a/.babelrc
+++ b/.babelrc
@@ -9,7 +9,7 @@
     ]
   ],
   "plugins": [
+    "./tools/babel-plugin-dynamic-import-requirejs",
     "./tools/babel-plugin-import-meta-ignore",
-    "dynamic-import-amd"
   ]
 }
diff --git a/package-lock.json b/package-lock.json
index 2b22eabd75..deb7c490e4 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -428,6 +428,15 @@
         "@babel/helper-plugin-utils": "^7.0.0"
       }
     },
+    "@babel/plugin-syntax-dynamic-import": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-dynamic-import/-/plugin-syntax-dynamic-import-7.2.0.tgz",
+      "integrity": "sha512-mVxuJ0YroI/h/tbFTPGZR8cv6ai+STMKNBq0f8hFxsxWjl94qqhsb+wXbpNMDPU3cfR1TIsVFzU3nXyZMqyK4w==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.0.0"
+      }
+    },
     "@babel/plugin-syntax-import-meta": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-meta/-/plugin-syntax-import-meta-7.2.0.tgz",
@@ -1460,65 +1469,6 @@
       "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==",
       "dev": true
     },
-    "babel-code-frame": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
-      "integrity": "sha1-Y/1D99weO7fONZR9uP42mj9Yx0s=",
-      "dev": true,
-      "requires": {
-        "chalk": "^1.1.3",
-        "esutils": "^2.0.2",
-        "js-tokens": "^3.0.2"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-          "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-          "dev": true
-        },
-        "ansi-styles": {
-          "version": "2.2.1",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz",
-          "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
-          "dev": true
-        },
-        "chalk": {
-          "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
-          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^2.2.1",
-            "escape-string-regexp": "^1.0.2",
-            "has-ansi": "^2.0.0",
-            "strip-ansi": "^3.0.0",
-            "supports-color": "^2.0.0"
-          }
-        },
-        "js-tokens": {
-          "version": "3.0.2",
-          "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-3.0.2.tgz",
-          "integrity": "sha1-mGbfOVECEw449/mWvOtlRDIJwls=",
-          "dev": true
-        },
-        "strip-ansi": {
-          "version": "3.0.1",
-          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
-          "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
-          "dev": true,
-          "requires": {
-            "ansi-regex": "^2.0.0"
-          }
-        },
-        "supports-color": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz",
-          "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
-          "dev": true
-        }
-      }
-    },
     "babel-eslint": {
       "version": "10.0.1",
       "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.0.1.tgz",
@@ -1545,104 +1495,6 @@
         }
       }
     },
-    "babel-messages": {
-      "version": "6.23.0",
-      "resolved": "https://registry.npmjs.org/babel-messages/-/babel-messages-6.23.0.tgz",
-      "integrity": "sha1-8830cDhYA1sqKVHG7F7fbGLyYw4=",
-      "dev": true,
-      "requires": {
-        "babel-runtime": "^6.22.0"
-      }
-    },
-    "babel-plugin-dynamic-import-amd": {
-      "version": "github:holyzfy/babel-plugin-dynamic-import-amd#1bbaf86d4472c2eef0fc01f3199d637a4b6c51e2",
-      "from": "github:holyzfy/babel-plugin-dynamic-import-amd",
-      "dev": true,
-      "requires": {
-        "babel-plugin-syntax-dynamic-import": "^6.18.0",
-        "babel-template": "^6.22.0"
-      }
-    },
-    "babel-plugin-syntax-dynamic-import": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-syntax-dynamic-import/-/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
-      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=",
-      "dev": true
-    },
-    "babel-runtime": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
-      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
-      "dev": true,
-      "requires": {
-        "core-js": "^2.4.0",
-        "regenerator-runtime": "^0.11.0"
-      }
-    },
-    "babel-template": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-template/-/babel-template-6.26.0.tgz",
-      "integrity": "sha1-3gPi0WOWsGn0bdn/+FIfsaDjXgI=",
-      "dev": true,
-      "requires": {
-        "babel-runtime": "^6.26.0",
-        "babel-traverse": "^6.26.0",
-        "babel-types": "^6.26.0",
-        "babylon": "^6.18.0",
-        "lodash": "^4.17.4"
-      }
-    },
-    "babel-traverse": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-traverse/-/babel-traverse-6.26.0.tgz",
-      "integrity": "sha1-RqnL1+3MYsjlwGTi0tjQ9ANXZu4=",
-      "dev": true,
-      "requires": {
-        "babel-code-frame": "^6.26.0",
-        "babel-messages": "^6.23.0",
-        "babel-runtime": "^6.26.0",
-        "babel-types": "^6.26.0",
-        "babylon": "^6.18.0",
-        "debug": "^2.6.8",
-        "globals": "^9.18.0",
-        "invariant": "^2.2.2",
-        "lodash": "^4.17.4"
-      },
-      "dependencies": {
-        "globals": {
-          "version": "9.18.0",
-          "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
-          "integrity": "sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==",
-          "dev": true
-        }
-      }
-    },
-    "babel-types": {
-      "version": "6.26.0",
-      "resolved": "https://registry.npmjs.org/babel-types/-/babel-types-6.26.0.tgz",
-      "integrity": "sha1-o7Bz+Uq0nrb6Vc1lInozQ4BjJJc=",
-      "dev": true,
-      "requires": {
-        "babel-runtime": "^6.26.0",
-        "esutils": "^2.0.2",
-        "lodash": "^4.17.4",
-        "to-fast-properties": "^1.0.3"
-      },
-      "dependencies": {
-        "to-fast-properties": {
-          "version": "1.0.3",
-          "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-1.0.3.tgz",
-          "integrity": "sha1-uDVx+k2MJbguIxsG46MFXeTKGkc=",
-          "dev": true
-        }
-      }
-    },
-    "babylon": {
-      "version": "6.18.0",
-      "resolved": "https://registry.npmjs.org/babylon/-/babylon-6.18.0.tgz",
-      "integrity": "sha512-q/UEjfGJ2Cm3oKV71DJz9d25TPnq5rhBVL2Q4fA5wcC3jcrdn7+SssEybFIxwAvvP+YCsCYNKughoF33GxgycQ==",
-      "dev": true
-    },
     "backo2": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
@@ -4941,23 +4793,6 @@
         "function-bind": "^1.1.1"
       }
     },
-    "has-ansi": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/has-ansi/-/has-ansi-2.0.0.tgz",
-      "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
-      "dev": true,
-      "requires": {
-        "ansi-regex": "^2.0.0"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "2.1.1",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
-          "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
-          "dev": true
-        }
-      }
-    },
     "has-binary2": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
@@ -7815,12 +7650,6 @@
         "regenerate": "^1.4.0"
       }
     },
-    "regenerator-runtime": {
-      "version": "0.11.1",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
-      "integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
-      "dev": true
-    },
     "regenerator-transform": {
       "version": "0.13.4",
       "resolved": "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.13.4.tgz",
diff --git a/package.json b/package.json
index 704c0f78e3..e6d4fe267e 100644
--- a/package.json
+++ b/package.json
@@ -23,12 +23,13 @@
   "devDependencies": {
     "@babel/cli": "^7.4.3",
     "@babel/core": "^7.4.3",
+    "@babel/helper-module-transforms": "^7.4.3",
+    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
     "@babel/plugin-syntax-import-meta": "^7.2.0",
     "@babel/preset-env": "^7.4.3",
     "@babel/template": "^7.4.0",
     "@types/pluralize": "0.0.29",
     "babel-eslint": "^10.0.1",
-    "babel-plugin-dynamic-import-amd": "github:holyzfy/babel-plugin-dynamic-import-amd",
     "chai": "^4.2.0",
     "clipboard": "^2.0.4",
     "domReady": "github:requirejs/domReady#d85bdc38a6df868ead52ab3e80715aaf60e68765",
diff --git a/src/core/algorithms.js b/src/core/algorithms.js
index 6d4438e1d7..354af83308 100644
--- a/src/core/algorithms.js
+++ b/src/core/algorithms.js
@@ -5,10 +5,9 @@ Currently used only for adding 'assert' class to algorithm lists
 
 export const name = "core/algorithms";
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/algorithms.css");
+    return (await import("text!../../assets/algorithms.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/algorithms.css", import.meta.url)
diff --git a/src/core/best-practices.js b/src/core/best-practices.js
index dc80490dd4..82f1ea49d8 100644
--- a/src/core/best-practices.js
+++ b/src/core/best-practices.js
@@ -9,10 +9,9 @@ import { pub } from "./pubsubhub";
 
 export const name = "core/best-practices";
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/bp.css");
+    return (await import("text!../../assets/bp.css")).default;
   } catch {
     const res = await fetch(new URL("../../assets/bp.css", import.meta.url));
     return await res.text();
diff --git a/src/core/caniuse.js b/src/core/caniuse.js
index d193a1e1e8..948262d1b3 100644
--- a/src/core/caniuse.js
+++ b/src/core/caniuse.js
@@ -42,10 +42,9 @@ const supportTitles = new Map([
   ["d", "Disabled by default (needs to enabled)."],
 ]);
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/caniuse.css");
+    return (await import("text!../../assets/caniuse.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/caniuse.css", import.meta.url)
diff --git a/src/core/examples.js b/src/core/examples.js
index c563fc207b..502bf1e254 100644
--- a/src/core/examples.js
+++ b/src/core/examples.js
@@ -57,10 +57,9 @@ function makeTitle(conf, elem, num, report) {
   `;
 }
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/examples.css");
+    return (await import("text!../../assets/examples.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/examples.css", import.meta.url)
diff --git a/src/core/highlight-vars.js b/src/core/highlight-vars.js
index ce6e710c45..8e38cb74d0 100644
--- a/src/core/highlight-vars.js
+++ b/src/core/highlight-vars.js
@@ -30,10 +30,9 @@ export async function run(conf) {
   });
 }
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/var.css");
+    return (await import("text!../../assets/var.css")).default;
   } catch {
     const res = await fetch(new URL("../../assets/var.css", import.meta.url));
     return await res.text();
diff --git a/src/core/highlight.js b/src/core/highlight.js
index d037b7a011..5ae36d37f8 100644
--- a/src/core/highlight.js
+++ b/src/core/highlight.js
@@ -70,10 +70,9 @@ async function sendHighlightRequest(code, languages) {
   });
 }
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/github.css");
+    return (await import("text!../../assets/github.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/github.css", import.meta.url)
diff --git a/src/core/issues-notes.js b/src/core/issues-notes.js
index b60c48a8eb..d690b94f6f 100644
--- a/src/core/issues-notes.js
+++ b/src/core/issues-notes.js
@@ -274,10 +274,9 @@ function createLabel(label, repoURL) {
     href="${issuesURL.href}">${name}</a>`;
 }
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/issues-notes.css");
+    return (await import("text!../../assets/issues-notes.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/issues-notes.css", import.meta.url)
diff --git a/src/core/style.js b/src/core/style.js
index 0b539acb13..21d7f95e96 100644
--- a/src/core/style.js
+++ b/src/core/style.js
@@ -13,10 +13,9 @@ export const name = "core/style";
 // Opportunistically inserts the style, with the chance to reduce some FOUC
 const styleElement = insertStyle();
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/respec2.css");
+    return (await import("text!../../assets/respec2.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/respec2.css", import.meta.url)
diff --git a/src/core/ui.js b/src/core/ui.js
index 0b44a1e9e1..fa5a616109 100644
--- a/src/core/ui.js
+++ b/src/core/ui.js
@@ -18,10 +18,9 @@ export const name = "core/ui";
 // Opportunistically inserts the style, with the chance to reduce some FOUC
 insertStyle();
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/ui.css");
+    return (await import("text!../../assets/ui.css")).default;
   } catch {
     const res = await fetch(new URL("../../assets/ui.css", import.meta.url));
     return await res.text();
diff --git a/src/core/webidl-clipboard.js b/src/core/webidl-clipboard.js
index 3a004a5d52..5e887493bd 100644
--- a/src/core/webidl-clipboard.js
+++ b/src/core/webidl-clipboard.js
@@ -19,10 +19,9 @@ const clipboardOps = {
   },
 };
 
-/** @return {Promise<any>} */
 async function loadImage() {
   try {
-    return await import("text!../../assets/clipboard.svg");
+    return (await import("text!../../assets/clipboard.svg")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/clipboard.svg", import.meta.url)
diff --git a/src/core/webidl.js b/src/core/webidl.js
index a2b025b636..1a8d5f256f 100644
--- a/src/core/webidl.js
+++ b/src/core/webidl.js
@@ -273,10 +273,9 @@ function getDefnName(defn) {
   return "";
 }
 
-/** @return {Promise<any>} */
 async function loadStyle() {
   try {
-    return await import("text!../../assets/webidl.css");
+    return (await import("text!../../assets/webidl.css")).default;
   } catch {
     const res = await fetch(
       new URL("../../assets/webidl.css", import.meta.url)
diff --git a/src/core/worker.js b/src/core/worker.js
index 5ef939428a..cd20957561 100644
--- a/src/core/worker.js
+++ b/src/core/worker.js
@@ -18,10 +18,9 @@ const hint = {
 const link = createResourceHint(hint);
 document.head.appendChild(link);
 
-/** @return {Promise<any>} */
 async function loadWorkerScript() {
   try {
-    return await import("text!../../worker/respec-worker.js");
+    return (await import("text!../../worker/respec-worker.js")).default;
   } catch {
     const res = await fetch(
       new URL("../../worker/respec-worker.js", import.meta.url)
diff --git a/tools/babel-plugin-dynamic-import-requirejs.js b/tools/babel-plugin-dynamic-import-requirejs.js
new file mode 100644
index 0000000000..b6db0efe06
--- /dev/null
+++ b/tools/babel-plugin-dynamic-import-requirejs.js
@@ -0,0 +1,31 @@
+"use strict";
+
+const { expression, ast } = require("@babel/template").default;
+const { default: inherits } = require("@babel/plugin-syntax-dynamic-import");
+const { wrapInterop } = require("@babel/helper-module-transforms");
+
+const buildImport = expression`require([SOURCE], resolve)`;
+
+exports.__esModule = true;
+
+exports.default = function() {
+  return {
+    inherits,
+    visitor: {
+      CallExpression(path) {
+        if (path.node.callee.type === "Import") {
+          const newImport = wrapInterop(
+            path,
+            buildImport({
+              SOURCE: path.node.arguments[0],
+            }),
+            "default"
+          );
+          path.replaceWith(ast`(new Promise(resolve => ${newImport}))`);
+        }
+      },
+    },
+  };
+};
+
+module.exports = exports.default;

From 61512147137b7da2c7a3aafd6a25d1faa04bc012 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 19:19:27 +0900
Subject: [PATCH 05/14] fix requirejs error 2

---
 .../babel-plugin-dynamic-import-requirejs.js  | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/tools/babel-plugin-dynamic-import-requirejs.js b/tools/babel-plugin-dynamic-import-requirejs.js
index b6db0efe06..75ccc8fe3f 100644
--- a/tools/babel-plugin-dynamic-import-requirejs.js
+++ b/tools/babel-plugin-dynamic-import-requirejs.js
@@ -1,11 +1,9 @@
 "use strict";
 
-const { expression, ast } = require("@babel/template").default;
+const { expression, default: template } = require("@babel/template");
 const { default: inherits } = require("@babel/plugin-syntax-dynamic-import");
 const { wrapInterop } = require("@babel/helper-module-transforms");
 
-const buildImport = expression`require([SOURCE], resolve)`;
-
 exports.__esModule = true;
 
 exports.default = function() {
@@ -13,16 +11,16 @@ exports.default = function() {
     inherits,
     visitor: {
       CallExpression(path) {
-        if (path.node.callee.type === "Import") {
-          const newImport = wrapInterop(
-            path,
-            buildImport({
-              SOURCE: path.node.arguments[0],
-            }),
-            "default"
-          );
-          path.replaceWith(ast`(new Promise(resolve => ${newImport}))`);
+        if (path.node.callee.type !== "Import") {
+          return;
         }
+        const wrapped = wrapInterop(path, expression.ast`m`, "default");
+        const newImport = template.ast`
+          (new Promise(resolve => require([${
+            path.node.arguments[0]
+          }], m => resolve(${wrapped}))))
+        `;
+        path.replaceWith(newImport);
       },
     },
   };

From a5ec964fa0fa6851bfedf3c3366ef6f446aaaad2 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 19:33:14 +0900
Subject: [PATCH 06/14] use webpack build

---
 tests/spec/core/highlight.html | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/tests/spec/core/highlight.html b/tests/spec/core/highlight.html
index 9b7d91b84a..20de029530 100644
--- a/tests/spec/core/highlight.html
+++ b/tests/spec/core/highlight.html
@@ -3,8 +3,7 @@
   <head>
     <meta charset='utf-8'>
     <title>Replace me with a real title</title>
-    <script class='remove' src='/js/deps/require.js' data-main='/js/profile-w3c-common'>
-    </script>
+    <script class='remove' src='/builds/respec-w3c-common.js'></script>
     <script class='remove'>
       async function loadSolidity() {
         const worker = await new Promise(resolve => {

From 6f4c6ea5f137d3bdd247fe6106d6d5e498015646 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 21:05:01 +0900
Subject: [PATCH 07/14] add file extension for imports/exports

---
 .babelrc                                      |  1 +
 src/core/base-runner.js                       | 16 ++++++------
 src/core/best-practices.js                    |  4 +--
 src/core/biblio-db.js                         |  2 +-
 src/core/biblio.js                            |  8 +++---
 src/core/caniuse.js                           |  4 +--
 src/core/contrib.js                           |  6 ++---
 src/core/data-abbr.js                         |  2 +-
 src/core/data-cite.js                         |  4 +--
 src/core/data-include.js                      |  4 +--
 src/core/data-tests.js                        |  6 ++---
 src/core/data-transform.js                    |  2 +-
 src/core/defaults.js                          | 14 +++++-----
 src/core/dfn-finder.js                        |  6 ++---
 src/core/dfn.js                               |  4 +--
 src/core/examples.js                          |  6 ++---
 src/core/exporter.js                          |  6 ++---
 src/core/figures.js                           |  4 +--
 src/core/fix-headers.js                       |  2 +-
 src/core/github-api.js                        |  4 +--
 src/core/github.js                            |  2 +-
 src/core/highlight-vars.js                    |  2 +-
 src/core/highlight.js                         |  4 +--
 src/core/id-headers.js                        |  2 +-
 src/core/include-config.js                    |  2 +-
 src/core/informative.js                       |  2 +-
 src/core/inlines.js                           |  6 ++---
 src/core/issues-notes.js                      |  8 +++---
 src/core/jquery-enhanced.js                   |  2 +-
 src/core/link-to-dfn.js                       | 12 ++++-----
 src/core/linter-rules/check-charset.js        |  4 +--
 src/core/linter-rules/check-internal-slots.js |  4 +--
 src/core/linter-rules/check-punctuation.js    |  4 +--
 src/core/linter-rules/local-refs-exist.js     |  4 +--
 .../linter-rules/no-headingless-sections.js   |  4 +--
 src/core/linter-rules/no-http-props.js        |  4 +--
 src/core/linter.js                            |  4 +--
 src/core/list-sorter.js                       |  4 +--
 src/core/location-hash.js                     |  2 +-
 src/core/markdown.js                          |  2 +-
 src/core/override-configuration.js            |  2 +-
 src/core/pluralize.js                         |  4 +--
 src/core/post-process.js                      |  2 +-
 src/core/pre-process.js                       |  2 +-
 src/core/pubsubhub.js                         |  2 +-
 src/core/render-biblio.js                     |  8 +++---
 src/core/requirements.js                      |  2 +-
 src/core/respec-ready.js                      |  2 +-
 src/core/structure.js                         |  4 +--
 src/core/ui.js                                |  6 ++---
 src/core/utils.js                             |  4 +--
 src/core/webidl-index.js                      |  2 +-
 src/core/webidl.js                            |  8 +++---
 src/core/worker.js                            |  4 +--
 src/core/xref.js                              |  4 +--
 src/ui/about-respec.js                        |  4 +--
 src/ui/dfn-list.js                            |  6 ++---
 src/ui/save-html.js                           |  8 +++---
 src/ui/search-specref.js                      |  6 ++---
 src/w3c/abstract.js                           |  4 +--
 src/w3c/conformance.js                        |  8 +++---
 src/w3c/defaults.js                           |  8 +++---
 src/w3c/headers.js                            | 12 ++++-----
 src/w3c/l10n.js                               |  2 +-
 src/w3c/linter-rules/privsec-section.js       |  4 +--
 src/w3c/linter.js                             |  4 +--
 src/w3c/seo.js                                |  4 +--
 src/w3c/style.js                              |  4 +--
 src/w3c/templates/cgbg-headers.js             |  6 ++---
 src/w3c/templates/headers.js                  |  8 +++---
 src/w3c/templates/show-link.js                |  2 +-
 src/w3c/templates/show-logo.js                |  2 +-
 .../babel-plugin-dynamic-import-requirejs.js  |  8 +++---
 tools/babel-plugin-import-meta-ignore.js      |  3 +++
 tools/babel-plugin-import-path-requirejs.js   | 26 +++++++++++++++++++
 75 files changed, 198 insertions(+), 170 deletions(-)
 create mode 100644 tools/babel-plugin-import-path-requirejs.js

diff --git a/.babelrc b/.babelrc
index 502ac32a8f..3ce9b4b61f 100644
--- a/.babelrc
+++ b/.babelrc
@@ -11,5 +11,6 @@
   "plugins": [
     "./tools/babel-plugin-dynamic-import-requirejs",
     "./tools/babel-plugin-import-meta-ignore",
+    "./tools/babel-plugin-import-path-requirejs.js"
   ]
 }
diff --git a/src/core/base-runner.js b/src/core/base-runner.js
index aa79347941..d08c96dc81 100644
--- a/src/core/base-runner.js
+++ b/src/core/base-runner.js
@@ -1,13 +1,13 @@
 // Module core/base-runner
 // The module in charge of running the whole processing pipeline.
-import "./include-config";
-import "./override-configuration";
-import "./respec-ready";
-import "./jquery-enhanced"; // for backward compatibility
-import { done as postProcessDone } from "./post-process";
-import { done as preProcessDone } from "./pre-process";
-import { pub } from "./pubsubhub";
-import { removeReSpec } from "./utils";
+import "./include-config.js";
+import "./override-configuration.js";
+import "./respec-ready.js";
+import "./jquery-enhanced.js"; // for backward compatibility
+import { done as postProcessDone } from "./post-process.js";
+import { done as preProcessDone } from "./pre-process.js";
+import { pub } from "./pubsubhub.js";
+import { removeReSpec } from "./utils.js";
 
 export const name = "core/base-runner";
 const canMeasure = performance.mark && performance.measure;
diff --git a/src/core/best-practices.js b/src/core/best-practices.js
index 82f1ea49d8..1bcd5e5204 100644
--- a/src/core/best-practices.js
+++ b/src/core/best-practices.js
@@ -3,9 +3,9 @@
 // Handles the marking up of best practices, and can generate a summary of all of them.
 // The summary is generated if there is a section in the document with ID bp-summary.
 // Best practices are marked up with span.practicelab.
-import { addId } from "./utils";
+import { addId } from "./utils.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 export const name = "core/best-practices";
 
diff --git a/src/core/biblio-db.js b/src/core/biblio-db.js
index f028a3aeb0..b7984d741e 100644
--- a/src/core/biblio-db.js
+++ b/src/core/biblio-db.js
@@ -8,7 +8,7 @@
  *
  */
 /* globals IDBKeyRange, DOMException */
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 export const name = "core/biblio-db";
 
 const ALLOWED_TYPES = new Set(["alias", "reference"]);
diff --git a/src/core/biblio.js b/src/core/biblio.js
index 5272dd7033..1c99f40ced 100644
--- a/src/core/biblio.js
+++ b/src/core/biblio.js
@@ -5,13 +5,13 @@
 
 /* jshint jquery: true */
 /* globals console */
-import { biblioDB } from "./biblio-db";
-import { createResourceHint } from "./utils";
-import { pub } from "./pubsubhub";
+import { biblioDB } from "./biblio-db.js";
+import { createResourceHint } from "./utils.js";
+import { pub } from "./pubsubhub.js";
 export const biblio = {};
 
 // for backward compatibity
-export { wireReference, stringifyReference } from "./render-biblio";
+export { wireReference, stringifyReference } from "./render-biblio.js.js";
 
 export const name = "core/biblio";
 
diff --git a/src/core/caniuse.js b/src/core/caniuse.js
index 948262d1b3..fad0efd02d 100644
--- a/src/core/caniuse.js
+++ b/src/core/caniuse.js
@@ -4,8 +4,8 @@
  * Adds a caniuse support table for a "feature" #1238
  * Usage options: https://github.com/w3c/respec/wiki/caniuse
  */
-import { pub, sub } from "./pubsubhub";
-import { createResourceHint } from "./utils";
+import { pub, sub } from "./pubsubhub.js";
+import { createResourceHint } from "./utils.js";
 import hyperHTML from "hyperhtml";
 
 export const name = "core/caniuse";
diff --git a/src/core/contrib.js b/src/core/contrib.js
index 15e0434152..8114aceab7 100644
--- a/src/core/contrib.js
+++ b/src/core/contrib.js
@@ -8,9 +8,9 @@ import {
   checkLimitReached,
   fetchIndex,
   githubRequestHeaders,
-} from "./github-api";
-import { flatten, joinAnd } from "./utils";
-import { pub } from "./pubsubhub";
+} from "./github-api.js";
+import { flatten, joinAnd } from "./utils.js";
+import { pub } from "./pubsubhub.js";
 export const name = "core/contrib";
 
 function prop(prop) {
diff --git a/src/core/data-abbr.js b/src/core/data-abbr.js
index 17179384b0..74fec1c761 100644
--- a/src/core/data-abbr.js
+++ b/src/core/data-abbr.js
@@ -1,7 +1,7 @@
 // @ts-check
 // Module core/data-abbr
 // - Finds all elements with data-abbr attribute and processes them.
-import { showInlineWarning } from "./utils";
+import { showInlineWarning } from "./utils.js";
 export const name = "core/dfn-abbr";
 
 export function run() {
diff --git a/src/core/data-cite.js b/src/core/data-cite.js
index f7f48e63da..c1caad0d8b 100644
--- a/src/core/data-cite.js
+++ b/src/core/data-cite.js
@@ -14,8 +14,8 @@
  * Usage:
  * https://github.com/w3c/respec/wiki/data--cite
  */
-import { biblio, resolveRef, updateFromNetwork } from "./biblio";
-import { refTypeFromContext, showInlineWarning, wrapInner } from "./utils";
+import { biblio, resolveRef, updateFromNetwork } from "./biblio.js";
+import { refTypeFromContext, showInlineWarning, wrapInner } from "./utils.js";
 import hyperHTML from "hyperhtml";
 export const name = "core/data-cite";
 
diff --git a/src/core/data-include.js b/src/core/data-include.js
index 68c364adbf..ddecfe31e3 100644
--- a/src/core/data-include.js
+++ b/src/core/data-include.js
@@ -9,8 +9,8 @@
 //  This module only really works when you are in an HTTP context, and will most likely
 //  fail if you are editing your documents on your local drive. That is due to security
 //  restrictions in the browser.
-import { pub } from "./pubsubhub";
-import { runTransforms } from "./utils";
+import { pub } from "./pubsubhub.js";
+import { runTransforms } from "./utils.js";
 
 export const name = "core/data-include";
 
diff --git a/src/core/data-tests.js b/src/core/data-tests.js
index c3e607e9cc..e6354ce732 100644
--- a/src/core/data-tests.js
+++ b/src/core/data-tests.js
@@ -9,10 +9,10 @@
  *
  * Docs: https://github.com/w3c/respec/wiki/data-tests
  */
-import { lang as defaultLang } from "./l10n";
+import { lang as defaultLang } from "./l10n.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
-import { showInlineWarning } from "./utils";
+import { pub } from "./pubsubhub.js";
+import { showInlineWarning } from "./utils.js";
 const l10n = {
   en: {
     missing_test_suite_uri:
diff --git a/src/core/data-transform.js b/src/core/data-transform.js
index a678ffd41f..e68046ee32 100644
--- a/src/core/data-transform.js
+++ b/src/core/data-transform.js
@@ -11,7 +11,7 @@
 //  know what you are doing, you should be using a dedicated module instead. This feature
 //  is not actively supported and support for it may be dropped. It is not accounted for
 //  in the test suite, and therefore could easily break.
-import { runTransforms } from "./utils";
+import { runTransforms } from "./utils.js";
 
 export const name = "core/data-transform";
 
diff --git a/src/core/defaults.js b/src/core/defaults.js
index d73627b537..eafcdf4ce8 100644
--- a/src/core/defaults.js
+++ b/src/core/defaults.js
@@ -2,13 +2,13 @@
  * Sets the core defaults
  */
 export const name = "core/defaults";
-import { rule as checkCharset } from "./linter-rules/check-charset";
-import { rule as checkInternalSlots } from "./linter-rules/check-internal-slots";
-import { rule as checkPunctuation } from "./linter-rules/check-punctuation";
-import linter from "./linter";
-import { rule as localRefsExist } from "./linter-rules/local-refs-exist";
-import { rule as noHeadinglessSectionsRule } from "./linter-rules/no-headingless-sections";
-import { rule as noHttpPropsRule } from "./linter-rules/no-http-props";
+import { rule as checkCharset } from "./linter-rules/check-charset.js";
+import { rule as checkInternalSlots } from "./linter-rules/check-internal-slots.js";
+import { rule as checkPunctuation } from "./linter-rules/check-punctuation.js";
+import linter from "./linter.js";
+import { rule as localRefsExist } from "./linter-rules/local-refs-exist.js";
+import { rule as noHeadinglessSectionsRule } from "./linter-rules/no-headingless-sections.js";
+import { rule as noHttpPropsRule } from "./linter-rules/no-http-props.js";
 
 linter.register(
   noHttpPropsRule,
diff --git a/src/core/dfn-finder.js b/src/core/dfn-finder.js
index 8eb604b5b3..afc0e371d8 100644
--- a/src/core/dfn-finder.js
+++ b/src/core/dfn-finder.js
@@ -1,7 +1,7 @@
 // @ts-check
-import { definitionMap, registerDefinition } from "./dfn-map";
-import { pub } from "./pubsubhub";
-import { wrapInner } from "./utils";
+import { definitionMap, registerDefinition } from "./dfn-map.js";
+import { pub } from "./pubsubhub.js";
+import { wrapInner } from "./utils.js";
 
 const topLevelEntities = new Set([
   "callback interface",
diff --git a/src/core/dfn.js b/src/core/dfn.js
index 944cfe16c6..8adb5baa57 100644
--- a/src/core/dfn.js
+++ b/src/core/dfn.js
@@ -2,8 +2,8 @@
 // Module core/dfn
 // - Finds all <dfn> elements and populates conf.definitionMap to identify them.
 
-import { getDfnTitles } from "./utils";
-import { registerDefinition } from "./dfn-map";
+import { getDfnTitles } from "./utils.js";
+import { registerDefinition } from "./dfn-map.js";
 
 export const name = "core/dfn";
 
diff --git a/src/core/examples.js b/src/core/examples.js
index 502bf1e254..0fc7c4bb6e 100644
--- a/src/core/examples.js
+++ b/src/core/examples.js
@@ -6,10 +6,10 @@
 // When an example is found, it is reported using the "example" event. This can
 // be used by a containing shell to extract all examples.
 
-import { addId } from "./utils";
-import { lang as defaultLang } from "../core/l10n";
+import { addId } from "./utils.js";
+import { lang as defaultLang } from "../core/l10n.js";
 import html from "hyperhtml";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 export const name = "core/examples";
 
diff --git a/src/core/exporter.js b/src/core/exporter.js
index 42b9446661..3f88c0d30a 100644
--- a/src/core/exporter.js
+++ b/src/core/exporter.js
@@ -6,10 +6,10 @@
  * That is, elements that have a "removeOnSave" css class.
  */
 
-import { expose } from "./expose-modules";
+import { expose } from "./expose-modules.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
-import { removeReSpec } from "./utils";
+import { pub } from "./pubsubhub.js";
+import { removeReSpec } from "./utils.js";
 
 const mimeTypes = new Map([["text/html", "html"], ["application/xml", "xml"]]);
 
diff --git a/src/core/figures.js b/src/core/figures.js
index afc7a6b0e0..4c5e0055d5 100644
--- a/src/core/figures.js
+++ b/src/core/figures.js
@@ -4,8 +4,8 @@
 // Adds width and height to images, if they are missing.
 // Generates a Table of Figures wherever there is a #tof element.
 
-import { addId, renameElement, showInlineWarning, wrapInner } from "./utils";
-import { lang as defaultLang } from "../core/l10n";
+import { addId, renameElement, showInlineWarning, wrapInner } from "./utils.js";
+import { lang as defaultLang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
 
 export const name = "core/figures";
diff --git a/src/core/fix-headers.js b/src/core/fix-headers.js
index 25e701215c..97781f6ad1 100644
--- a/src/core/fix-headers.js
+++ b/src/core/fix-headers.js
@@ -2,7 +2,7 @@
 // Make sure that all h1-h6 headers (that are first direct children of sections) are actually
 // numbered at the right depth level. This makes it possible to just use any of them (conventionally
 // h2) with the knowledge that the proper depth level will be used
-import { renameElement } from "./utils";
+import { renameElement } from "./utils.js";
 
 export const name = "core/fix-headers";
 
diff --git a/src/core/github-api.js b/src/core/github-api.js
index 13d516e2aa..e831fdf8a6 100644
--- a/src/core/github-api.js
+++ b/src/core/github-api.js
@@ -1,5 +1,5 @@
-import { fetchAndCache } from "./utils";
-import { pub } from "./pubsubhub";
+import { fetchAndCache } from "./utils.js";
+import { pub } from "./pubsubhub.js";
 export const name = "core/github-api";
 
 export function githubRequestHeaders(conf) {
diff --git a/src/core/github.js b/src/core/github.js
index ff97cfe276..f3439e37b4 100644
--- a/src/core/github.js
+++ b/src/core/github.js
@@ -4,7 +4,7 @@
  * @see https://github.com/w3c/respec/wiki/github
  */
 
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 export const name = "core/github";
 
diff --git a/src/core/highlight-vars.js b/src/core/highlight-vars.js
index 8e38cb74d0..f638f69319 100644
--- a/src/core/highlight-vars.js
+++ b/src/core/highlight-vars.js
@@ -7,7 +7,7 @@
  * All is done while keeping in mind that exported html stays clean
  * on export.
  */
-import { sub } from "./pubsubhub";
+import { sub } from "./pubsubhub.js";
 
 export const name = "core/highlight-vars";
 
diff --git a/src/core/highlight.js b/src/core/highlight.js
index 5ae36d37f8..993ecfa6bb 100644
--- a/src/core/highlight.js
+++ b/src/core/highlight.js
@@ -5,8 +5,8 @@
  * Performs syntax highlighting to all pre and code elements.
  */
 import html from "hyperhtml";
-import { msgIdGenerator } from "./utils";
-import { workerPromise } from "./worker";
+import { msgIdGenerator } from "./utils.js";
+import { workerPromise } from "./worker.js";
 export const name = "core/highlight";
 
 const nextMsgId = msgIdGenerator("highlight");
diff --git a/src/core/id-headers.js b/src/core/id-headers.js
index c366cd8bdf..a4de97c552 100644
--- a/src/core/id-headers.js
+++ b/src/core/id-headers.js
@@ -3,7 +3,7 @@
 // This is currently in core though it comes from a W3C rule. It may move in the future.
 
 export const name = "core/id-headers";
-import { addId } from "./utils";
+import { addId } from "./utils.js";
 import hyperHTML from "hyperhtml";
 
 export function run(conf) {
diff --git a/src/core/include-config.js b/src/core/include-config.js
index cfa0471341..754853df80 100644
--- a/src/core/include-config.js
+++ b/src/core/include-config.js
@@ -1,6 +1,6 @@
 // Module core/include-config
 // Inject's the document's configuration into the head as JSON.
-import { sub } from "./pubsubhub";
+import { sub } from "./pubsubhub.js";
 export const name = "core/include-config";
 
 const userConfig = {};
diff --git a/src/core/informative.js b/src/core/informative.js
index b75edc0ff3..ca134c23fd 100644
--- a/src/core/informative.js
+++ b/src/core/informative.js
@@ -1,6 +1,6 @@
 // Module core/informative
 // Mark specific sections as informative, based on CSS
-import { lang as defaultLang } from "../core/l10n";
+import { lang as defaultLang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
 
 export const name = "core/informative";
diff --git a/src/core/inlines.js b/src/core/inlines.js
index 92f9c2c0f9..a3147408da 100644
--- a/src/core/inlines.js
+++ b/src/core/inlines.js
@@ -19,10 +19,10 @@ import {
   getTextNodes,
   refTypeFromContext,
   showInlineWarning,
-} from "./utils";
+} from "./utils.js";
 import hyperHTML from "hyperhtml";
-import { idlStringToHtml } from "./inline-idl-parser";
-import { renderInlineCitation } from "./render-biblio";
+import { idlStringToHtml } from "./inline-idl-parser.js";
+import { renderInlineCitation } from "./render-biblio.js";
 
 export const name = "core/inlines";
 export const rfc2119Usage = {};
diff --git a/src/core/issues-notes.js b/src/core/issues-notes.js
index d690b94f6f..2e4df4f07a 100644
--- a/src/core/issues-notes.js
+++ b/src/core/issues-notes.js
@@ -11,11 +11,11 @@
 // numbered to avoid involuntary clashes.
 // If the configuration has issueBase set to a non-empty string, and issues are
 // manually numbered, a link to the issue is created using issueBase and the issue number
-import { addId, joinAnd, parents } from "./utils";
-import { lang as defaultLang } from "../core/l10n";
-import { fetchAndStoreGithubIssues } from "./github-api";
+import { addId, joinAnd, parents } from "./utils.js";
+import { lang as defaultLang } from "../core/l10n.js";
+import { fetchAndStoreGithubIssues } from "./github-api.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 /**
  * @typedef {import("./github-api").GitHubIssue} GitHubIssue
diff --git a/src/core/jquery-enhanced.js b/src/core/jquery-enhanced.js
index 79581f5836..bfe15b8178 100644
--- a/src/core/jquery-enhanced.js
+++ b/src/core/jquery-enhanced.js
@@ -4,7 +4,7 @@ import {
   getLinkTargets,
   getTextNodes,
   renameElement,
-} from "./utils";
+} from "./utils.js";
 import $ from "jquery";
 
 export const name = "core/jquery-enhanced";
diff --git a/src/core/link-to-dfn.js b/src/core/link-to-dfn.js
index ae9e2b7a28..1a0750f684 100644
--- a/src/core/link-to-dfn.js
+++ b/src/core/link-to-dfn.js
@@ -8,12 +8,12 @@ import {
   showInlineError,
   showInlineWarning,
   wrapInner,
-} from "./utils";
-import { run as addExternalReferences } from "./xref";
-import { lang as defaultLang } from "./l10n";
-import { definitionMap } from "./dfn-map";
-import { linkInlineCitations } from "./data-cite";
-import { pub } from "./pubsubhub";
+} from "./utils.js";
+import { run as addExternalReferences } from "./xref.js";
+import { lang as defaultLang } from "./l10n.js";
+import { definitionMap } from "./dfn-map.js";
+import { linkInlineCitations } from "./data-cite.js";
+import { pub } from "./pubsubhub.js";
 export const name = "core/link-to-dfn";
 const l10n = {
   en: {
diff --git a/src/core/linter-rules/check-charset.js b/src/core/linter-rules/check-charset.js
index 154fe27b06..b3e9d96033 100644
--- a/src/core/linter-rules/check-charset.js
+++ b/src/core/linter-rules/check-charset.js
@@ -3,8 +3,8 @@
  *
  * Checks whether the document has `<meta charset="utf-8">` properly.
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 
 const name = "check-charset";
 const meta = {
diff --git a/src/core/linter-rules/check-internal-slots.js b/src/core/linter-rules/check-internal-slots.js
index cb886b359c..a9f74fd7ca 100644
--- a/src/core/linter-rules/check-internal-slots.js
+++ b/src/core/linter-rules/check-internal-slots.js
@@ -2,8 +2,8 @@
 /**
  * Linter rule "check-internal-slots".
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 
 const name = "check-internal-slots";
 
diff --git a/src/core/linter-rules/check-punctuation.js b/src/core/linter-rules/check-punctuation.js
index 393761435f..11a2f4212d 100644
--- a/src/core/linter-rules/check-punctuation.js
+++ b/src/core/linter-rules/check-punctuation.js
@@ -3,8 +3,8 @@
  * Linter rule "check-punctuation". Makes sure the there are no punctuations missing at the end of a <p>
  *   in the ReSpec config.
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 
 const name = "check-punctuation";
 const punctuationMarks = [".", ":", "!", "?"];
diff --git a/src/core/linter-rules/local-refs-exist.js b/src/core/linter-rules/local-refs-exist.js
index 5f9661df6e..5c862ee31f 100644
--- a/src/core/linter-rules/local-refs-exist.js
+++ b/src/core/linter-rules/local-refs-exist.js
@@ -3,8 +3,8 @@
  * Linter rule "warn-local-ref".
  * Warns about href's that link to nonexistent id's in a spec
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 
 const name = "local-refs-exist";
 
diff --git a/src/core/linter-rules/no-headingless-sections.js b/src/core/linter-rules/no-headingless-sections.js
index a2d68fc3e2..e6f32fa1e4 100644
--- a/src/core/linter-rules/no-headingless-sections.js
+++ b/src/core/linter-rules/no-headingless-sections.js
@@ -5,8 +5,8 @@
  * Checks that there are no sections in the document that don't start
  * with a heading element (h1-6).
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 const name = "no-headingless-sections";
 const meta = {
   en: {
diff --git a/src/core/linter-rules/no-http-props.js b/src/core/linter-rules/no-http-props.js
index 30bcc92e89..4bfce6fb31 100644
--- a/src/core/linter-rules/no-http-props.js
+++ b/src/core/linter-rules/no-http-props.js
@@ -3,8 +3,8 @@
  * Linter rule "no-http-props". Makes sure the there are no URLs that
  * start with http:// in the ReSpec config.
  */
-import LinterRule from "../LinterRule";
-import { lang as defaultLang } from "../l10n";
+import LinterRule from "../LinterRule.js";
+import { lang as defaultLang } from "../l10n.js";
 
 const name = "no-http-props";
 
diff --git a/src/core/linter.js b/src/core/linter.js
index 10c67bb806..ad651b31dc 100644
--- a/src/core/linter.js
+++ b/src/core/linter.js
@@ -4,8 +4,8 @@
  *
  * Core linter module. Exports a linter object.
  */
-import { pub } from "./pubsubhub";
-import { showInlineWarning } from "./utils";
+import { pub } from "./pubsubhub.js";
+import { showInlineWarning } from "./utils.js";
 export const name = "core/linter";
 
 /** @type {WeakMap<Linter, { rules: Set<import("./LinterRule").default> }>} */
diff --git a/src/core/list-sorter.js b/src/core/list-sorter.js
index 742243f0bd..8b55eaed83 100644
--- a/src/core/list-sorter.js
+++ b/src/core/list-sorter.js
@@ -1,5 +1,5 @@
-import { children } from "./utils";
-import { pub } from "./pubsubhub";
+import { children } from "./utils.js";
+import { pub } from "./pubsubhub.js";
 export const name = "core/list-sorter";
 
 function makeSorter(direction) {
diff --git a/src/core/location-hash.js b/src/core/location-hash.js
index ecfc71d113..278d1bcaef 100644
--- a/src/core/location-hash.js
+++ b/src/core/location-hash.js
@@ -1,7 +1,7 @@
 // Module core/location-hash
 // Resets window.location.hash to jump to the right point in the document
 
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 export const name = "core/location-hash";
 
 export function run() {
diff --git a/src/core/markdown.js b/src/core/markdown.js
index 051b12c21b..c3be173032 100644
--- a/src/core/markdown.js
+++ b/src/core/markdown.js
@@ -43,7 +43,7 @@
  * The whitespace of pre elements are left alone.
  */
 
-import { markdownToHtml } from "./utils";
+import { markdownToHtml } from "./utils.js";
 export const name = "core/markdown";
 
 function processElements(selector) {
diff --git a/src/core/override-configuration.js b/src/core/override-configuration.js
index 3565065420..7ee7e0e00f 100644
--- a/src/core/override-configuration.js
+++ b/src/core/override-configuration.js
@@ -4,7 +4,7 @@
 // tweaks to a document before generating the snapshot, without mucking with the source.
 // For example, you can change the status and date by appending:
 //      ?specStatus=LC&publishDate=2012-03-15
-import { pub, sub } from "./pubsubhub";
+import { pub, sub } from "./pubsubhub.js";
 
 export const name = "core/override-configuration";
 
diff --git a/src/core/pluralize.js b/src/core/pluralize.js
index 5b901b6a60..681a672b35 100644
--- a/src/core/pluralize.js
+++ b/src/core/pluralize.js
@@ -9,8 +9,8 @@ import {
   plural as pluralOf,
   singular as singularOf,
 } from "pluralize";
-import { norm as normalize } from "./utils";
-import { registerDefinition } from "./dfn-map";
+import { norm as normalize } from "./utils.js";
+import { registerDefinition } from "./dfn-map.js";
 
 export const name = "core/pluralize";
 
diff --git a/src/core/post-process.js b/src/core/post-process.js
index 40de6063dc..59d1c1d858 100644
--- a/src/core/post-process.js
+++ b/src/core/post-process.js
@@ -8,7 +8,7 @@
  *      want to be using a new module with your own profile.
  *  - afterEnd: final thing that is called.
  */
-import { pub, sub } from "./pubsubhub";
+import { pub, sub } from "./pubsubhub.js";
 
 export const name = "core/post-process";
 
diff --git a/src/core/pre-process.js b/src/core/pre-process.js
index 1ea07e7b07..93221fd44e 100644
--- a/src/core/pre-process.js
+++ b/src/core/pre-process.js
@@ -7,7 +7,7 @@
  *      tested. Use with care, if you know what you're doing. Chances are you really
  *      want to be using a new module with your own profile
  */
-import { pub, sub } from "./pubsubhub";
+import { pub, sub } from "./pubsubhub.js";
 
 export const name = "core/pre-process";
 
diff --git a/src/core/pubsubhub.js b/src/core/pubsubhub.js
index 94c27eec2d..7259402bab 100644
--- a/src/core/pubsubhub.js
+++ b/src/core/pubsubhub.js
@@ -1,4 +1,4 @@
-import { expose } from "./expose-modules";
+import { expose } from "./expose-modules.js";
 
 /**
  * Module core/pubsubhub
diff --git a/src/core/render-biblio.js b/src/core/render-biblio.js
index b6d2ece5a9..9d41a095da 100644
--- a/src/core/render-biblio.js
+++ b/src/core/render-biblio.js
@@ -2,11 +2,11 @@
 // Module core/render-biblio
 // renders the biblio data pre-processed in core/biblio
 
-import { addId } from "./utils";
-import { biblio } from "./biblio";
-import { lang as defaultLang } from "../core/l10n";
+import { addId } from "./utils.js";
+import { biblio } from "./biblio.js";
+import { lang as defaultLang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 export const name = "core/render-biblio";
 
diff --git a/src/core/requirements.js b/src/core/requirements.js
index 96313d878c..b9991f61e0 100644
--- a/src/core/requirements.js
+++ b/src/core/requirements.js
@@ -10,7 +10,7 @@
 //     element with its href pointing to the requirement it should be referencing
 //     and a class of "reqRef".
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 export const name = "core/requirements";
 
diff --git a/src/core/respec-ready.js b/src/core/respec-ready.js
index 09957c715e..b21aafec3f 100644
--- a/src/core/respec-ready.js
+++ b/src/core/respec-ready.js
@@ -3,7 +3,7 @@
  * The property returns a promise that settles when ReSpec finishes
  * processing the document.
  */
-import { sub } from "./pubsubhub";
+import { sub } from "./pubsubhub.js";
 export const name = "core/respec-ready";
 
 const respecDonePromise = new Promise(resolve => {
diff --git a/src/core/structure.js b/src/core/structure.js
index 0cdcbdc63e..40efa4efa0 100644
--- a/src/core/structure.js
+++ b/src/core/structure.js
@@ -9,8 +9,8 @@
 //  - lang: can change the generated text (supported: en, fr)
 //  - maxTocLevel: only generate a TOC so many levels deep
 
-import { addId, children, parents, renameElement } from "./utils";
-import { lang as defaultLang } from "../core/l10n";
+import { addId, children, parents, renameElement } from "./utils.js";
+import { lang as defaultLang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
 
 const lowerHeaderTags = ["h2", "h3", "h4", "h5", "h6"];
diff --git a/src/core/ui.js b/src/core/ui.js
index fa5a616109..badb71ab09 100644
--- a/src/core/ui.js
+++ b/src/core/ui.js
@@ -10,9 +10,9 @@
 //  - once we have something decent, merge, ship as 3.2.0
 
 import hyperHTML from "hyperhtml";
-import { markdownToHtml } from "./utils";
-import shortcut from "../shortcut";
-import { sub } from "./pubsubhub";
+import { markdownToHtml } from "./utils.js";
+import shortcut from "../shortcut.js";
+import { sub } from "./pubsubhub.js";
 export const name = "core/ui";
 
 // Opportunistically inserts the style, with the chance to reduce some FOUC
diff --git a/src/core/utils.js b/src/core/utils.js
index f2f6e05b37..57b4a4a9b8 100644
--- a/src/core/utils.js
+++ b/src/core/utils.js
@@ -3,9 +3,9 @@
 // Module core/utils
 // As the name implies, this contains a ragtag gang of methods that just don't fit
 // anywhere else.
-import { lang as docLang } from "./l10n";
+import { lang as docLang } from "./l10n.js";
 import marked from "marked";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 export const name = "core/utils";
 
 marked.setOptions({
diff --git a/src/core/webidl-index.js b/src/core/webidl-index.js
index e60f30d3ea..df931631bf 100644
--- a/src/core/webidl-index.js
+++ b/src/core/webidl-index.js
@@ -11,7 +11,7 @@
  * that is preferred.
  */
 export const name = "core/webidl-index";
-import { nonNormativeSelector } from "./utils";
+import { nonNormativeSelector } from "./utils.js";
 
 export function run() {
   const idlIndexSec = document.querySelector("section#idl-index");
diff --git a/src/core/webidl.js b/src/core/webidl.js
index 1a8d5f256f..b56f1ed7cc 100644
--- a/src/core/webidl.js
+++ b/src/core/webidl.js
@@ -5,11 +5,11 @@
 //  - It could be useful to report parsed IDL items as events
 //  - don't use generated content in the CSS!
 import * as webidl2 from "webidl2";
-import { flatten, normalizePadding } from "./utils";
-import { findDfn } from "./dfn-finder";
+import { flatten, normalizePadding } from "./utils.js";
+import { findDfn } from "./dfn-finder.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "./pubsubhub";
-import { registerDefinition } from "./dfn-map";
+import { pub } from "./pubsubhub.js";
+import { registerDefinition } from "./dfn-map.js";
 
 export const name = "core/webidl";
 
diff --git a/src/core/worker.js b/src/core/worker.js
index cd20957561..b7c4806218 100644
--- a/src/core/worker.js
+++ b/src/core/worker.js
@@ -6,8 +6,8 @@
  */
 export const name = "core/worker";
 
-import { createResourceHint } from "./utils";
-import { expose } from "./expose-modules";
+import { createResourceHint } from "./utils.js";
+import { expose } from "./expose-modules.js";
 
 // Opportunistically preload syntax highlighter
 const hint = {
diff --git a/src/core/xref.js b/src/core/xref.js
index 495c1bde99..eeabc6313f 100644
--- a/src/core/xref.js
+++ b/src/core/xref.js
@@ -9,9 +9,9 @@ import {
   norm as normalize,
   showInlineError,
   showInlineWarning,
-} from "./utils";
+} from "./utils.js";
 import { openDB } from "idb";
-import { pub } from "./pubsubhub";
+import { pub } from "./pubsubhub.js";
 
 const profiles = {
   "web-platform": ["HTML", "INFRA", "URL", "WEBIDL", "DOM", "FETCH"],
diff --git a/src/ui/about-respec.js b/src/ui/about-respec.js
index bc1d57341f..f31fbc86c3 100644
--- a/src/ui/about-respec.js
+++ b/src/ui/about-respec.js
@@ -1,8 +1,8 @@
 // Module ui/about-respec
 // A simple about dialog with pointer to the help
-import { l10n, lang } from "../core/l10n";
+import { l10n, lang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
-import { ui } from "../core/ui";
+import { ui } from "../core/ui.js";
 
 // window.respecVersion is added at build time (see tools/builder.js)
 window.respecVersion = window.respecVersion || "Developer Edition";
diff --git a/src/ui/dfn-list.js b/src/ui/dfn-list.js
index c51072aa5a..3a22e6ac35 100644
--- a/src/ui/dfn-list.js
+++ b/src/ui/dfn-list.js
@@ -1,9 +1,9 @@
 // Module ui/dfn-list
 // Displays all definitions with links to the defining element.
-import { l10n, lang } from "../core/l10n";
-import { definitionMap } from "../core/dfn-map";
+import { l10n, lang } from "../core/l10n.js";
+import { definitionMap } from "../core/dfn-map.js";
 import hyperHTML from "hyperhtml";
-import { ui } from "../core/ui";
+import { ui } from "../core/ui.js";
 
 const button = ui.addCommand(
   l10n[lang].definition_list,
diff --git a/src/ui/save-html.js b/src/ui/save-html.js
index 9b00b837bf..28031c303f 100644
--- a/src/ui/save-html.js
+++ b/src/ui/save-html.js
@@ -1,11 +1,11 @@
 // @ts-check
 // Module ui/save-html
 // Saves content to HTML when asked to
-import { l10n, lang } from "../core/l10n";
+import { l10n, lang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "../core/pubsubhub";
-import { rsDocToDataURL } from "../core/exporter";
-import { ui } from "../core/ui";
+import { pub } from "../core/pubsubhub.js";
+import { rsDocToDataURL } from "../core/exporter.js";
+import { ui } from "../core/ui.js";
 
 export const name = "ui/save-html";
 
diff --git a/src/ui/search-specref.js b/src/ui/search-specref.js
index 3d9111501f..eb2e9db841 100644
--- a/src/ui/search-specref.js
+++ b/src/ui/search-specref.js
@@ -1,9 +1,9 @@
 // Module ui/search-specref
 // Search Specref database
-import { l10n, lang } from "../core/l10n";
+import { l10n, lang } from "../core/l10n.js";
 import hyperHTML from "hyperhtml";
-import { ui } from "../core/ui";
-import { wireReference } from "../core/biblio";
+import { ui } from "../core/ui.js";
+import { wireReference } from "../core/biblio.js";
 
 const button = ui.addCommand(
   l10n[lang].search_specref,
diff --git a/src/w3c/abstract.js b/src/w3c/abstract.js
index bfde3dac81..1916a139de 100644
--- a/src/w3c/abstract.js
+++ b/src/w3c/abstract.js
@@ -1,7 +1,7 @@
 // Module w3c/abstract
 // Handle the abstract section properly.
-import { l10n, lang } from "../core/l10n";
-import { pub } from "../core/pubsubhub";
+import { l10n, lang } from "../core/l10n.js";
+import { pub } from "../core/pubsubhub.js";
 export const name = "w3c/abstract";
 
 export async function run() {
diff --git a/src/w3c/conformance.js b/src/w3c/conformance.js
index 12627ebdd2..aef706f0a3 100644
--- a/src/w3c/conformance.js
+++ b/src/w3c/conformance.js
@@ -2,10 +2,10 @@
 // Module w3c/conformance
 // Handle the conformance section properly.
 import html from "hyperhtml";
-import { joinAnd } from "../core/utils";
-import { pub } from "../core/pubsubhub";
-import { renderInlineCitation } from "../core/render-biblio";
-import { rfc2119Usage } from "../core/inlines";
+import { joinAnd } from "../core/utils.js";
+import { pub } from "../core/pubsubhub.js";
+import { renderInlineCitation } from "../core/render-biblio.js";
+import { rfc2119Usage } from "../core/inlines.js";
 export const name = "w3c/conformance";
 
 /**
diff --git a/src/w3c/defaults.js b/src/w3c/defaults.js
index e1b63d11c4..7e077ce922 100644
--- a/src/w3c/defaults.js
+++ b/src/w3c/defaults.js
@@ -2,10 +2,10 @@
  * Sets the defaults for W3C specs
  */
 export const name = "w3c/defaults";
-import { coreDefaults } from "../core/defaults";
-import { definitionMap } from "../core/dfn-map";
-import linter from "../core/linter";
-import { rule as privsecSectionRule } from "./linter-rules/privsec-section";
+import { coreDefaults } from "../core/defaults.js";
+import { definitionMap } from "../core/dfn-map.js";
+import linter from "../core/linter.js";
+import { rule as privsecSectionRule } from "./linter-rules/privsec-section.js";
 
 linter.register(privsecSectionRule);
 
diff --git a/src/w3c/headers.js b/src/w3c/headers.js
index 77d5e08dea..55f7a84f54 100644
--- a/src/w3c/headers.js
+++ b/src/w3c/headers.js
@@ -90,13 +90,13 @@
 //      - "w3c-software", a permissive and attributions license (but GPL-compatible).
 //      - "w3c-software-doc", the W3C Software and Document License
 //            https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
-import { ISODate, concatDate, joinAnd } from "../core/utils";
-import cgbgHeadersTmpl from "./templates/cgbg-headers";
-import cgbgSotdTmpl from "./templates/cgbg-sotd";
-import headersTmpl from "./templates/headers";
+import { ISODate, concatDate, joinAnd } from "../core/utils.js";
+import cgbgHeadersTmpl from "./templates/cgbg-headers.js";
+import cgbgSotdTmpl from "./templates/cgbg-sotd.js";
+import headersTmpl from "./templates/headers.js";
 import hyperHTML from "hyperhtml";
-import { pub } from "../core/pubsubhub";
-import sotdTmpl from "./templates/sotd";
+import { pub } from "../core/pubsubhub.js";
+import sotdTmpl from "./templates/sotd.js";
 
 export const name = "w3c/headers";
 
diff --git a/src/w3c/l10n.js b/src/w3c/l10n.js
index 9a47e03d1e..c454b2a164 100644
--- a/src/w3c/l10n.js
+++ b/src/w3c/l10n.js
@@ -1,7 +1,7 @@
 // Module w3c/l10n
 // Looks at the lang attribute on the root element and uses it to manage the config.l10n object so
 // that other parts of the system can localise their text
-import { l10n } from "../core/l10n";
+import { l10n } from "../core/l10n.js";
 export const name = "w3c/l10n";
 const additions = {
   en: {
diff --git a/src/w3c/linter-rules/privsec-section.js b/src/w3c/linter-rules/privsec-section.js
index c6ec3ac027..e94157d7eb 100644
--- a/src/w3c/linter-rules/privsec-section.js
+++ b/src/w3c/linter-rules/privsec-section.js
@@ -7,8 +7,8 @@
  * case-insensitive, multi-line check.
  *
  */
-import LinterRule from "../../core/LinterRule";
-import { lang as defaultLang } from "../../core/l10n";
+import LinterRule from "../../core/LinterRule.js";
+import { lang as defaultLang } from "../../core/l10n.js";
 const name = "privsec-section";
 const meta = {
   en: {
diff --git a/src/w3c/linter.js b/src/w3c/linter.js
index 01b472a52d..555f430148 100644
--- a/src/w3c/linter.js
+++ b/src/w3c/linter.js
@@ -5,7 +5,7 @@
 
 export const name = "w3c/linter";
 
-import linter from "../core/linter";
-import { lint as privsec } from "./linter-rules/privsec-section";
+import linter from "../core/linter.js";
+import { lint as privsec } from "./linter-rules/privsec-section.js";
 
 linter.register(privsec);
diff --git a/src/w3c/seo.js b/src/w3c/seo.js
index bd08f78f5d..c9ed93c1f3 100644
--- a/src/w3c/seo.js
+++ b/src/w3c/seo.js
@@ -1,8 +1,8 @@
 // Module w3c/seo
 // Manages SEO information for documents
 // e.g. set the canonical URL for the document if configured
-import { biblio } from "../core/biblio";
-import { pub } from "../core/pubsubhub";
+import { biblio } from "../core/biblio.js";
+import { pub } from "../core/pubsubhub.js";
 export const name = "w3c/seo";
 export function run(conf) {
   const trLatestUri = conf.shortName
diff --git a/src/w3c/style.js b/src/w3c/style.js
index 6f7da2563a..0c9509bd71 100644
--- a/src/w3c/style.js
+++ b/src/w3c/style.js
@@ -4,8 +4,8 @@
 // CONFIGURATION
 //  - specStatus: the short code for the specification's maturity level or type (required)
 
-import { createResourceHint, linkCSS, toKeyValuePairs } from "../core/utils";
-import { pub, sub } from "../core/pubsubhub";
+import { createResourceHint, linkCSS, toKeyValuePairs } from "../core/utils.js";
+import { pub, sub } from "../core/pubsubhub.js";
 export const name = "w3c/style";
 function attachFixupScript(doc, version) {
   const script = doc.createElement("script");
diff --git a/src/w3c/templates/cgbg-headers.js b/src/w3c/templates/cgbg-headers.js
index 6e0bc74336..26d14575ec 100644
--- a/src/w3c/templates/cgbg-headers.js
+++ b/src/w3c/templates/cgbg-headers.js
@@ -1,8 +1,8 @@
 // @ts-check
 import html from "hyperhtml";
-import showLink from "./show-link";
-import showLogo from "./show-logo";
-import showPeople from "./show-people";
+import showLink from "./show-link.js";
+import showLogo from "./show-logo.js";
+import showPeople from "./show-people.js";
 
 export default conf => {
   return html`
diff --git a/src/w3c/templates/headers.js b/src/w3c/templates/headers.js
index 4582b8df79..7d600ae076 100644
--- a/src/w3c/templates/headers.js
+++ b/src/w3c/templates/headers.js
@@ -1,9 +1,9 @@
 // @ts-check
 import html from "hyperhtml";
-import { pub } from "../../core/pubsubhub";
-import showLink from "./show-link";
-import showLogo from "./show-logo";
-import showPeople from "./show-people";
+import { pub } from "../../core/pubsubhub.js";
+import showLink from "./show-link.js";
+import showLogo from "./show-logo.js";
+import showPeople from "./show-people.js";
 
 const ccLicense = "https://creativecommons.org/licenses/by/3.0/";
 const w3cLicense = "https://www.w3.org/Consortium/Legal/copyright-documents";
diff --git a/src/w3c/templates/show-link.js b/src/w3c/templates/show-link.js
index f661d14a5f..9418e2f451 100644
--- a/src/w3c/templates/show-link.js
+++ b/src/w3c/templates/show-link.js
@@ -1,6 +1,6 @@
 // @ts-check
 import hyperHTML from "hyperhtml";
-import { pub } from "../../core/pubsubhub";
+import { pub } from "../../core/pubsubhub.js";
 const html = hyperHTML;
 
 export default link => {
diff --git a/src/w3c/templates/show-logo.js b/src/w3c/templates/show-logo.js
index ebc19ce477..c4634db0d7 100644
--- a/src/w3c/templates/show-logo.js
+++ b/src/w3c/templates/show-logo.js
@@ -1,6 +1,6 @@
 // @ts-check
 import html from "hyperhtml";
-import { showInlineWarning } from "../../core/utils";
+import { showInlineWarning } from "../../core/utils.js";
 
 export default obj => {
   /** @type {HTMLAnchorElement} */
diff --git a/tools/babel-plugin-dynamic-import-requirejs.js b/tools/babel-plugin-dynamic-import-requirejs.js
index 75ccc8fe3f..a38b5ee5ab 100644
--- a/tools/babel-plugin-dynamic-import-requirejs.js
+++ b/tools/babel-plugin-dynamic-import-requirejs.js
@@ -1,12 +1,12 @@
 "use strict";
 
+// Supports dynamic import for RequireJS
+
 const { expression, default: template } = require("@babel/template");
 const { default: inherits } = require("@babel/plugin-syntax-dynamic-import");
 const { wrapInterop } = require("@babel/helper-module-transforms");
 
-exports.__esModule = true;
-
-exports.default = function() {
+module.exports = function() {
   return {
     inherits,
     visitor: {
@@ -25,5 +25,3 @@ exports.default = function() {
     },
   };
 };
-
-module.exports = exports.default;
diff --git a/tools/babel-plugin-import-meta-ignore.js b/tools/babel-plugin-import-meta-ignore.js
index ade5653385..a44c653003 100644
--- a/tools/babel-plugin-import-meta-ignore.js
+++ b/tools/babel-plugin-import-meta-ignore.js
@@ -1,5 +1,8 @@
 "use strict";
 
+// Removes import.meta from babel compiled results
+// as it's only for native ES module
+
 const { ast } = require("@babel/template").default;
 const { default: inherits } = require("@babel/plugin-syntax-import-meta");
 
diff --git a/tools/babel-plugin-import-path-requirejs.js b/tools/babel-plugin-import-path-requirejs.js
new file mode 100644
index 0000000000..f0852c42c2
--- /dev/null
+++ b/tools/babel-plugin-import-path-requirejs.js
@@ -0,0 +1,26 @@
+"use strict";
+
+// Trim '.js' extension from import/export declarations
+// beacuse RequireJS does not allow '.js' extension for relative paths
+
+module.exports = () => {
+  return {
+    visitor: {
+      ImportDeclaration(path) {
+        const { value: importPath } = path.node.source;
+        if (importPath.endsWith(".js")) {
+          path.node.source.value = importPath.slice(0, -3);
+        }
+      },
+      ExportDeclaration(path) {
+        if (!path.node.source) {
+          return;
+        }
+        const { value: importPath } = path.node.source;
+        if (importPath.endsWith(".js")) {
+          path.node.source.value = importPath.slice(0, -3);
+        }
+      },
+    },
+  };
+};

From dfb88031e14e3edef15e05895d7cbf0131781ccf Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 21:47:41 +0900
Subject: [PATCH 08/14] remove duplicated ext

---
 src/core/biblio.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/core/biblio.js b/src/core/biblio.js
index 1c99f40ced..e7f2ce75b5 100644
--- a/src/core/biblio.js
+++ b/src/core/biblio.js
@@ -11,7 +11,7 @@ import { pub } from "./pubsubhub.js";
 export const biblio = {};
 
 // for backward compatibity
-export { wireReference, stringifyReference } from "./render-biblio.js.js";
+export { wireReference, stringifyReference } from "./render-biblio.js";
 
 export const name = "core/biblio";
 

From 36ea874a59bd6f33cb60bf7da87a41ba10567ba2 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 22:14:06 +0900
Subject: [PATCH 09/14] [ci skip]

---
 karma.conf.js                                     | 12 ++++++++----
 tests/.eslintrc.yml                               |  2 +-
 tests/spec/SpecHelper.js                          | 14 ++++++--------
 tests/spec/core/algorithms-spec.js                |  8 ++++++++
 tests/spec/core/best-practices-spec.js            |  3 +++
 tests/spec/core/biblio-db-spec.js                 | 10 +++-------
 tests/spec/core/biblio-spec.js                    | 12 +++++++++---
 tests/spec/core/caniuse-spec.js                   |  9 +++++++++
 tests/spec/core/data-abbr-spec.js                 |  3 +++
 tests/spec/core/data-cite-spec.js                 |  3 +++
 tests/spec/core/data-include-spec.js              |  8 ++++++++
 tests/spec/core/data-tests-spec.js                |  8 ++++++++
 tests/spec/core/data-type-spec.js                 |  2 ++
 tests/spec/core/dfn-finder-spec.js                |  8 ++++++++
 tests/spec/core/dfn-spec.js                       |  8 ++++++++
 tests/spec/core/examples-spec.js                  |  8 ++++++++
 tests/spec/core/exporter-spec.js                  |  2 ++
 tests/spec/core/figures-spec.js                   |  9 +++++++++
 tests/spec/core/fix-headers-spec.js               |  3 +++
 tests/spec/core/github-spec.js                    |  8 ++++++++
 tests/spec/core/highlight-spec.js                 |  9 +++++++++
 tests/spec/core/highlight-vars-spec.js            |  2 ++
 tests/spec/core/id-headers-spec.js                |  3 +++
 tests/spec/core/idl-index-spec.js                 |  8 ++++++++
 tests/spec/core/include-config-spec.js            |  8 ++++++++
 tests/spec/core/informative-spec.js               |  8 ++++++++
 tests/spec/core/inlines-spec.js                   |  3 +++
 tests/spec/core/issues-notes-spec.js              |  9 +++++++++
 tests/spec/core/l10n-spec.js                      |  8 ++++++++
 tests/spec/core/link-to-dfn-spec.js               |  3 +++
 .../spec/core/linter-rules/check-charset-spec.js  |  8 ++------
 .../linter-rules/check-internal-slots-spec.js     |  9 +++------
 tests/spec/core/linter-rules/check-punctuation.js |  8 ++------
 .../core/linter-rules/local-refs-exist-spec.js    | 10 +++-------
 .../linter-rules/no-headingless-sections-spec.js  |  9 +++------
 .../spec/core/linter-rules/no-http-props-spec.js  |  8 ++------
 tests/spec/core/list-sorter-spec.js               |  3 +++
 tests/spec/core/location-hash-spec.js             |  3 +++
 tests/spec/core/markdown-spec.js                  |  9 +++++++++
 tests/spec/core/override-configuration-spec.js    |  3 +++
 tests/spec/core/pluralize-spec.js                 |  2 ++
 tests/spec/core/pre-process-spec.js               |  4 +++-
 tests/spec/core/pubsubhub-spec.js                 |  3 +++
 tests/spec/core/ready-promise-spec.js             |  3 +++
 tests/spec/core/remove-respec-spec.js             |  3 +++
 tests/spec/core/requirements-spec.js              |  3 +++
 tests/spec/core/section-refs-spec.js              |  3 +++
 tests/spec/core/seo-spec.js                       |  8 ++++++++
 tests/spec/core/structure-spec.js                 | 15 ++++++---------
 tests/spec/core/style-spec.js                     |  2 ++
 tests/spec/core/ui-spec.js                        |  2 ++
 tests/spec/core/utils-spec.js                     | 11 +++--------
 tests/spec/core/webidl-spec.js                    |  3 +++
 tests/spec/core/xref-spec.js                      | 15 ++++++++++-----
 tests/spec/w3c/abstract-spec.js                   |  8 ++++++++
 tests/spec/w3c/conformance-spec.js                |  8 ++++++++
 tests/spec/w3c/defaults-spec.js                   |  3 +++
 tests/spec/w3c/headers-spec.js                    | 14 +++++++++-----
 .../spec/w3c/linter-rules/privsec-section-spec.js |  9 +++------
 tests/spec/w3c/seo-spec.js                        |  2 ++
 tests/spec/w3c/style-spec.js                      | 10 ++++++++++
 61 files changed, 308 insertions(+), 94 deletions(-)

diff --git a/karma.conf.js b/karma.conf.js
index 53ce3650ff..0c6a673c70 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -43,19 +43,19 @@ module.exports = function(config) {
         served: true,
       },
       {
-        pattern: "js/deps/marked.js",
+        pattern: "js/**/*.*",
         included: false,
         served: true,
       },
       {
-        pattern: "js/**/*.*",
+        pattern: "src/**/*.*",
         included: false,
         served: true,
       },
       {
         pattern: "tests/**/*-spec.js",
-        included: false,
-        served: true,
+        type: "module",
+        included: true,
       },
       {
         pattern: "tests/data/**/*",
@@ -85,9 +85,13 @@ module.exports = function(config) {
     exclude: ["**/*.swp", "*.swp", ".DS_Store"],
 
     proxies: {
+      idb: "/base/node_modules/idb/build/esm/index.js",
+
       "/about-blank.html": "/base/tests/about-blank.html",
       "/assets/": "/base/assets/",
       "/js/": "/base/js/",
+      "/src/": "/base/src/",
+      "/node_modules/": "/base/node_modules/",
       "/builds/": "/base/builds/",
       "/tests/": "/base/tests/",
       "/spec/": "/base/tests/spec/",
diff --git a/tests/.eslintrc.yml b/tests/.eslintrc.yml
index f373bc7a3f..71f3e7551a 100644
--- a/tests/.eslintrc.yml
+++ b/tests/.eslintrc.yml
@@ -4,7 +4,7 @@ env:
 extends:
   - 'plugin:jasmine/recommended'
 parserOptions:
-  sourceType: script
+  sourceType: module
 rules:
   no-console: 2
   no-sparse-arrays: 0
diff --git a/tests/spec/SpecHelper.js b/tests/spec/SpecHelper.js
index e9d3d039e4..9e9329c015 100644
--- a/tests/spec/SpecHelper.js
+++ b/tests/spec/SpecHelper.js
@@ -1,12 +1,10 @@
-/* exported pickRandomsFromList, makeRSDoc, flushIframes,
- makeStandardOps, makeDefaultBody, makeBasicConfig */
 "use strict";
 const iframes = [];
 
 /**
  * @return {Promise<Document>}
  */
-function makeRSDoc(opts = {}, src, style = "") {
+export function makeRSDoc(opts = {}, src, style = "") {
   return new Promise((resolve, reject) => {
     const ifr = document.createElement("iframe");
     // reject when DEFAULT_TIMEOUT_INTERVAL passes
@@ -123,14 +121,14 @@ function decorateDocument(doc, opts) {
   }
 }
 
-function flushIframes() {
+export function flushIframes() {
   while (iframes.length) {
     // Popping them from the list prevents memory leaks.
     iframes.pop().remove();
   }
 }
 
-function pickRandomsFromList(list, howMany) {
+export function pickRandomsFromList(list, howMany) {
   // Get at least half by default.
   if (!howMany) {
     howMany = Math.floor(list.length / 2);
@@ -156,7 +154,7 @@ function pickRandomsFromList(list, howMany) {
   }, []);
 }
 
-function makeBasicConfig() {
+export function makeBasicConfig() {
   return {
     editors: [
       {
@@ -176,7 +174,7 @@ function makeBasicConfig() {
   };
 }
 
-function makeDefaultBody() {
+export function makeDefaultBody() {
   return "<section id='sotd'><p>foo</p></section><section id='toc'></section>";
 }
 
@@ -187,7 +185,7 @@ function makeDefaultBody() {
  * @returns {{config: {editors, specStatus, edDraftURI, shortName, previousMaturity, previousPublishDate, errata, implementationReportURI, perEnd, lint} & any, body: string}}
  */
 
-function makeStandardOps(config = {}, body = makeDefaultBody()) {
+export function makeStandardOps(config = {}, body = makeDefaultBody()) {
   return {
     body,
     config: { ...makeBasicConfig(), ...config },
diff --git a/tests/spec/core/algorithms-spec.js b/tests/spec/core/algorithms-spec.js
index b20cee21ea..c7daf76ba8 100644
--- a/tests/spec/core/algorithms-spec.js
+++ b/tests/spec/core/algorithms-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Algorithm Lists", () => {
   afterAll(flushIframes);
   it("adds 'assert' CSS class to Assert: in ordered lists that are marked as algorithms", async () => {
diff --git a/tests/spec/core/best-practices-spec.js b/tests/spec/core/best-practices-spec.js
index 3a5a549e27..db879d2fd3 100644
--- a/tests/spec/core/best-practices-spec.js
+++ b/tests/spec/core/best-practices-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeBasicConfig, makeRSDoc } from "../SpecHelper.js";
+
 describe("Core — Best Practices", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/biblio-db-spec.js b/tests/spec/core/biblio-db-spec.js
index 462ed4db8f..d5a4aadbb2 100644
--- a/tests/spec/core/biblio-db-spec.js
+++ b/tests/spec/core/biblio-db-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { biblioDB } from "../../../src/core/biblio-db.js";
+
 describe("Core - biblioDB", () => {
   const data = {
     "whatwg-dom": {
@@ -37,13 +40,6 @@ describe("Core - biblioDB", () => {
       id: "DAHUT",
     },
   };
-  let biblioDB;
-  beforeAll(done => {
-    require(["core/biblio-db"], ({ biblioDB: db }) => {
-      biblioDB = db;
-      done();
-    });
-  });
 
   describe("ready getter", () => {
     it("resolves with a IDB database", async () => {
diff --git a/tests/spec/core/biblio-spec.js b/tests/spec/core/biblio-spec.js
index 28ea07bcdf..1c69743300 100644
--- a/tests/spec/core/biblio-spec.js
+++ b/tests/spec/core/biblio-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("W3C — Bibliographic References", () => {
   const localBiblio = {
     Zzz: {
@@ -191,9 +199,7 @@ describe("W3C — Bibliographic References", () => {
   });
 
   it("fetches fresh results from specref", async () => {
-    const { biblioDB } = await new Promise(resolve => {
-      require(["core/biblio-db"], resolve);
-    });
+    const { biblioDB } = await import("../../../src/core/biblio-db.js");
 
     await biblioDB.ready;
     await biblioDB.clear();
diff --git a/tests/spec/core/caniuse-spec.js b/tests/spec/core/caniuse-spec.js
index 10cd1987df..f803865277 100644
--- a/tests/spec/core/caniuse-spec.js
+++ b/tests/spec/core/caniuse-spec.js
@@ -1,4 +1,13 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core — Can I Use", () => {
   afterAll(flushIframes);
   const apiURL = `${window.location.origin}/tests/data/caniuse/FEATURE.json`;
diff --git a/tests/spec/core/data-abbr-spec.js b/tests/spec/core/data-abbr-spec.js
index 53a6856181..d37fc7708c 100644
--- a/tests/spec/core/data-abbr-spec.js
+++ b/tests/spec/core/data-abbr-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeBasicConfig, makeRSDoc } from "../SpecHelper.js";
+
 describe("Core — data-abbr", () => {
   afterAll(flushIframes);
   it("processes definition abbreviations", async () => {
diff --git a/tests/spec/core/data-cite-spec.js b/tests/spec/core/data-cite-spec.js
index fb60b98abe..f3f91d237f 100644
--- a/tests/spec/core/data-cite-spec.js
+++ b/tests/spec/core/data-cite-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — data-cite attribute", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/data-include-spec.js b/tests/spec/core/data-include-spec.js
index 1e02672503..eceab3b1db 100644
--- a/tests/spec/core/data-include-spec.js
+++ b/tests/spec/core/data-include-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Data Include", () => {
   afterAll(flushIframes);
   // this does not test much, someone for whom this is
diff --git a/tests/spec/core/data-tests-spec.js b/tests/spec/core/data-tests-spec.js
index de739a48ba..78b00f0737 100644
--- a/tests/spec/core/data-tests-spec.js
+++ b/tests/spec/core/data-tests-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — data-tests attribute", () => {
   let doc;
   beforeAll(async () => {
diff --git a/tests/spec/core/data-type-spec.js b/tests/spec/core/data-type-spec.js
index f8386a1ce1..e1b6dbd705 100644
--- a/tests/spec/core/data-type-spec.js
+++ b/tests/spec/core/data-type-spec.js
@@ -1,3 +1,5 @@
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — data-type attribute", () => {
   afterAll(flushIframes);
   it("assigns the return type as the type for a method", async () => {
diff --git a/tests/spec/core/dfn-finder-spec.js b/tests/spec/core/dfn-finder-spec.js
index ddcb11e885..63de73b87b 100644
--- a/tests/spec/core/dfn-finder-spec.js
+++ b/tests/spec/core/dfn-finder-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Definition finder", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/dfn-spec.js b/tests/spec/core/dfn-spec.js
index cde9be2630..215ab74410 100644
--- a/tests/spec/core/dfn-spec.js
+++ b/tests/spec/core/dfn-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Definitions", () => {
   afterAll(flushIframes);
   it("processes definitions", async () => {
diff --git a/tests/spec/core/examples-spec.js b/tests/spec/core/examples-spec.js
index dca63ca707..1e6e3e563a 100644
--- a/tests/spec/core/examples-spec.js
+++ b/tests/spec/core/examples-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core — Examples", () => {
   afterAll(flushIframes);
   it("processes examples", async () => {
diff --git a/tests/spec/core/exporter-spec.js b/tests/spec/core/exporter-spec.js
index 0355e2905f..202622775a 100644
--- a/tests/spec/core/exporter-spec.js
+++ b/tests/spec/core/exporter-spec.js
@@ -1,5 +1,7 @@
 "use strict";
 
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - exporter", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/figures-spec.js b/tests/spec/core/figures-spec.js
index 156c16f8c5..4bee87a787 100644
--- a/tests/spec/core/figures-spec.js
+++ b/tests/spec/core/figures-spec.js
@@ -1,4 +1,13 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core - Figures", () => {
   afterAll(flushIframes);
   it("creates autolinks from the anchor to the figure", async () => {
diff --git a/tests/spec/core/fix-headers-spec.js b/tests/spec/core/fix-headers-spec.js
index 94ec3e3127..f17231b0b0 100644
--- a/tests/spec/core/fix-headers-spec.js
+++ b/tests/spec/core/fix-headers-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - Fix headers", () => {
   afterAll(flushIframes);
   it("sets the correct header levels", async () => {
diff --git a/tests/spec/core/github-spec.js b/tests/spec/core/github-spec.js
index fa7509b57b..8f9b6aead1 100644
--- a/tests/spec/core/github-spec.js
+++ b/tests/spec/core/github-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core - Github", () => {
   afterAll(flushIframes);
   const stringOpt = {
diff --git a/tests/spec/core/highlight-spec.js b/tests/spec/core/highlight-spec.js
index d4b453ad91..8a43abec4c 100644
--- a/tests/spec/core/highlight-spec.js
+++ b/tests/spec/core/highlight-spec.js
@@ -1,4 +1,13 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core — Highlight", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/highlight-vars-spec.js b/tests/spec/core/highlight-vars-spec.js
index 88bfd725ff..478692124f 100644
--- a/tests/spec/core/highlight-vars-spec.js
+++ b/tests/spec/core/highlight-vars-spec.js
@@ -1,5 +1,7 @@
 "use strict";
 
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 // TODO: add tests:
 // - right colors are applied
 
diff --git a/tests/spec/core/id-headers-spec.js b/tests/spec/core/id-headers-spec.js
index f60f02bee7..8a62f32422 100644
--- a/tests/spec/core/id-headers-spec.js
+++ b/tests/spec/core/id-headers-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - ID headers", () => {
   afterAll(flushIframes);
   let doc;
diff --git a/tests/spec/core/idl-index-spec.js b/tests/spec/core/idl-index-spec.js
index b98a2bf173..aeda6e0ba6 100644
--- a/tests/spec/core/idl-index-spec.js
+++ b/tests/spec/core/idl-index-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — IDL Index", () => {
   afterAll(flushIframes);
   it("generates an idl summary", async () => {
diff --git a/tests/spec/core/include-config-spec.js b/tests/spec/core/include-config-spec.js
index a37038bd02..956c11f936 100644
--- a/tests/spec/core/include-config-spec.js
+++ b/tests/spec/core/include-config-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Include config as JSON", () => {
   afterAll(flushIframes);
   let ops;
diff --git a/tests/spec/core/informative-spec.js b/tests/spec/core/informative-spec.js
index a42863ea5c..c1cf05549b 100644
--- a/tests/spec/core/informative-spec.js
+++ b/tests/spec/core/informative-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core — Informative", () => {
   afterAll(flushIframes);
   it("should process informative sections", async () => {
diff --git a/tests/spec/core/inlines-spec.js b/tests/spec/core/inlines-spec.js
index fa85cfb865..049397ad6a 100644
--- a/tests/spec/core/inlines-spec.js
+++ b/tests/spec/core/inlines-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - Inlines", () => {
   afterAll(flushIframes);
   it("processes inline cite content", async () => {
diff --git a/tests/spec/core/issues-notes-spec.js b/tests/spec/core/issues-notes-spec.js
index 0998e1b1b6..c0de8742fc 100644
--- a/tests/spec/core/issues-notes-spec.js
+++ b/tests/spec/core/issues-notes-spec.js
@@ -1,4 +1,13 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core — Issues and Notes", () => {
   afterAll(flushIframes);
   it("treats each issue as unique", async () => {
diff --git a/tests/spec/core/l10n-spec.js b/tests/spec/core/l10n-spec.js
index 9efcdb2ab1..fa2d1081e1 100644
--- a/tests/spec/core/l10n-spec.js
+++ b/tests/spec/core/l10n-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — l10n", () => {
   afterAll(flushIframes);
   const body = makeDefaultBody();
diff --git a/tests/spec/core/link-to-dfn-spec.js b/tests/spec/core/link-to-dfn-spec.js
index 27aaf2b045..a01c14938f 100644
--- a/tests/spec/core/link-to-dfn-spec.js
+++ b/tests/spec/core/link-to-dfn-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Link to definitions", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/linter-rules/check-charset-spec.js b/tests/spec/core/linter-rules/check-charset-spec.js
index 37cc837ca9..44b5ef9f63 100644
--- a/tests/spec/core/linter-rules/check-charset-spec.js
+++ b/tests/spec/core/linter-rules/check-charset-spec.js
@@ -1,14 +1,10 @@
+import { rule } from "../../../../src/core/linter-rules/check-charset.js";
+
 describe("Core Linter Rule - 'check-charset'", () => {
   const ruleName = "check-charset";
   const config = {
     lint: { [ruleName]: true },
   };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`core/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
 
   it("checks if meta[charset] is set to utf-8", async () => {
     const doc = document.implementation.createHTMLDocument("test doc");
diff --git a/tests/spec/core/linter-rules/check-internal-slots-spec.js b/tests/spec/core/linter-rules/check-internal-slots-spec.js
index 14c45cc6e4..d7383b21c9 100644
--- a/tests/spec/core/linter-rules/check-internal-slots-spec.js
+++ b/tests/spec/core/linter-rules/check-internal-slots-spec.js
@@ -1,15 +1,12 @@
 "use strict";
+
+import { rule } from "../../../../src/core/linter-rules/check-internal-slots.js";
+
 describe("Core Linter Rule - 'check-internal-slots'", () => {
   const ruleName = "check-internal-slots";
   const config = {
     lint: { [ruleName]: true },
   };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`core/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
   const doc = document.implementation.createHTMLDocument("test doc");
   beforeEach(() => {
     // Make sure every unordered test get an empty document
diff --git a/tests/spec/core/linter-rules/check-punctuation.js b/tests/spec/core/linter-rules/check-punctuation.js
index 26b7022706..d31f599a44 100644
--- a/tests/spec/core/linter-rules/check-punctuation.js
+++ b/tests/spec/core/linter-rules/check-punctuation.js
@@ -1,12 +1,8 @@
+import { rule } from "../../../../src/core/linter-rules/check-punctuation.js";
+
 describe("Core Linter Rule - 'check-punctuation'", () => {
   const ruleName = "check-punctuation";
   const config = { lint: { [ruleName]: true } };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`core/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
   it("checks p ending without a punctuation", async () => {
     const doc = document.implementation.createHTMLDocument("test doc");
     doc.body.innerHTML = `
diff --git a/tests/spec/core/linter-rules/local-refs-exist-spec.js b/tests/spec/core/linter-rules/local-refs-exist-spec.js
index ed563921f3..7be397541f 100644
--- a/tests/spec/core/linter-rules/local-refs-exist-spec.js
+++ b/tests/spec/core/linter-rules/local-refs-exist-spec.js
@@ -1,17 +1,13 @@
 "use strict";
+
+import { rule } from "../../../../src/core/linter-rules/local-refs-exist.js";
+
 describe("Core Linter Rule - 'local-refs-exist'", () => {
   const config = {
     lint: {
       "local-refs-exist": true,
     },
   };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require(["core/linter-rules/local-refs-exist"], ({ rule }) =>
-        resolve(rule));
-    });
-  });
   const doc = document.implementation.createHTMLDocument("test doc");
   beforeEach(() => {
     // Make sure every unordered test get an empty document
diff --git a/tests/spec/core/linter-rules/no-headingless-sections-spec.js b/tests/spec/core/linter-rules/no-headingless-sections-spec.js
index 7092242c83..a282ec6608 100644
--- a/tests/spec/core/linter-rules/no-headingless-sections-spec.js
+++ b/tests/spec/core/linter-rules/no-headingless-sections-spec.js
@@ -1,15 +1,12 @@
 "use strict";
+
+import { rule } from "../../../../src/core/linter-rules/no-headingless-sections.js";
+
 describe("Core Linter Rule - 'no-headingless-sections'", () => {
   const ruleName = "no-headingless-sections";
   const config = {
     lint: { [ruleName]: true },
   };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`core/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
   const doc = document.implementation.createHTMLDocument("test doc");
   beforeEach(() => {
     // Make sure every unordered test get an empty document
diff --git a/tests/spec/core/linter-rules/no-http-props-spec.js b/tests/spec/core/linter-rules/no-http-props-spec.js
index 1380f56687..5c37f20053 100644
--- a/tests/spec/core/linter-rules/no-http-props-spec.js
+++ b/tests/spec/core/linter-rules/no-http-props-spec.js
@@ -1,12 +1,8 @@
+import { rule } from "../../../../src/core/linter-rules/no-http-props.js";
+
 describe("Core Linter Rule - 'no-http-props'", () => {
   const ruleName = "no-http-props";
   const config = { lint: { [ruleName]: true } };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`core/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
   it("checks any prop ending with 'URI' (case sensitive)", async () => {
     const conf = Object.assign(
       {
diff --git a/tests/spec/core/list-sorter-spec.js b/tests/spec/core/list-sorter-spec.js
index b001629df1..81b4652af6 100644
--- a/tests/spec/core/list-sorter-spec.js
+++ b/tests/spec/core/list-sorter-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — list-sorter", () => {
   afterAll(flushIframes);
   let doc;
diff --git a/tests/spec/core/location-hash-spec.js b/tests/spec/core/location-hash-spec.js
index c17e7e0b60..0565a18ed4 100644
--- a/tests/spec/core/location-hash-spec.js
+++ b/tests/spec/core/location-hash-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Location Hash", () => {
   afterAll(flushIframes);
   const ops = makeStandardOps();
diff --git a/tests/spec/core/markdown-spec.js b/tests/spec/core/markdown-spec.js
index ab9ae01a42..cb1e1c90e0 100644
--- a/tests/spec/core/markdown-spec.js
+++ b/tests/spec/core/markdown-spec.js
@@ -1,4 +1,13 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 describe("Core - Markdown", () => {
   afterAll(flushIframes);
   it("processes standard markdown content", async () => {
diff --git a/tests/spec/core/override-configuration-spec.js b/tests/spec/core/override-configuration-spec.js
index e2099c49da..1f483c5ec6 100644
--- a/tests/spec/core/override-configuration-spec.js
+++ b/tests/spec/core/override-configuration-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Override Configuration", () => {
   afterAll(flushIframes);
   const simpleURL = new URL("./spec/core/simple.html", document.location);
diff --git a/tests/spec/core/pluralize-spec.js b/tests/spec/core/pluralize-spec.js
index 492ab5c02c..5ecc9a5264 100644
--- a/tests/spec/core/pluralize-spec.js
+++ b/tests/spec/core/pluralize-spec.js
@@ -1,3 +1,5 @@
+import { makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - Pluralize", () => {
   it("adds pluralization when [data-lt] is not specified", async () => {
     const body = `
diff --git a/tests/spec/core/pre-process-spec.js b/tests/spec/core/pre-process-spec.js
index 3fe800a158..218a4bb726 100644
--- a/tests/spec/core/pre-process-spec.js
+++ b/tests/spec/core/pre-process-spec.js
@@ -1,4 +1,6 @@
-"use strict";
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
+("use strict");
 describe("Core - preProcess, postProcess, afterEnd", () => {
   afterAll(flushIframes);
   let doc;
diff --git a/tests/spec/core/pubsubhub-spec.js b/tests/spec/core/pubsubhub-spec.js
index 728c6a639b..d455f08e53 100644
--- a/tests/spec/core/pubsubhub-spec.js
+++ b/tests/spec/core/pubsubhub-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - pubsubhub", () => {
   afterAll(flushIframes);
   let doc;
diff --git a/tests/spec/core/ready-promise-spec.js b/tests/spec/core/ready-promise-spec.js
index df5a791fe4..4693457e82 100644
--- a/tests/spec/core/ready-promise-spec.js
+++ b/tests/spec/core/ready-promise-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("respecIsReady promise", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/remove-respec-spec.js b/tests/spec/core/remove-respec-spec.js
index bc3898e0d3..14f78eab31 100644
--- a/tests/spec/core/remove-respec-spec.js
+++ b/tests/spec/core/remove-respec-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Remove ReSpec", () => {
   afterAll(flushIframes);
   it("should have removed all artifacts", async () => {
diff --git a/tests/spec/core/requirements-spec.js b/tests/spec/core/requirements-spec.js
index 48019a6daa..028cc28543 100644
--- a/tests/spec/core/requirements-spec.js
+++ b/tests/spec/core/requirements-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Requirements", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/section-refs-spec.js b/tests/spec/core/section-refs-spec.js
index 7d3c68485b..3b57bfff92 100644
--- a/tests/spec/core/section-refs-spec.js
+++ b/tests/spec/core/section-refs-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - Section References", () => {
   afterAll(flushIframes);
   it("should have produced the section reference", async () => {
diff --git a/tests/spec/core/seo-spec.js b/tests/spec/core/seo-spec.js
index 0f88472a4e..0d47cefc86 100644
--- a/tests/spec/core/seo-spec.js
+++ b/tests/spec/core/seo-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("Core — Seo", () => {
   afterAll(flushIframes);
   it("doesn't insert a meta description element if there is no abstract", async () => {
diff --git a/tests/spec/core/structure-spec.js b/tests/spec/core/structure-spec.js
index 076183e686..1c18542e4e 100644
--- a/tests/spec/core/structure-spec.js
+++ b/tests/spec/core/structure-spec.js
@@ -1,12 +1,9 @@
 "use strict";
+
+import { makeBasicConfig, makeDefaultBody, makeRSDoc } from "../SpecHelper.js";
+import { children } from "../../../src/core/utils.js";
+
 describe("Core - Structure", () => {
-  let utils;
-  beforeAll(done => {
-    require(["core/utils"], u => {
-      utils = u;
-      done();
-    });
-  });
   const body = `
       ${makeDefaultBody()}
       <section class="introductory">
@@ -135,10 +132,10 @@ describe("Core - Structure", () => {
     const doc = await makeRSDoc(ops);
     const toc = doc.getElementById("toc");
     expect(toc.querySelector("h2").textContent).toBe("Table of Contents");
-    expect(utils.children(toc, "ol > li").length).toBe(7);
+    expect(children(toc, "ol > li").length).toBe(7);
     expect(toc.querySelectorAll("li").length).toBe(19);
     expect(toc.querySelector("ol > li").textContent).toBe("Abstract");
-    expect(utils.children(toc, "ol > li a[href='#intro']").length).toBe(1);
+    expect(children(toc, "ol > li a[href='#intro']").length).toBe(1);
   });
 
   it("should limit ToC depth with maxTocLevel", async () => {
diff --git a/tests/spec/core/style-spec.js b/tests/spec/core/style-spec.js
index dcd2741da0..06048ac159 100644
--- a/tests/spec/core/style-spec.js
+++ b/tests/spec/core/style-spec.js
@@ -1,3 +1,5 @@
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core — Style", () => {
   afterAll(flushIframes);
   it("includes ReSpec's style element", async () => {
diff --git a/tests/spec/core/ui-spec.js b/tests/spec/core/ui-spec.js
index 01af6f20ed..f534c85dc0 100644
--- a/tests/spec/core/ui-spec.js
+++ b/tests/spec/core/ui-spec.js
@@ -1,5 +1,7 @@
 "use strict";
 
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - UI", () => {
   afterAll(flushIframes);
 
diff --git a/tests/spec/core/utils-spec.js b/tests/spec/core/utils-spec.js
index a1a2b17066..5989e7ac14 100644
--- a/tests/spec/core/utils-spec.js
+++ b/tests/spec/core/utils-spec.js
@@ -1,13 +1,8 @@
 "use strict";
-describe("Core - Utils", () => {
-  let utils;
-  beforeAll(done => {
-    require(["core/utils"], u => {
-      utils = u;
-      done();
-    });
-  });
 
+import * as utils from "../../../src/core/utils.js";
+
+describe("Core - Utils", () => {
   describe("fetchAndCache", () => {
     async function clearCaches() {
       const keys = await caches.keys();
diff --git a/tests/spec/core/webidl-spec.js b/tests/spec/core/webidl-spec.js
index 40334436c4..37549618eb 100644
--- a/tests/spec/core/webidl-spec.js
+++ b/tests/spec/core/webidl-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 describe("Core - WebIDL", () => {
   afterAll(flushIframes);
   /** @type {Document} */
diff --git a/tests/spec/core/xref-spec.js b/tests/spec/core/xref-spec.js
index ff869d4af3..efb2163a19 100644
--- a/tests/spec/core/xref-spec.js
+++ b/tests/spec/core/xref-spec.js
@@ -1,14 +1,19 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+import { IDBKeyVal } from "../../../src/core/utils.js";
+import { openDB } from "idb";
+
 describe("Core — xref", () => {
   afterAll(flushIframes);
 
   let cache;
   beforeAll(async () => {
-    await new Promise(resolve => require(["deps/idb"], resolve));
-    const { openDB } = window.idb;
-    const { IDBKeyVal } = await new Promise(resolve =>
-      require(["core/utils"], resolve)
-    );
     const idb = await openDB("xref", 1, {
       upgrade(db) {
         db.createObjectStore("xrefs");
diff --git a/tests/spec/w3c/abstract-spec.js b/tests/spec/w3c/abstract-spec.js
index 330d23d7eb..b5226f7b09 100644
--- a/tests/spec/w3c/abstract-spec.js
+++ b/tests/spec/w3c/abstract-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("W3C — Abstract", () => {
   afterAll(flushIframes);
   it("includes a h2 and sets the class", async () => {
diff --git a/tests/spec/w3c/conformance-spec.js b/tests/spec/w3c/conformance-spec.js
index edb06299ca..951aafff61 100644
--- a/tests/spec/w3c/conformance-spec.js
+++ b/tests/spec/w3c/conformance-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+} from "../SpecHelper.js";
+
 describe("W3C — Conformance", () => {
   afterAll(flushIframes);
   it("includes a h2 and inject its content", async () => {
diff --git a/tests/spec/w3c/defaults-spec.js b/tests/spec/w3c/defaults-spec.js
index 7da93ddf46..5297ee3407 100644
--- a/tests/spec/w3c/defaults-spec.js
+++ b/tests/spec/w3c/defaults-spec.js
@@ -1,4 +1,7 @@
 "use strict";
+
+import { flushIframes, makeDefaultBody, makeRSDoc } from "../SpecHelper.js";
+
 describe("W3C — Defaults", () => {
   afterAll(flushIframes);
   it("sets sensible defaults for w3c specs", async () => {
diff --git a/tests/spec/w3c/headers-spec.js b/tests/spec/w3c/headers-spec.js
index 4e70053bda..dc92f035ec 100644
--- a/tests/spec/w3c/headers-spec.js
+++ b/tests/spec/w3c/headers-spec.js
@@ -1,4 +1,12 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
+
 const findContent = string => {
   return ({ textContent }) => textContent.trim() === string;
 };
@@ -526,11 +534,7 @@ describe("W3C — Headers", () => {
 
   describe("previousPublishDate & previousMaturity", () => {
     it("recovers given bad date inputs", async () => {
-      const ISODate = await new Promise(resolve => {
-        require(["core/utils"], ({ ISODate }) => {
-          resolve(ISODate);
-        });
-      });
+      const { ISODate } = await import("../../../src/core/utils.js");
 
       const ops = makeStandardOps();
       const start = new Date(ISODate.format(Date.now())).valueOf();
diff --git a/tests/spec/w3c/linter-rules/privsec-section-spec.js b/tests/spec/w3c/linter-rules/privsec-section-spec.js
index 766dd5d47d..8253a348b5 100644
--- a/tests/spec/w3c/linter-rules/privsec-section-spec.js
+++ b/tests/spec/w3c/linter-rules/privsec-section-spec.js
@@ -1,16 +1,13 @@
 "use strict";
+
+import { rule } from "../../../../src/w3c/linter-rules/privsec-section.js";
+
 describe("W3C Linter Rule - 'privsec-section'", () => {
   const ruleName = "privsec-section";
   const config = {
     isRecTrack: true,
     lint: { [ruleName]: true },
   };
-  let rule;
-  beforeAll(async () => {
-    rule = await new Promise(resolve => {
-      require([`w3c/linter-rules/${ruleName}`], ({ rule }) => resolve(rule));
-    });
-  });
   const doc = document.implementation.createHTMLDocument("test doc");
   it("returns errors when missing privacy section", async () => {
     const result = await rule.lint(config, doc);
diff --git a/tests/spec/w3c/seo-spec.js b/tests/spec/w3c/seo-spec.js
index abe0b181c2..a19d05e707 100644
--- a/tests/spec/w3c/seo-spec.js
+++ b/tests/spec/w3c/seo-spec.js
@@ -1,5 +1,7 @@
 "use strict";
 
+import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+
 function makeTest(uri) {
   return doc => {
     const canLink = doc.querySelector("link[rel='canonical']");
diff --git a/tests/spec/w3c/style-spec.js b/tests/spec/w3c/style-spec.js
index 4b84acd7ce..ed7b6732f7 100644
--- a/tests/spec/w3c/style-spec.js
+++ b/tests/spec/w3c/style-spec.js
@@ -1,4 +1,14 @@
 "use strict";
+
+import {
+  flushIframes,
+  makeBasicConfig,
+  makeDefaultBody,
+  makeRSDoc,
+  makeStandardOps,
+  pickRandomsFromList,
+} from "../SpecHelper.js";
+
 const specStatus = [
   {
     status: "FPWD",

From 9f49d03fb11bb0011a34a8b0ecb5d188a929e536 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Sun, 7 Apr 2019 22:21:42 +0900
Subject: [PATCH 10/14] [ci skip]

---
 tests/spec/core/includer.html         |  3 +--
 tests/spec/core/pre-process-spec.html |  3 +--
 tests/spec/core/simple.html           | 10 +---------
 tests/spec/core/webidl.html           |  3 +--
 tests/spec/core/xref-spec.js          |  2 +-
 5 files changed, 5 insertions(+), 16 deletions(-)

diff --git a/tests/spec/core/includer.html b/tests/spec/core/includer.html
index e8f873b4ea..9286648f96 100644
--- a/tests/spec/core/includer.html
+++ b/tests/spec/core/includer.html
@@ -3,8 +3,7 @@
   <head>
     <meta charset='utf-8'/>
     <title>Includer Spec</title>
-    <script class='remove' src='/js/deps/require.js' data-main='/js/profile-w3c-common'>
-    </script>
+    <script class='remove' src='/builds/respec-w3c-common.js'></script>
     <script class='remove'>
       var respecConfig = {
               specStatus:   "ED"
diff --git a/tests/spec/core/pre-process-spec.html b/tests/spec/core/pre-process-spec.html
index 16f9e4702a..f523bf5b45 100644
--- a/tests/spec/core/pre-process-spec.html
+++ b/tests/spec/core/pre-process-spec.html
@@ -1,6 +1,5 @@
 <!doctype html>
-<script src="/js/deps/require.js" data-main="/js/profile-w3c-common">
-</script>
+<script class='remove' src='/builds/respec-w3c-common.js'></script>
 <script class='remove'>
 function noOp() {}
 
diff --git a/tests/spec/core/simple.html b/tests/spec/core/simple.html
index d3d0ec2a3f..d34cff7621 100644
--- a/tests/spec/core/simple.html
+++ b/tests/spec/core/simple.html
@@ -2,15 +2,7 @@
 <html>
 <meta charset='utf-8'/>
 <title>Simple Spec</title>
-<script class='remove'>
-  const script = document.createElement("script");
-  script.dataset.main = "/js/profile-w3c-common";
-  script.classList.add("remove");
-  script.src = window.__karma__ ?
-      "/builds/respec-w3c-common.js"
-    : "/js/deps/require.js";
-  document.head.appendChild(script);
-</script>
+<script class='remove' src='/builds/respec-w3c-common.js'></script>
 <script class='remove'>
 var respecConfig = {
   specStatus: "ED",
diff --git a/tests/spec/core/webidl.html b/tests/spec/core/webidl.html
index 714e853084..393ab787f9 100644
--- a/tests/spec/core/webidl.html
+++ b/tests/spec/core/webidl.html
@@ -3,8 +3,7 @@
   <head>
     <meta charset='utf-8'/>
     <title>WebIDL Tests</title>
-    <script class='remove' src='/js/deps/require.js' data-main='/js/profile-w3c-common'>
-    </script>
+    <script class='remove' src='/builds/respec-w3c-common.js'></script>
     <script class='remove'>
       var respecConfig = {
               specStatus:   "ED"
diff --git a/tests/spec/core/xref-spec.js b/tests/spec/core/xref-spec.js
index efb2163a19..e2f363beb4 100644
--- a/tests/spec/core/xref-spec.js
+++ b/tests/spec/core/xref-spec.js
@@ -7,7 +7,7 @@ import {
   makeStandardOps,
 } from "../SpecHelper.js";
 import { IDBKeyVal } from "../../../src/core/utils.js";
-import { openDB } from "idb";
+import { openDB } from "./node_modules/idb/build/esm/index.js";
 
 describe("Core — xref", () => {
   afterAll(flushIframes);

From a534391ae98438e0c6c76a15f9f1494210a40976 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Mon, 8 Apr 2019 16:46:32 +0900
Subject: [PATCH 11/14] move marked dependency

---
 src/core/markdown.js | 25 ++++++++++++++++++++++++-
 src/core/ui.js       |  2 +-
 src/core/utils.js    | 20 --------------------
 3 files changed, 25 insertions(+), 22 deletions(-)

diff --git a/src/core/markdown.js b/src/core/markdown.js
index c3be173032..bbbd1ccec9 100644
--- a/src/core/markdown.js
+++ b/src/core/markdown.js
@@ -1,3 +1,4 @@
+// @ts-check
 /**
  * Module core/markdown
  * Handles the optional markdown processing.
@@ -43,9 +44,31 @@
  * The whitespace of pre elements are left alone.
  */
 
-import { markdownToHtml } from "./utils.js";
+import marked from "marked";
+import { normalizePadding } from "./utils.js";
 export const name = "core/markdown";
 
+const gtEntity = /&gt;/gm;
+const ampEntity = /&amp;/gm;
+
+/**
+ * @param {string} text
+ */
+export function markdownToHtml(text) {
+  const normalizedLeftPad = normalizePadding(text);
+  // As markdown is pulled from HTML, > and & are already escaped and
+  // so blockquotes aren't picked up by the parser. This fixes it.
+  const potentialMarkdown = normalizedLeftPad
+    .replace(gtEntity, ">")
+    .replace(ampEntity, "&");
+  const result = marked(potentialMarkdown, {
+    sanitize: false,
+    gfm: true,
+    headerIds: false,
+  });
+  return result;
+}
+
 function processElements(selector) {
   return element => {
     const elements = Array.from(element.querySelectorAll(selector));
diff --git a/src/core/ui.js b/src/core/ui.js
index badb71ab09..4b0576a744 100644
--- a/src/core/ui.js
+++ b/src/core/ui.js
@@ -10,7 +10,7 @@
 //  - once we have something decent, merge, ship as 3.2.0
 
 import hyperHTML from "hyperhtml";
-import { markdownToHtml } from "./utils.js";
+import { markdownToHtml } from "./markdown.js";
 import shortcut from "../shortcut.js";
 import { sub } from "./pubsubhub.js";
 export const name = "core/ui";
diff --git a/src/core/utils.js b/src/core/utils.js
index 57b4a4a9b8..016d14211b 100644
--- a/src/core/utils.js
+++ b/src/core/utils.js
@@ -4,32 +4,12 @@
 // As the name implies, this contains a ragtag gang of methods that just don't fit
 // anywhere else.
 import { lang as docLang } from "./l10n.js";
-import marked from "marked";
 import { pub } from "./pubsubhub.js";
 export const name = "core/utils";
 
-marked.setOptions({
-  sanitize: false,
-  gfm: true,
-  headerIds: false,
-});
-
 const spaceOrTab = /^[ |\t]*/;
 const endsWithSpace = /\s+$/gm;
 const dashes = /-/g;
-const gtEntity = /&gt;/gm;
-const ampEntity = /&amp;/gm;
-
-export function markdownToHtml(text) {
-  const normalizedLeftPad = normalizePadding(text);
-  // As markdown is pulled from HTML, > and & are already escaped and
-  // so blockquotes aren't picked up by the parser. This fixes it.
-  const potentialMarkdown = normalizedLeftPad
-    .replace(gtEntity, ">")
-    .replace(ampEntity, "&");
-  const result = marked(potentialMarkdown);
-  return result;
-}
 
 export const ISODate = new Intl.DateTimeFormat(["en-ca-iso8601"], {
   timeZone: "UTC",

From 8dec1c81ed6f364cd25e4482bb1b7e9afdef9bf1 Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Mon, 8 Apr 2019 16:47:18 +0900
Subject: [PATCH 12/14] properly load modules in karma

---
 karma.conf.js                | 26 ++++++++++++++------------
 tests/spec/core/xref-spec.js |  2 +-
 tests/test-main.js           | 31 ++++++-------------------------
 3 files changed, 21 insertions(+), 38 deletions(-)

diff --git a/karma.conf.js b/karma.conf.js
index 0c6a673c70..6817e8204b 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -30,55 +30,57 @@ module.exports = function(config) {
       {
         pattern: "assets/**/*.*",
         included: false,
-        served: true,
       },
       {
         pattern: "tests/support-files/**/*",
         included: false,
-        served: true,
       },
       {
         pattern: "builds/**/*.*",
         included: false,
-        served: true,
       },
       {
         pattern: "js/**/*.*",
         included: false,
-        served: true,
       },
       {
         pattern: "src/**/*.*",
         included: false,
-        served: true,
+      },
+      {
+        pattern: "node_modules/idb/**/*.js",
+        included: false,
       },
       {
         pattern: "tests/**/*-spec.js",
         type: "module",
-        included: true,
+        included: false,
       },
       {
         pattern: "tests/data/**/*",
         included: false,
-        served: true,
       },
       {
         pattern: "tests/*.html",
         included: false,
-        served: true,
       },
       {
         pattern: "tests/**/*.html",
         included: false,
-        served: true,
       },
       {
         pattern: "worker/*.js",
         included: false,
-        served: true,
       },
-      "tests/spec/SpecHelper.js",
-      "tests/test-main.js",
+      {
+        pattern: "tests/spec/SpecHelper.js",
+        type: "module",
+        included: false,
+      },
+      {
+        pattern: "tests/test-main.js",
+        type: "module",
+      },
     ],
 
     // list of files to exclude
diff --git a/tests/spec/core/xref-spec.js b/tests/spec/core/xref-spec.js
index e2f363beb4..96d530a608 100644
--- a/tests/spec/core/xref-spec.js
+++ b/tests/spec/core/xref-spec.js
@@ -7,7 +7,7 @@ import {
   makeStandardOps,
 } from "../SpecHelper.js";
 import { IDBKeyVal } from "../../../src/core/utils.js";
-import { openDB } from "./node_modules/idb/build/esm/index.js";
+import { openDB } from "../../../node_modules/idb/build/esm/index.js";
 
 describe("Core — xref", () => {
   afterAll(flushIframes);
diff --git a/tests/test-main.js b/tests/test-main.js
index af82328a29..936d0e65e8 100644
--- a/tests/test-main.js
+++ b/tests/test-main.js
@@ -3,29 +3,10 @@
 // Get a list of all the test files to include
 const testFiles = Object.keys(window.__karma__.files)
   // ends with "-spec.js"
-  .filter(file => /-spec\.js$/.test(file))
-  // Normalize paths to RequireJS module names.
-  // If you require sub-dependencies of test files to be loaded as-is (requiring file extension)
-  // then do not normalize the paths
-  .map(file => file.replace(/^\/base\//, "").replace(/\.js$/, ""));
+  .filter(file => /-spec\.js$/.test(file));
 
-require.config({
-  // Karma serves files under /base, which is the basePath from your config file
-  baseUrl: "/base/",
-  // dynamically load all test files and other deps
-  deps: testFiles,
-  // we have to kickoff jasmine, as it is asynchronous
-  callback: window.__karma__.start,
-  paths: {
-    core: "/base/js/core",
-    w3c: "/base/js/w3c",
-    clipboard: "deps/clipboard",
-    hyperhtml: "deps/hyperhtml",
-    "idb-keyval": "deps/idb",
-    jquery: "deps/jquery",
-    marked: "deps/marked",
-    pluralize: "deps/pluralize",
-    text: "deps/text",
-    webidl2: "deps/webidl2",
-  },
-});
+// Note that import() here is a special ES syntax
+// so it cannot be used as .map(import);
+Promise.all(testFiles.map(testFile => import(testFile))).then(
+  window.__karma__.start
+);

From b681d5e088bbb8000ce98ae1b8c308cd14dac95f Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Mon, 8 Apr 2019 17:27:33 +0900
Subject: [PATCH 13/14] try reverting to require

---
 tests/spec/core/includer.html         |  3 ++-
 tests/spec/core/pre-process-spec.html |  3 ++-
 tests/spec/core/simple.html           | 10 +++++++++-
 tests/spec/core/webidl.html           |  3 ++-
 4 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/tests/spec/core/includer.html b/tests/spec/core/includer.html
index 9286648f96..e8f873b4ea 100644
--- a/tests/spec/core/includer.html
+++ b/tests/spec/core/includer.html
@@ -3,7 +3,8 @@
   <head>
     <meta charset='utf-8'/>
     <title>Includer Spec</title>
-    <script class='remove' src='/builds/respec-w3c-common.js'></script>
+    <script class='remove' src='/js/deps/require.js' data-main='/js/profile-w3c-common'>
+    </script>
     <script class='remove'>
       var respecConfig = {
               specStatus:   "ED"
diff --git a/tests/spec/core/pre-process-spec.html b/tests/spec/core/pre-process-spec.html
index f523bf5b45..16f9e4702a 100644
--- a/tests/spec/core/pre-process-spec.html
+++ b/tests/spec/core/pre-process-spec.html
@@ -1,5 +1,6 @@
 <!doctype html>
-<script class='remove' src='/builds/respec-w3c-common.js'></script>
+<script src="/js/deps/require.js" data-main="/js/profile-w3c-common">
+</script>
 <script class='remove'>
 function noOp() {}
 
diff --git a/tests/spec/core/simple.html b/tests/spec/core/simple.html
index d34cff7621..d3d0ec2a3f 100644
--- a/tests/spec/core/simple.html
+++ b/tests/spec/core/simple.html
@@ -2,7 +2,15 @@
 <html>
 <meta charset='utf-8'/>
 <title>Simple Spec</title>
-<script class='remove' src='/builds/respec-w3c-common.js'></script>
+<script class='remove'>
+  const script = document.createElement("script");
+  script.dataset.main = "/js/profile-w3c-common";
+  script.classList.add("remove");
+  script.src = window.__karma__ ?
+      "/builds/respec-w3c-common.js"
+    : "/js/deps/require.js";
+  document.head.appendChild(script);
+</script>
 <script class='remove'>
 var respecConfig = {
   specStatus: "ED",
diff --git a/tests/spec/core/webidl.html b/tests/spec/core/webidl.html
index 393ab787f9..714e853084 100644
--- a/tests/spec/core/webidl.html
+++ b/tests/spec/core/webidl.html
@@ -3,7 +3,8 @@
   <head>
     <meta charset='utf-8'/>
     <title>WebIDL Tests</title>
-    <script class='remove' src='/builds/respec-w3c-common.js'></script>
+    <script class='remove' src='/js/deps/require.js' data-main='/js/profile-w3c-common'>
+    </script>
     <script class='remove'>
       var respecConfig = {
               specStatus:   "ED"

From 35b23a8a9317ea022e7bffc6978895d2e4e1cccc Mon Sep 17 00:00:00 2001
From: Kagami Sascha Rosylight <saschanaz@outlook.com>
Date: Tue, 9 Apr 2019 17:20:49 +0900
Subject: [PATCH 14/14] cancel redundant karma path

---
 karma.conf.js            | 2 --
 src/core/issues-notes.js | 4 +---
 2 files changed, 1 insertion(+), 5 deletions(-)

diff --git a/karma.conf.js b/karma.conf.js
index 6817e8204b..1cfc00cbb6 100644
--- a/karma.conf.js
+++ b/karma.conf.js
@@ -87,8 +87,6 @@ module.exports = function(config) {
     exclude: ["**/*.swp", "*.swp", ".DS_Store"],
 
     proxies: {
-      idb: "/base/node_modules/idb/build/esm/index.js",
-
       "/about-blank.html": "/base/tests/about-blank.html",
       "/assets/": "/base/assets/",
       "/js/": "/base/js/",
diff --git a/src/core/issues-notes.js b/src/core/issues-notes.js
index e80ead8cbd..0f1b5ff5b5 100644
--- a/src/core/issues-notes.js
+++ b/src/core/issues-notes.js
@@ -98,9 +98,7 @@ function handleIssues(ins, ghIssues, conf) {
           text += ` ${issueNum}`;
         } else if (dataNum) {
           text += ` ${dataNum}`;
-          const link = linkToIssueTracker(Number(dataNum), conf, {
-            isFeatureAtRisk,
-          });
+          const link = linkToIssueTracker(dataNum, conf, { isFeatureAtRisk });
           if (link) {
             title.before(link);
             link.append(title);