diff --git a/builds/respec-worker.js b/builds/respec-worker.js index 0c278db06f..28c9db8cea 100644 --- a/builds/respec-worker.js +++ b/builds/respec-worker.js @@ -1,4 +1,4 @@ -// ReSpec Worker +// ReSpec Worker v1.0.0 // hljs is either inlined by core/worker.js (preferred) or loaded below via // importScripts as a fallback when the inline fetch was not possible. if (typeof self.hljs === "undefined" && self.RESPEC_HIGHLIGHT_URL) { @@ -9,16 +9,44 @@ if (typeof self.hljs === "undefined" && self.RESPEC_HIGHLIGHT_URL) { } } -self.addEventListener("message", ({ data }) => { - if (data.action !== "highlight") return; - const { code } = data; - const langs = data.languages?.length ? data.languages : undefined; - try { - const { value, language } = self.hljs.highlightAuto(code, langs); - Object.assign(data, { value, language }); - } catch (err) { - console.error("Could not transform some code?", err); - Object.assign(data, { value: code, language: "" }); +self.addEventListener("message", ({ data: originalData }) => { + const data = Object.assign({}, originalData); + switch (data.action) { + case "highlight-load-lang": { + const { langScript, propName, lang } = data; + try { + if (!langScript) { + throw new Error(`No script content provided for language "${lang}"`); + } + // importScripts() from blob workers is blocked for cross-origin URLs + // (blob worker origin is "null"). Create a same-origin blob URL from + // the pre-fetched script content to load the language safely. + const blob = new Blob([langScript], { type: "application/javascript" }); + const objectURL = URL.createObjectURL(blob); + try { + importScripts(objectURL); + } finally { + URL.revokeObjectURL(objectURL); + } + self.hljs.registerLanguage(lang, self[propName]); + } catch (err) { + console.error("Failed to load or register language", lang, err); + } + break; + } + case "highlight": { + const { code } = data; + const langs = data.languages.length ? data.languages : undefined; + try { + const { value, language } = self.hljs.highlightAuto(code, langs); + Object.assign(data, { value, language }); + } catch (err) { + console.error("Could not transform some code?", err); + // Post back the original code + Object.assign(data, { value: code, language: "" }); + } + break; + } } self.postMessage(data); }); diff --git a/src/styles/respec.css.js b/src/styles/respec.css.js index 09ac3b78c1..52dc162eb8 100644 --- a/src/styles/respec.css.js +++ b/src/styles/respec.css.js @@ -138,6 +138,7 @@ aside.example .marker > a.self-link { .header-wrapper { display: flex; align-items: baseline; + width: 100%; } :is(h2, h3, h4, h5, h6):not(#toc > h2, #abstract > h2, #sotd > h2, .head > h2):has(+ a.self-link) { diff --git a/tests/spec/core/style-spec.js b/tests/spec/core/style-spec.js index 06048ac159..004f6502b0 100644 --- a/tests/spec/core/style-spec.js +++ b/tests/spec/core/style-spec.js @@ -1,4 +1,5 @@ import { flushIframes, makeRSDoc, makeStandardOps } from "../SpecHelper.js"; +import respecCss from "../../../src/styles/respec.css.js"; describe("Core — Style", () => { afterAll(flushIframes); @@ -7,4 +8,10 @@ describe("Core — Style", () => { const style = doc.getElementById("respec-mainstyle"); expect(style).toBeTruthy(); }); + + it("makes header wrapper full width", () => { + expect(respecCss).toMatch( + /\.header-wrapper\s*\{[^}]*\bwidth:\s*100%\s*;[^}]*\}/ + ); + }); });