single-file-core 1.5.115 → 1.5.116

package/modules/css-fonts-minifier.js

@@ -41,7 +41,9 @@ const REGEXP_COMMA = /\s*,\s*/;
 const REGEXP_DASH = /-/;
 const REGEXP_QUESTION_MARK = /\?/g;
 const REGEXP_STARTS_U_PLUS = /^U\+/i;
-const REGEXP_CUSTOM_PROPERTY = /var\((--[^),]*)\)/g;
+const REGEXP_CUSTOM_PROPERTY = /var\(\s*(--[^\s,)]+)\s*(?:,[^)]*)?\)/g;
+const REGEXP_CUSTOM_PROPERTY_FAMILY = /^var\(\s*(--[^\s,)]+)\s*(?:,(.*))?\)$/;
+const REGEXP_CUSTOM_PROPERTY_NAME = /^--/;
 const VALID_FONT_STYLES = [/^normal$/, /^italic$/, /^oblique$/, /^oblique\s+/];
 // a family name kept when the "font" shorthand cannot be read: it resolves to nothing, so it
 // survives the substitution below and marks the fonts as undetermined instead of unused
@@ -54,9 +56,19 @@ export {
 function process(doc, stylesheets, styles, options) {
 	const stats = { rules: { processed: 0, discarded: 0 }, fonts: { processed: 0, discarded: 0 } };
 	const fontsInfo = { declared: [], used: [] };
+	const customProperties = new Map();
 	const workStyleElement = doc.createElement("style");
 	let docContent = "";
 	doc.body.appendChild(workStyleElement);
+	// the custom properties are collected first: a family or a "font" shorthand can be resolved
+	// with a property that a later stylesheet, or a style attribute, declares
+	stylesheets.forEach(stylesheetInfo => {
+		if (stylesheetInfo.stylesheet && stylesheetInfo.stylesheet.children) {
+			getCustomPropertiesInfo(stylesheetInfo.stylesheet.children, customProperties);
+		}
+	});
+	styles.forEach(declarations => getCustomProperties(declarations.children, customProperties));
+	options = Object.assign({}, options, { customProperties });
 	stylesheets.forEach(stylesheetInfo => {
 		if (stylesheetInfo.stylesheet) {
 			const cssRules = stylesheetInfo.stylesheet.children;
@@ -77,17 +89,8 @@ function process(doc, stylesheets, styles, options) {
 	});
 	workStyleElement.remove();
 	docContent += doc.body.innerText;
-	if (globalThis.getComputedStyle && options.doc) {
-		fontsInfo.used = fontsInfo.used.map(fontNames => fontNames.map(familyName => {
-			const matchedVar = familyName.match(/^var\((--.*)\)$/);
-			if (matchedVar && matchedVar[1]) {
-				const computedFamilyName = globalThis.getComputedStyle(options.doc.body).getPropertyValue(matchedVar[1]);
-				return (computedFamilyName && computedFamilyName.split(",").map(name => helper.normalizeFontFamily(name))) || familyName;
-			}
-			return familyName;
-		}));
-		fontsInfo.used = fontsInfo.used.map(fontNames => helper.flatten(fontNames));
-	}
+	fontsInfo.used = fontsInfo.used.map(fontNames => fontNames.map(familyName => resolveFamilyName(familyName, options)));
+	fontsInfo.used = fontsInfo.used.map(fontNames => helper.flatten(fontNames));
 	const variableFound = fontsInfo.used.find(fontNames => fontNames.find(fontName => fontName.match(/^var\(--/)));
 	let unusedFonts, filteredUsedFonts;
 	if (variableFound) {
@@ -141,6 +144,83 @@ function getFontsInfo(cssRules, fontsInfo, options) {
 	});
 }
 
+function getCustomPropertiesInfo(cssRules, customProperties) {
+	cssRules.forEach(ruleData => {
+		if (ruleData.type == "Atrule" && ruleData.name == "import" && ruleData.prelude && ruleData.prelude.children && ruleData.prelude.children.head.data.importedChildren) {
+			getCustomPropertiesInfo(ruleData.prelude.children.head.data.importedChildren, customProperties);
+		} else if (ruleData.type == "Atrule" && (ruleData.name == "media" || ruleData.name == "supports" || ruleData.name == "layer" || ruleData.name == "container") && ruleData.block && ruleData.block.children) {
+			getCustomPropertiesInfo(ruleData.block.children, customProperties);
+		} else if (ruleData.type == "Rule" && ruleData.block && ruleData.block.children) {
+			getCustomProperties(ruleData.block.children, customProperties);
+		}
+	});
+}
+
+function getCustomProperties(declarations, customProperties) {
+	if (declarations) {
+		declarations.forEach(declaration => {
+			if (declaration.property && declaration.property.match(REGEXP_CUSTOM_PROPERTY_NAME)) {
+				try {
+					const value = cssTree.generate(declaration.value).trim();
+					if (value) {
+						let values = customProperties.get(declaration.property);
+						if (!values) {
+							values = new Set();
+							customProperties.set(declaration.property, values);
+						}
+						values.add(value);
+					}
+					// eslint-disable-next-line no-unused-vars
+				} catch (error) {
+					// ignored
+				}
+			}
+		});
+	}
+}
+
+function getCustomPropertyValues(name, options) {
+	let values;
+	if (globalThis.getComputedStyle && options.doc) {
+		const computedValue = globalThis.getComputedStyle(options.doc.body).getPropertyValue(name);
+		if (computedValue && computedValue.trim()) {
+			values = [computedValue];
+		}
+	}
+	if (!values) {
+		// the property is not inherited by the body: it is declared on a descendant, or in a
+		// media query that does not apply, so the value seen by the element using it cannot be
+		// determined here. Every value declared for it in the document is taken as a candidate,
+		// which still discards the fonts named by none of them
+		const declaredValues = options.customProperties && options.customProperties.get(name);
+		if (declaredValues && declaredValues.size) {
+			values = Array.from(declaredValues);
+		}
+	}
+	return values;
+}
+
+function resolveFamilyName(familyName, options) {
+	const matchedVar = familyName.match(REGEXP_CUSTOM_PROPERTY_FAMILY);
+	if (matchedVar) {
+		const fallback = matchedVar[2];
+		// a var() nested in the fallback cannot be split on its commas, so the family is left
+		// undetermined rather than read as a list of broken names
+		if (!fallback || !fallback.includes("var(")) {
+			const values = getCustomPropertyValues(matchedVar[1], options);
+			if (values) {
+				const families = helper.flatten(values.map(value => splitFamilyNames(value)));
+				return fallback ? families.concat(splitFamilyNames(fallback)) : families;
+			}
+		}
+	}
+	return familyName;
+}
+
+function splitFamilyNames(value) {
+	return value.split(",").map(familyName => normalizeFamilyName(familyName)).filter(familyName => familyName);
+}
+
 function filterUnusedFonts(cssRules, declaredFonts, unusedFonts, filteredUsedFonts, docChars) {
 	const removedRules = [];
 	for (let cssRule = cssRules.head; cssRule; cssRule = cssRule.next) {
@@ -266,7 +346,7 @@ function getFontFamilyNames(declarations, options) {
 		} else {
 			fontFamilyName = cssTree.generate(fontFamilyName.data.value);
 			if (fontFamilyName) {
-				fontFamilyNames.push(helper.normalizeFontFamily(fontFamilyName));
+				fontFamilyNames.push(normalizeFamilyName(fontFamilyName));
 			}
 		}
 	}
@@ -280,7 +360,7 @@ function getFontFamilyNames(declarations, options) {
 				value = cssTree.parse(resolvedFontValue, { context: "value" });
 			}
 			const parsedFont = fontPropertyParser.parse(value);
-			parsedFont.family.forEach(familyName => fontFamilyNames.push(helper.normalizeFontFamily(familyName)));
+			parsedFont.family.forEach(familyName => fontFamilyNames.push(normalizeFamilyName(familyName)));
 			// eslint-disable-next-line no-unused-vars
 		} catch (error) {
 			// the shorthand is unreadable, and dropping it here would count the fonts it names as
@@ -294,12 +374,17 @@ function getFontFamilyNames(declarations, options) {
 }
 
 function resolveCustomProperties(value, options) {
-	if (globalThis.getComputedStyle && options.doc) {
-		const computedStyle = globalThis.getComputedStyle(options.doc.body);
-		return value.replace(REGEXP_CUSTOM_PROPERTY, (property, name) => computedStyle.getPropertyValue(name) || property);
-	} else {
-		return value;
-	}
+	return value.replace(REGEXP_CUSTOM_PROPERTY, (property, name) => {
+		const values = getCustomPropertyValues(name, options);
+		// the shorthand is parsed as a whole, so it can only be substituted with a single value:
+		// with several candidates the families it names stay undetermined
+		return values && values.length == 1 ? values[0] : property;
+	});
+}
+
+function normalizeFamilyName(familyName = "") {
+	// custom property names are case-sensitive, unlike family names
+	return familyName.match(REGEXP_CUSTOM_PROPERTY_FAMILY) ? familyName.trim() : helper.normalizeFontFamily(familyName);
 }
 
 function parseFamilyNames(fontFamilyNameTokenData, fontFamilyNames) {
@@ -307,16 +392,19 @@ function parseFamilyNames(fontFamilyNameTokenData, fontFamilyNames) {
 	while (nextToken) {
 		if (nextToken.data.type == "Identifier") {
 			let familyName = nextToken.data.name;
+			// an unquoted family name is a sequence of identifiers, and the walk has to resume
+			// after the last of them: resuming after the first pushes every word but that one
+			// again as a family of its own, so "Foo Bar" also claims a font-face named "Bar"
 			let nextIdentifierToken = nextToken.next;
-			while (nextIdentifierToken && nextIdentifierToken.data.type != "Operator" && nextIdentifierToken.data.value != ",") {
+			while (nextIdentifierToken && nextIdentifierToken.data.type == "Identifier") {
 				familyName += " " + nextIdentifierToken.data.name;
 				nextIdentifierToken = nextIdentifierToken.next;
 			}
 			fontFamilyNames.push(helper.normalizeFontFamily(familyName));
-			nextToken = nextToken.next;
+			nextToken = nextIdentifierToken;
 		} else if (nextToken.data.type == "Function" && nextToken.data.name == "var" && nextToken.data.children) {
 			const varName = nextToken.data.children.head.data.name;
-			fontFamilyNames.push(helper.normalizeFontFamily("var(" + varName + ")"));
+			fontFamilyNames.push("var(" + varName + ")");
 			let nextValueToken = nextToken.data.children.head.next;
 			while (nextValueToken && nextValueToken.data.type == "Operator" && nextValueToken.data.value == ",") {
 				nextValueToken = nextValueToken.next;
@@ -326,7 +414,9 @@ function parseFamilyNames(fontFamilyNameTokenData, fontFamilyNames) {
 				if (fallbackToken.data.children) {
 					parseFamilyNames(fallbackToken.data, fontFamilyNames);
 				} else {
-					fontFamilyNames.push(helper.normalizeFontFamily(fallbackToken.data.value));
+					// the fallback of a var() is parsed as a single raw token, so it still has to
+					// be split into the list of families it may hold
+					splitFamilyNames(String(fallbackToken.data.value)).forEach(familyName => fontFamilyNames.push(familyName));
 				}
 			}
 			nextToken = nextToken.next;

package/modules/css-rules-minifier.js

@@ -51,6 +51,7 @@ const SELECTOR_LIST_CONTEXT = "selectorList";
 const STYLESHEET_CONTEXT = "stylesheet";
 const SELECTOR_CONTEXT = "selector";
 const DECLARATION_LIST_CONTEXT = "declarationList";
+const UNKNOWN_PROPERTY_ERROR_NAME = "SyntaxReferenceError";
 const PARSE_CSS_ERROR_MESSAGE = "Failed to parse CSS";
 const QSA_ERROR_MESSAGE = "Failed to match selector";
 const PRELUDE_SEPARATOR = ",";
@@ -69,9 +70,15 @@ const INVALID_CSS_ESCAPE_TEST = /\\(?![0-9a-fA-F]{1,6}\s|[^0-9a-zA-Z])/;
 const ANONYMOUS_LAYER_PLACEHOLDER = "\u0000";
 
 export {
-	process
+	process,
+	isUnsupportedPropertyValue
 };
 
+function isUnsupportedPropertyValue(property, value) {
+	const match = cssTree.lexer.matchProperty(property, value);
+	return Boolean(!match.matched && match.error && match.error.name !== UNKNOWN_PROPERTY_ERROR_NAME);
+}
+
 function process(doc, stylesheets) {
 	const docContext = {
 		doc,
@@ -493,7 +500,7 @@ function collectDeclarationItemsForElement(element, docContext) {
 				isInvalidValue = value.children.head.data.name.startsWith(VENDOR_PREFIX) || INVALID_CSS_ESCAPE_TEST.test(value.children.head.data.name);
 			} if (!property.startsWith(VENDOR_PREFIX) && value.children.head.data.value) {
 				try {
-					isInvalidValue = !cssTree.lexer.matchProperty(property, value).matched;
+					isInvalidValue = isUnsupportedPropertyValue(property, value);
 				} catch {
 					// ignored
 				}

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "single-file-core",
-  "version": "1.5.115",
+  "version": "1.5.116",
   "description": "SingleFile Core",
   "author": "Gildas Lormeau",
   "license": "AGPL-3.0-or-later",
   "scripts": {
-    "test": "deno run --allow-read test/sfz-harness/format-rules.js && deno run --allow-read test/sfz-harness/stored-trigger.js && deno run --allow-read test/sfz-harness/check-determinism.js && deno run --allow-read test/sfz-harness/option-wiring.js",
+    "test": "deno run --allow-read test/sfz-harness/format-rules.js && deno run --allow-read test/sfz-harness/stored-trigger.js && deno run --allow-read test/sfz-harness/check-determinism.js && deno run --allow-read test/sfz-harness/option-wiring.js && deno run --allow-read test/sfz-harness/css-property-filter.js && deno run --allow-read test/sfz-harness/adopted-stylesheets-hook.js && deno run --allow-read test/sfz-harness/css-fonts-minifier.js && deno run --allow-read test/sfz-harness/inlined-functions.js",
     "bump-patch": "npm version patch --no-git-tag-version && npm run bump-commit",
     "bump-minor": "npm version minor --no-git-tag-version && npm run bump-commit",
     "bump-major": "npm version major --no-git-tag-version && npm run bump-commit",

package/processors/compression/compression-display.js

@@ -23,13 +23,34 @@
 
 /* global DOMParser, setTimeout */
 
-import { getDoctypeString } from "./../../core/lib/doctype.js";
-
 export {
 	display
 };
 
+// the functions below are serialized with toString() and pasted into the page the archive
+// generates, where module scope does not exist: everything they call must be declared inside
+// them. An import would survive bundling and then be an undefined free variable at runtime
 async function display(document, docContent, { disableFramePointerEvents, inPlace } = {}) {
+	function getDoctypeString(doc) {
+		const docType = doc.doctype;
+		let docTypeString = "";
+		if (docType) {
+			docTypeString = "<!DOCTYPE " + docType.nodeName;
+			if (docType.publicId) {
+				docTypeString += " PUBLIC \"" + docType.publicId + "\"";
+				if (docType.systemId) {
+					docTypeString += " \"" + docType.systemId + "\"";
+				}
+			} else if (docType.systemId) {
+				docTypeString += " SYSTEM \"" + docType.systemId + "\"";
+			}
+			if (docType.internalSubset) {
+				docTypeString += " [" + docType.internalSubset + "]";
+			}
+			docTypeString += ">";
+		}
+		return docTypeString;
+	}
 	docContent = docContent.replace(/<noscript/gi, "<template disabled-noscript");
 	docContent = docContent.replace(/<\/noscript/gi, "</template");
 	const doc = (new DOMParser()).parseFromString(docContent, "text/html");

package/processors/compression/compression.js

@@ -253,7 +253,10 @@ async function createArchive(pageData, options, script, writeEntries, lastModDat
 		if (!options.extractDataFromPageTags || options.extractDataFromPageTags[0] != "<plaintext>") {
 			const textContent = TEXT_DECODER.decode(data.subarray(startOffset));
 			if (options.extractDataFromPageTags) {
-				const tagIndex = EXTRA_DATA_TAGS.indexOf(options.extractDataFromPageTags);
+				// the rung is matched on its start tag, not on the identity of the array holding it:
+				// the option is set from EXTRA_DATA_TAGS internally, but a caller passing an equal
+				// pair of its own would otherwise index the regexps with -1
+				const tagIndex = getExtraDataTagIndex(options.extractDataFromPageTags);
 				const regExpsTag = EXTRA_DATA_REGEXPS[tagIndex];
 				if (textContent.match(regExpsTag[0]) || textContent.match(regExpsTag[1])) {
 					return findExtraDataTags(textContent, pageData, options, script, writeEntries, lastModDate, tagIndex + 1);
@@ -651,6 +654,14 @@ function getPageTitle(pageData) {
 	}).join("");
 }
 
+function getExtraDataTagIndex(extractDataFromPageTags) {
+	const tagIndex = EXTRA_DATA_TAGS.findIndex(([startTag]) => startTag == extractDataFromPageTags[0]);
+	if (tagIndex == -1) {
+		throw new Error("Unknown data tags: " + extractDataFromPageTags[0]);
+	}
+	return tagIndex;
+}
+
 function findExtraDataTags(textContent, pageData, options, script, writeEntries, lastModDate, indexExtractDataFromPageTags = 0) {
 	const regExpsTag = EXTRA_DATA_REGEXPS[indexExtractDataFromPageTags];
 	const plaintextTag = EXTRA_DATA_TAGS[indexExtractDataFromPageTags][0] == "<plaintext>";

package/processors/hooks/content/content-hooks-frames-web.js

@@ -83,6 +83,7 @@
 
 	let dispatchScrollEvent;
 	let adoptedStylesheetsData = new WeakMap();
+	const shadowRootsData = new WeakMap();
 
 	init();
 	new MutationObserver(init).observe(document, { childList: true });
@@ -534,14 +535,28 @@
 	};
 	CSSStyleSheet.prototype.deleteRule.toString = function () { return "function deleteRule() { [native code] }"; };
 
+	// the listener below is reached through the host element, and a closed shadow root is
+	// not reachable from it, so the roots are recorded as they are created
+	const originalAttachShadow = Element.prototype.attachShadow;
+	Element.prototype.attachShadow = function (init) {
+		try {
+			const shadowRoot = originalAttachShadow.apply(this, [init]);
+			shadowRootsData.set(this, shadowRoot);
+			return shadowRoot;
+		} catch (error) {
+			error.stack = error.message + "\n" + "    \n" + error.stack.trim().split("\n").slice(-1).join("\n");
+			throw error;
+		}
+	};
+	Element.prototype.attachShadow.toString = function () { return "function attachShadow() { [native code] }"; };
+	setFunctionName(Element.prototype.attachShadow, "attachShadow");
+
 	function getAdoptedStylesheetsListener(event) {
-		const shadowRoot = event.target.shadowRoot;
+		const shadowRoot = event.target.shadowRoot || shadowRootsData.get(event.target);
 		event.stopPropagation();
 		if (shadowRoot) {
 			shadowRoot.addEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, getAdoptedStylesheetsListener, { capture: true });
-			shadowRoot.addEventListener(UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, () => {
-				shadowRoot.removeEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, getAdoptedStylesheetsListener);
-			}, { once: true });
+			shadowRoot.addEventListener(UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, unregisterGetAdoptedStylesheetsListener, { once: true });
 			const adoptedStyleSheets = Array.from(shadowRoot.adoptedStyleSheets).map(stylesheet => {
 				if (adoptedStylesheetsData.has(stylesheet)) {
 					return adoptedStylesheetsData.get(stylesheet);
@@ -555,6 +570,14 @@
 		}
 	}
 
+	// the root is read from the event rather than captured, so one function serves every shadow root:
+	// a closure per root would be a distinct callback each time and would accumulate instead of being
+	// the no-op that re-adding an already registered listener is. The capture flag has to be repeated
+	// here because it is part of what identifies the listener to remove
+	function unregisterGetAdoptedStylesheetsListener(event) {
+		event.currentTarget.removeEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, getAdoptedStylesheetsListener, { capture: true });
+	}
+
 	async function getDetailObject(fontFamily, src, descriptors) {
 		const detail = {};
 		detail["font-family"] = fontFamily;

package/test/sfz-harness/README.md

@@ -18,7 +18,7 @@ deno run --allow-read test/sfz-harness/format-rules.js
 
 ## The suites
 
-CI runs these three. Each prints one `PASS`/`FAIL` line per check and exits non-zero if
+CI runs these. Each prints one `PASS`/`FAIL` line per check and exits non-zero if
 any check failed.
 
 | Script | What it covers |
@@ -26,7 +26,10 @@ any check failed.
 | `format-rules.js` | The rules of the format: charset round trip, the wrapper-tag ladder and its selection tests, the identifier, appended-data placement and declaration, password scope, the PDF and PNG faces. |
 | `stored-trigger.js` | That a stored (uncompressed) entry whose bytes contain a rung's pattern moves the writer to the right rung. |
 | `check-determinism.js` | That the same inputs produce the same bytes, and that the levers which should change the output do. |
-| `option-wiring.js` | That every option `compression.js` reads is either declared as a caller option or classified as internal, and that `single-file.js` still builds its argument from that declaration. Guards the layer the other three suites sit below. |
+| `option-wiring.js` | That every option `compression.js` reads is either declared as a caller option or classified as internal, and that `single-file.js` still builds its argument from that declaration. Guards the layer the other suites sit below. |
+| `css-property-filter.js` | That the declaration filter keeps a property css-tree's dictionary does not know (`stop-color`, `flood-opacity`, anything newer than the pinned build) and still drops a genuinely invalid value. |
+| `adopted-stylesheets-hook.js` | That the page-world hook answers the adopted-stylesheets request for a CLOSED shadow root, which its host does not expose. |
+| `css-fonts-minifier.js` | That `removeUnusedFonts` reads the font families it prunes on correctly: a `var()` family resolved from the values the document declares and not only from the ones the body inherits, every font kept when the value is genuinely undetermined, and a multi-word family name that does not also claim a font named after its own tail. |
 
 ## The tools
 

package/test/sfz-harness/adopted-stylesheets-hook.js

@@ -0,0 +1,240 @@
+/*
+ * Copyright 2010-2026 Gildas Lormeau
+ * contact : gildas.lormeau <at> gmail.com
+ *
+ * This file is part of SingleFile.
+ *
+ *   The code in this file is free software: you can redistribute it and/or
+ *   modify it under the terms of the GNU Affero General Public License
+ *   (GNU AGPL) as published by the Free Software Foundation, either version 3
+ *   of the License, or (at your option) any later version.
+ *
+ *   The code in this file is distributed in the hope that it will be useful,
+ *   but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero
+ *   General Public License for more details.
+ *
+ *   As additional permission under GNU AGPL version 3 section 7, you may
+ *   distribute UNMODIFIED VERSIONS OF THIS file without the copy of the GNU
+ *   AGPL normally required by section 4, provided you include this license
+ *   notice and a URL through which recipients can access the Corresponding
+ *   Source.
+ */
+
+// A shadow root's constructed stylesheets cannot be read from the extension's own
+// world, so the page-world hook reads them and answers a request event. It used to
+// resolve the root with `event.target.shadowRoot`, which is null for a CLOSED root,
+// and then answered nothing at all. The extension still captured the root's content,
+// because it reaches closed roots through openOrClosedShadowRoot, so a closed root
+// came back in the saved page with its markup intact and its styles gone, with no
+// error anywhere. Measured on 2026-08-30 in Firefox and in Chrome, and again after
+// the fix, with tmp/closed-shadow-root-probe.html.
+//
+// The hook now records every root as it is attached and falls back to that record.
+// This test drives the hook's own listener over a stub of the one browser rule the
+// bug turns on: attachShadow returns the root to its caller either way, and leaves
+// host.shadowRoot null when the mode is closed.
+
+const REQUEST_EVENT = "single-file-request-get-adopted-stylesheets";
+const RESPONSE_EVENT = "single-file-response-get-adopted-stylesheets";
+const UNREGISTER_EVENT = "single-file-unregister-request-get-adopted-stylesheets";
+const HOOK_PATH = new URL("../../processors/hooks/content/content-hooks-frames-web.js", import.meta.url);
+
+let failures = 0;
+
+const documentListeners = new Map();
+installStubs();
+const originalAttachShadow = globalThis.Element.prototype.attachShadow;
+new Function(await Deno.readTextFile(HOOK_PATH))();
+const listener = documentListeners.get(REQUEST_EVENT);
+
+check("the hook registers a listener for the request event", Boolean(listener));
+check("the hook patches attachShadow", globalThis.Element.prototype.attachShadow !== originalAttachShadow);
+check("the patched attachShadow still looks native",
+	globalThis.Element.prototype.attachShadow.toString() === "function attachShadow() { [native code] }" &&
+	globalThis.Element.prototype.attachShadow.name === "attachShadow");
+
+// an open root: the host exposes it, which is the path that always worked
+const openHost = new StubElement();
+const openRoot = openHost.attachShadow({ mode: "open" });
+adopt(openRoot, ".open { color: red }");
+check("attachShadow returns the root for an open mode", openRoot instanceof StubShadowRoot);
+check("an open root answers with its stylesheets",
+	sameStrings(request(openHost, openRoot), [".open { color: red }"]));
+
+// a closed root: the host exposes nothing, so only the record can resolve it
+const closedHost = new StubElement();
+const closedRoot = closedHost.attachShadow({ mode: "closed" });
+adopt(closedRoot, ".closed { color: blue }");
+check("a closed root is hidden from its host", closedHost.shadowRoot === null);
+check("attachShadow returns the root for a closed mode", closedRoot instanceof StubShadowRoot);
+check("a closed root answers with its stylesheets",
+	sameStrings(request(closedHost, closedRoot), [".closed { color: blue }"]));
+
+// the same, for a sheet the page never passed through replaceSync, so that the
+// answer comes from cssRules rather than from the recorded text
+const rulesHost = new StubElement();
+const rulesRoot = rulesHost.attachShadow({ mode: "closed" });
+rulesRoot.adoptedStyleSheets = [{ cssRules: [{ cssText: ".rules { color: green }" }] }];
+check("a closed root answers from cssRules when the text was not recorded",
+	sameStrings(request(rulesHost, rulesRoot), [".rules { color: green }"]));
+
+// an empty root still registers the hook's listener on itself, which is what lets a
+// NESTED host inside it be reached later; only the answer is withheld
+const emptyHost = new StubElement();
+const emptyRoot = emptyHost.attachShadow({ mode: "closed" });
+check("an empty root answers nothing", request(emptyHost, emptyRoot) === undefined);
+check("an empty root is still listened to for nested hosts", emptyRoot.listenerCount(REQUEST_EVENT) > 0);
+
+// a target that is neither a host nor a recorded root must not throw
+check("an unrelated target is ignored", request(new StubElement(), new StubShadowRoot()) === undefined);
+
+// the cleanup the hook installs on each root it answers for. Both halves of it were dead:
+// the unregister handler was a fresh closure per handshake, so it was never the no-op that
+// re-adding a registered listener is and one was left behind per root per save, and it
+// removed the request listener without the capture flag it had been added with, which
+// matches nothing at all
+const repeatHost = new StubElement();
+const repeatRoot = repeatHost.attachShadow({ mode: "open" });
+adopt(repeatRoot, ".repeat { color: teal }");
+request(repeatHost, repeatRoot);
+const unregisterAfterFirst = repeatRoot.listenerCount(UNREGISTER_EVENT);
+request(repeatHost, repeatRoot);
+request(repeatHost, repeatRoot);
+check("one handshake installs one unregister listener", unregisterAfterFirst === 1);
+check("repeated handshakes do not accumulate unregister listeners",
+	repeatRoot.listenerCount(UNREGISTER_EVENT) === 1);
+check("the root is listened to for requests until it is unregistered",
+	repeatRoot.listenerCount(REQUEST_EVENT) === 1);
+repeatRoot.dispatchEvent(new globalThis.CustomEvent(UNREGISTER_EVENT, { bubbles: true }));
+check("unregistering removes the request listener the hook added with capture",
+	repeatRoot.listenerCount(REQUEST_EVENT) === 0);
+check("the unregister listener removes itself once it has fired",
+	repeatRoot.listenerCount(UNREGISTER_EVENT) === 0);
+
+console.log(failures ? `\n${failures} check(s) FAILED` : "\nall checks passed");
+Deno.exit(failures ? 1 : 0);
+
+function request(target, listeningRoot) {
+	let answer;
+	const responseListener = event => answer = event.detail.adoptedStyleSheets;
+	listeningRoot.addEventListener(RESPONSE_EVENT, responseListener);
+	listener({ target, stopPropagation() { } });
+	listeningRoot.removeEventListener(RESPONSE_EVENT, responseListener);
+	return answer;
+}
+
+function adopt(root, text) {
+	const sheet = new globalThis.CSSStyleSheet();
+	sheet.replaceSync(text);
+	root.adoptedStyleSheets = [sheet];
+}
+
+function sameStrings(value, expected) {
+	return Array.isArray(value) && value.length === expected.length && value.every((item, index) => item === expected[index]);
+}
+
+function check(label, condition) {
+	if (!condition) {
+		failures++;
+	}
+	console.log((condition ? "PASS" : "FAIL") + " " + label);
+}
+
+// the stub below models only what the hook touches while it installs itself and
+// while it answers one request; it is deliberately not a DOM
+function StubShadowRoot() {
+	this.adoptedStyleSheets = [];
+	this.listeners = new Map();
+}
+
+function StubElement() {
+	this.shadowRoot = null;
+	this.listeners = new Map();
+}
+
+function installStubs() {
+	// a listener is identified by type, callback AND capture: adding one that is already
+	// registered is a no-op, and removing one with a different capture flag matches nothing.
+	// The stub has to model both, because those are the two rules the cleanup code got wrong
+	const listenerMethods = {
+		addEventListener(type, listener, options) {
+			const capture = Boolean(options && options.capture);
+			if (!this.listeners.has(type)) {
+				this.listeners.set(type, []);
+			}
+			const listeners = this.listeners.get(type);
+			if (!listeners.some(entry => entry.listener === listener && entry.capture === capture)) {
+				listeners.push({ listener, capture, once: Boolean(options && options.once) });
+			}
+		},
+		removeEventListener(type, listener, options) {
+			const capture = Boolean(options && options.capture);
+			const listeners = this.listeners.get(type) || [];
+			const index = listeners.findIndex(entry => entry.listener === listener && entry.capture === capture);
+			if (index !== -1) {
+				listeners.splice(index, 1);
+			}
+		},
+		dispatchEvent(event) {
+			event.currentTarget = this;
+			(this.listeners.get(event.type) || []).slice().forEach(entry => {
+				if (entry.once) {
+					this.removeEventListener(event.type, entry.listener, { capture: entry.capture });
+				}
+				entry.listener(event);
+			});
+			event.currentTarget = null;
+			return true;
+		},
+		listenerCount(type) {
+			return (this.listeners.get(type) || []).length;
+		}
+	};
+	Object.assign(StubShadowRoot.prototype, listenerMethods);
+	Object.assign(StubElement.prototype, listenerMethods);
+
+	// the rule the bug turns on: the caller gets the root whatever the mode, while the
+	// host exposes it only when the mode is open
+	StubElement.prototype.attachShadow = function (init) {
+		const shadowRoot = new StubShadowRoot();
+		shadowRoot.host = this;
+		this.shadowRoot = init && init.mode === "closed" ? null : shadowRoot;
+		return shadowRoot;
+	};
+
+	const recordedText = new WeakMap();
+	class StubCSSStyleSheet {
+		replaceSync(text) {
+			recordedText.set(this, text);
+		}
+		get cssRules() {
+			return [{ cssText: recordedText.get(this) }];
+		}
+	}
+
+	globalThis.Element = StubElement;
+	globalThis.CSSStyleSheet = StubCSSStyleSheet;
+	globalThis.CustomEvent = class CustomEvent {
+		constructor(type, init = {}) {
+			this.type = type;
+			this.detail = init.detail;
+			this.bubbles = Boolean(init.bubbles);
+		}
+	};
+	globalThis.Event = class Event { constructor(type) { this.type = type; } };
+	globalThis.UIEvent = globalThis.Event;
+	globalThis.screen = { width: 0, height: 0 };
+	globalThis.MutationObserver = class MutationObserver { observe() { } };
+	globalThis.fetch = () => Promise.reject(new Error("the hook test makes no request"));
+	globalThis.document = {
+		addEventListener(type, listener) {
+			documentListeners.set(type, listener);
+		},
+		removeEventListener() { },
+		dispatchEvent() { return true; },
+		querySelectorAll: () => [],
+		documentElement: {},
+		fonts: { add() { }, delete() { }, clear() { }, forEach() { } }
+	};
+}