refactor!: remove legacy AMD require shim from expose-modules (#5185)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>

Author: marcoscaceres

src/core/exporter.js

@@ -7,7 +7,6 @@
  */
 
 import { removeCommentNodes, removeReSpec } from "./utils.js";
-import { expose } from "./expose-modules.js";
 import { html } from "./import-maps.js";
 import { pub } from "./pubsubhub.js";
 
@@ -107,5 +106,3 @@ function prettify(cloneDoc) {
     el.outerHTML = `\n${el.outerHTML}`;
   });
 }
-
-expose("core/exporter", { rsDocToDataURL });

src/core/expose-modules.js

@@ -7,7 +7,6 @@
  */
 export const name = "core/pubsubhub";
 
-import { expose } from "./expose-modules.js";
 import { showError } from "./utils.js";
 
 const subscriptions = new EventTarget();
@@ -51,5 +50,3 @@ export function sub(topic, cb, options = { once: false }) {
   };
   subscriptions.addEventListener(topic, /** @type {any} */ (listener), options);
 }
-
-expose(name, { sub });

src/core/pubsubhub.js

@@ -4,10 +4,12 @@
  * readonly properties:
  *  - version: returns version of ReSpec Script.
  *  - ready: returns a promise that settles when ReSpec finishes processing.
+ *  - worker: returns a promise that resolves to the ReSpec Web Worker.
  *
  */
 import { serialize } from "../core/exporter.js";
 import { sub } from "./pubsubhub.js";
+import { workerPromise } from "./worker.js";
 
 export const name = "core/respec-global";
 
@@ -41,6 +43,10 @@ class ReSpec {
     return this._respecDonePromise;
   }
 
+  get worker() {
+    return workerPromise;
+  }
+
   async toHTML() {
     return serialize("html", document);
   }

src/core/respec-global.js

@@ -9,7 +9,6 @@ export const name = "core/worker";
 
 // Opportunistically preload syntax highlighter, which is used by the worker
 import { createResourceHint } from "./utils.js";
-import { expose } from "./expose-modules.js";
 import { fetchBase } from "./text-loader.js";
 
 // Derive the highlight URL from the ReSpec bundle location. In the IIFE bundle,
@@ -77,8 +76,3 @@ async function createWorker() {
 }
 
 export const workerPromise = createWorker();
-
-expose(
-  name,
-  workerPromise.then(worker => ({ worker }))
-);

src/core/worker.js

@@ -50,10 +50,6 @@ interface Window {
     closeModal(owner?: Element): void;
     freshModal(title: string, content: Node, currentOwner: Element): void;
   };
-  require?: {
-    (deps: string[], callback: (...modules: any[]) => void): void;
-    modules: { [dep: string]: any };
-  };
   axe?: {
     run(context: Node, options: any): Promise<{ violations: AxeViolation[] }>;
   };
@@ -63,6 +59,7 @@ interface Document {
   respec: {
     readonly version: string;
     readonly ready: Promise<void>;
+    readonly worker: Promise<Worker>;
   };
 }
 

src/type-helper.d.ts

@@ -1,28 +1,19 @@
 "use strict";
 
-import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js";
+import {
+  flushIframes,
+  getExportedDoc,
+  makeRSDoc,
+  makeStandardOps,
+} from "../SpecHelper.js";
 
 describe("Core - exporter", () => {
   afterAll(flushIframes);
 
-  async function getExportedDoc(ops) {
-    const doc = await makeRSDoc(ops);
-    const dataURL = await new Promise(resolve => {
-      doc.defaultView.require(["core/exporter"], ({ rsDocToDataURL }) =>
-        resolve(rsDocToDataURL("text/html", doc))
-      );
-    });
-    const docString = decodeURIComponent(dataURL).replace(
-      "data:text/html;charset=utf-8,",
-      ""
-    );
-    return new DOMParser().parseFromString(docString, "text/html");
-  }
-
   it("removes .removeOnSave elements", async () => {
     const ops = makeStandardOps();
     ops.body = `<div class="removeOnSave" id="this-should-be-removed">this should be removed</div>`;
-    const doc = await getExportedDoc(ops);
+    const doc = await getExportedDoc(await makeRSDoc(ops));
 
     expect(doc.getElementById("this-should-be-removed")).toBeFalsy();
     expect(doc.querySelectorAll(".removeOnSave")).toHaveSize(0);
@@ -31,7 +22,7 @@ describe("Core - exporter", () => {
   it("removes all comments", async () => {
     const ops = makeStandardOps();
     ops.body = `<div><!-- remove -->PASS <span><!-- remove --></span></div>`;
-    const doc = await getExportedDoc(ops);
+    const doc = await getExportedDoc(await makeRSDoc(ops));
 
     const walker = document.createTreeWalker(doc.body, NodeFilter.SHOW_COMMENT);
     const comments = [];
@@ -59,7 +50,7 @@ describe("Core - exporter", () => {
       >
     `;
     const ops = makeStandardOps(null, body);
-    const doc = await getExportedDoc(ops);
+    const doc = await getExportedDoc(await makeRSDoc(ops));
 
     const anchor = doc.getElementById("ANCHOR");
     expect(anchor.hasAttribute("data-cite")).toBeFalse();
@@ -86,7 +77,7 @@ describe("Core - exporter", () => {
       <pre class="example js">
         function Foo(){};
       </pre>`;
-    const doc = await getExportedDoc(ops);
+    const doc = await getExportedDoc(await makeRSDoc(ops));
     const { lastElementChild } = doc.head;
     expect(lastElementChild.href).toBe(
       "https://www.w3.org/StyleSheets/TR/2021/W3C-ED"

tests/spec/core/exporter-spec.js

@@ -5,9 +5,7 @@
     <title>Highlight custom language test</title>
     <script class="remove">
       async function loadTestLang() {
-        const worker = await new Promise(resolve => {
-          require(["core/worker"], ({ worker }) => resolve(worker));
-        });
+        const worker = await document.respec.worker;
         const action = "highlight-load-lang";
         const langURL = new URL(
           "../../support-files/hljs-testlang.js",

tests/spec/core/highlight.html

@@ -47,6 +47,16 @@ describe("Core — Respec Global - document.respec", () => {
     expect(doc.respec.errors).toHaveSize(0);
   });
 
+  it("exposes a worker promise that resolves to a Worker", async () => {
+    const doc = await makeRSDoc(makeStandardOps());
+    const { worker } = doc.respec;
+    expect(worker).toBeDefined();
+    expect(typeof worker.then).toBe("function");
+    const resolved = await worker;
+    expect(resolved).toBeTruthy();
+    expect(typeof resolved.postMessage).toBe("function");
+  });
+
   it("returns exported html with toHTML()", async () => {
     const ops = makeStandardOps();
     const doc = await makeRSDoc(ops);

tests/spec/core/respec-global-spec.js

@@ -225,7 +225,7 @@ async function checkIfReSpec(page) {
  */
 async function generateHTML(page, timer, version, url) {
   try {
-    return await page.evaluate(evaluateHTML, version, timer);
+    return await page.evaluate(evaluateHTML, timer);
   } catch (err) {
     const msg = `\n😭  Sorry, there was an error generating the HTML. Please report this issue!\n${`${
       `Specification: ${url}\n` +
@@ -237,43 +237,24 @@ async function generateHTML(page, timer, version, url) {
 }
 
 /**
- * @param {ReSpecVersion} version
  * @param {ReturnType<typeof createTimer>} timer
  */
-async function evaluateHTML(version, timer) {
+async function evaluateHTML(timer) {
   await timeout(
     document.respec ? document.respec.ready : document.respecIsReady,
     timer.remaining
   );
 
-  const [major, minor] = version;
-  if (major < 20 || (major === 20 && minor < 10)) {
-    console.warn(
-      "👴🏽  Ye Olde ReSpec version detected! Please update to 20.10.0 or above. " +
-        `Your version: ${window.respecVersion}.`
+  if (!document.respec?.toHTML) {
+    throw new Error(
+      "document.respec.toHTML is not available. " +
+        "Please upgrade to a newer version of ReSpec, " +
+        "or use an older version of the ReSpec CLI."
     );
-    // Document references an older version of ReSpec that does not yet
-    // have the "core/exporter" module. Try with the old "ui/save-html"
-    // module.
-    const { exportDocument } = await new Promise((resolve, reject) => {
-      require(["ui/save-html"], resolve, err => {
-        reject(new Error(err.message));
-      });
-    });
-    return exportDocument("html", "text/html");
-  } else if (!document.respec || !document.respec.toHTML) {
-    const { rsDocToDataURL } = await new Promise((resolve, reject) => {
-      require(["core/exporter"], resolve, err => {
-        reject(new Error(err.message));
-      });
-    });
-    const dataURL = rsDocToDataURL("text/html");
-    const encodedString = dataURL.replace(/^data:\w+\/\w+;charset=utf-8,/, "");
-    return decodeURIComponent(encodedString);
-  } else {
-    return await document.respec.toHTML();
   }
 
+  return await document.respec.toHTML();
+
   function timeout(promise, ms) {
     return new Promise((resolve, reject) => {
       promise.then(resolve, reject);