single-file-core 1.5.56 → 1.5.58

package/core/helper.js

@@ -77,6 +77,7 @@ const EMPTY_RESOURCE = "data:,";
 const DEFAULT_REPLACED_CHARACTERS = ["~", "+", "?", "%", "*", ":", "|", "\"", "<", ">", "\\\\", "\x00-\x1f", "\x7F"];
 const DEFAULT_REPLACEMENT_CHARACTER = "_";
 const DEFAULT_REPLACEMENT_CHARACTERS = ["～", "＋", "？", "％", "＊", "：", "｜", "＂", "＜", "＞", "＼"];
+const NESTING_TRACK_ID_ATTRIBUTE_NAME = "data-sf-nesting-track-id";
 const addEventListener = (type, listener, options) => globalThis.addEventListener(type, listener, options);
 // eslint-disable-next-line no-unused-vars
 const dispatchEvent = event => { try { globalThis.dispatchEvent(event); } catch (error) {  /* ignored */ } };
@@ -87,6 +88,7 @@ const Blob = globalThis.Blob;
 const CustomEvent = globalThis.CustomEvent;
 const MutationObserver = globalThis.MutationObserver;
 const URL = globalThis.URL;
+const DOMParser = globalThis.DOMParser;
 
 export {
 	initUserScriptHandler,
@@ -103,6 +105,8 @@ export {
 	getContentSize,
 	digest,
 	getValidFilename,
+	parseDocContent,
+	fixInvalidNesting,
 	ON_BEFORE_CAPTURE_EVENT_NAME,
 	ON_AFTER_CAPTURE_EVENT_NAME,
 	WIN_ID_ATTRIBUTE_NAME,
@@ -130,7 +134,8 @@ export {
 	INFOBAR_TAGNAME,
 	WAIT_FOR_USERSCRIPT_PROPERTY_NAME,
 	MESSAGE_PREFIX,
-	NO_SCRIPT_PROPERTY_NAME
+	NO_SCRIPT_PROPERTY_NAME,
+	NESTING_TRACK_ID_ATTRIBUTE_NAME
 };
 
 function initUserScriptHandler() {
@@ -205,13 +210,7 @@ function preProcessDoc(doc, win, options) {
 	const invalidElements = new Map();
 	let elementsInfo;
 	if (win && doc.documentElement) {
-		doc.querySelectorAll("button button, a a").forEach(element => {
-			const placeHolderElement = doc.createElement("template");
-			placeHolderElement.setAttribute(INVALID_ELEMENT_ATTRIBUTE_NAME, "");
-			placeHolderElement.content.appendChild(element.cloneNode(true));
-			invalidElements.set(element, placeHolderElement);
-			element.replaceWith(placeHolderElement);
-		});
+		markInvalidNesting(doc);
 		elementsInfo = getElementsInfo(win, doc, doc.documentElement, options);
 		if (options.moveStylesInHead) {
 			doc.querySelectorAll("body style, body ~ style").forEach(element => {
@@ -260,6 +259,87 @@ function preProcessDoc(doc, win, options) {
 	};
 }
 
+function markInvalidNesting(doc) {
+	addTrackIds(doc.body);
+	const verificationDoc = parseDocContent(serialize(doc));
+	const markedMap = buildTrackIdMap(doc.body);
+	const normalizedMap = buildTrackIdMap(verificationDoc.body);
+	const trackIds = new Set();
+	Object.keys(markedMap).forEach(id => {
+		if (id in normalizedMap) {
+			const markedParent = markedMap[id].parentElement?.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME) || null;
+			const normalizedParent = normalizedMap[id]?.parentElement?.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME) || null;
+			if (markedParent !== normalizedParent) {
+				let current = markedMap[id];
+				while (current && current !== doc.body) {
+					const currentId = current.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
+					if (currentId) {
+						trackIds.add(currentId);
+					}
+					current = current.parentElement;
+				}
+			}
+		}
+	});
+	cleanupTrackIds(doc.body, trackIds);
+
+	function addTrackIds(element, index = 0, parentTrackId = "") {
+		const trackId = parentTrackId ? `${parentTrackId}.${index + 1}` : `${index + 1}`;
+		element.setAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME, trackId);
+		Array.from(element.children).forEach((child, indexChild) => addTrackIds(child, indexChild, trackId));
+	}
+
+	function buildTrackIdMap(element) {
+		const trackIds = {};
+		traverse(element);
+		return trackIds;
+
+		function traverse(element) {
+			if (element.getAttribute) {
+				const id = element.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
+				if (id) {
+					trackIds[id] = element;
+				}
+				Array.from(element.children).forEach(traverse);
+			}
+		}
+	}
+
+	function cleanupTrackIds(element, toKeep) {
+		const id = element.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
+		if (id && !toKeep.has(id)) {
+			element.removeAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
+		}
+		Array.from(element.children).forEach(child => cleanupTrackIds(child, toKeep));
+	}
+}
+
+function fixInvalidNesting(document, NESTING_TRACK_ID_ATTRIBUTE_NAME) {
+	const trackIds = {};
+	document.currentScript.remove();
+	buildTrackIdMap(document.body);
+	Object.keys(trackIds).forEach(id => {
+		const element = trackIds[id];
+		const idParts = id.split(".");
+		if (idParts.length > 1) {
+			const parentId = idParts.slice(0, -1).join(".");
+			const expectedParent = trackIds[parentId];
+			if (expectedParent && element.parentElement !== expectedParent) {
+				expectedParent.appendChild(element);
+			}
+		}
+	});
+	Object.keys(trackIds).forEach(id => trackIds[id].removeAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME));
+
+	function buildTrackIdMap(element) {
+		const id = element.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
+		if (id) {
+			trackIds[id] = element;
+		}
+		Array.from(element.children).forEach(buildTrackIdMap);
+	}
+}
+
 function getElementsInfo(win, doc, element, options, data = { usedFonts: new Map(), canvases: [], images: [], posters: [], videos: [], shadowRoots: [], markedElements: [] }, adoptedStyleSheetsCache = new Map(), ascendantHidden) {
 	if (element.childNodes) {
 		const elements = Array.from(element.childNodes).filter(node => (node instanceof win.HTMLElement) || (node instanceof win.SVGElement) || (node instanceof globalThis.HTMLElement) || (node instanceof globalThis.SVGElement));
@@ -746,4 +826,21 @@ function getValidFilename(filename, replacedCharacters = DEFAULT_REPLACED_CHARAC
 		.replace(/\.\//g, "." + replacementCharacter)
 		.replace(/\/\./g, "/" + replacementCharacter);
 	return filename;
+}
+
+function parseDocContent(content, baseURI) {
+	const doc = (new DOMParser()).parseFromString(content, "text/html");
+	if (!doc.head) {
+		doc.documentElement.insertBefore(doc.createElement("HEAD"), doc.body);
+	}
+	let baseElement = doc.querySelector("base");
+	if (!baseElement || !baseElement.getAttribute("href")) {
+		if (baseElement) {
+			baseElement.remove();
+		}
+		baseElement = doc.createElement("base");
+		baseElement.setAttribute("href", baseURI);
+		doc.head.insertBefore(baseElement, doc.head.firstChild);
+	}
+	return doc;
 }

package/core/index.js

@@ -582,6 +582,11 @@ class Processor {
 		if (this.options.displayStats) {
 			size = util.getContentSize(this.doc.documentElement.outerHTML);
 		}
+		if (this.doc.querySelector(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`)) {
+			const scriptElement = this.doc.createElement("script");
+			scriptElement.textContent = `(${util.getFixInvalidNestingSource()})(document, "${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}");`;
+			this.doc.body.appendChild(scriptElement);
+		}
 		const content = util.serialize(this.doc, this.options.compressHTML);
 		if (this.options.displayStats) {
 			const contentSize = util.getContentSize(content);
@@ -893,8 +898,10 @@ class Processor {
 		if (!this.options.saveFavicon) {
 			this.doc.querySelectorAll("link[rel*=\"icon\"]").forEach(element => element.remove());
 		}
-		this.doc.querySelectorAll("a[ping]").forEach(element => element.removeAttribute("ping"));
+		this.doc.querySelectorAll("a[ping], area[ping]").forEach(element => element.removeAttribute("ping"));
+		this.doc.querySelectorAll("a[attributionsrc], img[attributionsrc], script[attributionsrc]").forEach(element => element.removeAttribute("attributionsrc"));
 		this.doc.querySelectorAll("link[rel=import][href]").forEach(element => element.remove());
+		this.doc.querySelectorAll("link[rel=compression-dictionary]").forEach(element => element.remove());
 	}
 
 	replaceInvalidElements() {

package/core/lib/processor-helper-common.js

@@ -329,37 +329,17 @@ class ProcessorHelperCommon {
 	}
 
 	replacePseudoClassDefined(stylesheet) {
-		const removedSelectors = [];
-		if (stylesheet.children) {
-			for (let cssRule = stylesheet.children.head; cssRule; cssRule = cssRule.next) {
-				const ruleData = cssRule.data;
-				if (ruleData.type == "Rule" && ruleData.prelude && ruleData.prelude.children) {
-					for (let selector = ruleData.prelude.children.head; selector; selector = selector.next) {
-						replacePseudoDefinedSelector(selector, ruleData.prelude);
+		cssTree.walk(stylesheet, {
+			enter: function(node, item, list) {
+				if (node.type == "PseudoClassSelector" && node.name == "defined") {
+					if (item.prev == null || item.prev.data.type == "Combinator" || item.prev.data.type == "WhiteSpace") {
+						list.replace(item, cssTree.parse("*", { context: "selector" }).children.head);
+					} else {
+						list.remove(item);
 					}
 				}
 			}
-		}
-		if (removedSelectors.length) {
-			removedSelectors.forEach(({ parentSelector, selector }) => {
-				if (parentSelector.data.children.size == 0 || !selector.prev || selector.prev.data.type == "Combinator" || selector.prev.data.type == "WhiteSpace") {
-					parentSelector.data.children.replace(selector, cssTree.parse("*", { context: "selector" }).children.head);
-				} else {
-					parentSelector.data.children.remove(selector);
-				}
-			});
-		}
-
-		function replacePseudoDefinedSelector(selector, parentSelector) {
-			if (selector.data.children) {
-				for (let childSelector = selector.data.children.head; childSelector; childSelector = childSelector.next) {
-					replacePseudoDefinedSelector(childSelector, selector);
-				}
-			}
-			if (selector.data.type == "PseudoClassSelector" && selector.data.name == "defined") {
-				removedSelectors.push({ parentSelector, selector });
-			}
-		}
+		});
 	}
 
 	resolveStylesheetURLs(stylesheet, baseURI, workStylesheet) {

package/core/lib/processor-helper-inline.js

@@ -99,6 +99,11 @@ function getProcessorHelperClass(utilInstance) {
 						this.removeSingleLineCssComments(stylesheet);
 					}
 					this.replacePseudoClassDefined(stylesheet);
+					options.inlineStylesheets.forEach((content, index) => {
+						if (content === element.textContent) {
+							options.inlineStylesheets.set(index, this.generateStylesheetContent(stylesheet, options));
+						}
+					});
 					stylesheetInfo.stylesheet = stylesheet;
 				} else {
 					stylesheets.delete(element);

package/core/lib/processor-helper.js

@@ -102,7 +102,10 @@ function getProcessorHelperClass(utilInstance) {
 				linkElement.setAttribute("type", "text/css");
 				const name = "stylesheet_" + resources.stylesheets.size + ".css";
 				linkElement.setAttribute("href", name);
-				const content = options.inlineStylesheets.get(stylesheetRefIndex);
+				let content = options.inlineStylesheets.get(stylesheetRefIndex);
+				const stylesheet = cssTree.parse(content, { context: "stylesheet", parseCustomProperty: true });
+				this.replacePseudoClassDefined(stylesheet);
+				content = this.generateStylesheetContent(stylesheet, options);
 				resources.stylesheets.set(resources.stylesheets.size, { name, content });
 				linkElements.set(stylesheetRefIndex, linkElement);
 			});
@@ -247,9 +250,9 @@ function getProcessorHelperClass(utilInstance) {
 
 		async processFrame(frameElement, pageData, options, resources, frameWindowId, frameData) {
 			const name = "frames/" + resources.frames.size + "/";
-			let sandbox = "allow-popups allow-top-navigation-by-user-activation";
+			let sandbox = "allow-popups allow-top-navigation-by-user-activation allow-scripts";
 			if (pageData.content.match(NOSCRIPT_TAG_FOUND) || pageData.content.match(CANVAS_TAG_FOUND) || pageData.content.match(SCRIPT_TAG_FOUND) || options.saveRawPage) {
-				sandbox += " allow-scripts allow-modals allow-popups allow-downloads allow-pointer-lock allow-presentation";
+				sandbox += " allow-modals allow-popups allow-downloads allow-pointer-lock allow-presentation";
 			}
 			frameElement.setAttribute("sandbox", sandbox);
 			if (frameElement.tagName.toUpperCase() == "OBJECT") {

package/core/util.js

@@ -116,20 +116,7 @@ function getInstance(utilOptions) {
 			return helper.getValidFilename(filename, replacedCharacters, replacementCharacter, replacementCharacters);
 		},
 		parseDocContent(content, baseURI) {
-			const doc = (new DOMParser()).parseFromString(content, "text/html");
-			if (!doc.head) {
-				doc.documentElement.insertBefore(doc.createElement("HEAD"), doc.body);
-			}
-			let baseElement = doc.querySelector("base");
-			if (!baseElement || !baseElement.getAttribute("href")) {
-				if (baseElement) {
-					baseElement.remove();
-				}
-				baseElement = doc.createElement("base");
-				baseElement.setAttribute("href", baseURI);
-				doc.head.insertBefore(baseElement, doc.head.firstChild);
-			}
-			return doc;
+			return helper.parseDocContent(content, baseURI);
 		},
 		parseXMLContent(content) {
 			return (new DOMParser()).parseFromString(content, "text/xml");
@@ -142,6 +129,9 @@ function getInstance(utilOptions) {
 				return doc;
 			}
 		},
+		getFixInvalidNestingSource() {
+			return helper.fixInvalidNesting.toString().replace(/\s+/g, " ");
+		},
 		async digest(algo, text) {
 			return helper.digest(algo, text);
 		},
@@ -229,7 +219,8 @@ function getInstance(utilOptions) {
 		EMPTY_RESOURCE: helper.EMPTY_RESOURCE,
 		INFOBAR_TAGNAME: helper.INFOBAR_TAGNAME,
 		WAIT_FOR_USERSCRIPT_PROPERTY_NAME: helper.WAIT_FOR_USERSCRIPT_PROPERTY_NAME,
-		NO_SCRIPT_PROPERTY_NAME: helper.NO_SCRIPT_PROPERTY_NAME
+		NO_SCRIPT_PROPERTY_NAME: helper.NO_SCRIPT_PROPERTY_NAME,
+		NESTING_TRACK_ID_ATTRIBUTE_NAME: helper.NESTING_TRACK_ID_ATTRIBUTE_NAME
 	};
 
 	async function getContent(resourceURL, options) {

package/modules/css-rules-minifier.js

@@ -217,7 +217,7 @@ function minifyRule(ruleData, cssRule, stylesheets, processingContext, removedRu
 	}
 }
 
-function minifyImportRule(ruleData, cssRule, stylesheets, processingContext, removedRules, docContext) {
+function minifyImportRule(ruleData, _cssRule, stylesheets, processingContext, _removedRules, docContext) {
 	const urlNode = ruleData.prelude.children.head.data;
 	const topConditionalStack = urlNode.importedMediaText ? [{ name: "media", prelude: urlNode.importedMediaText }] : [];
 	if (urlNode.importedLayerName !== undefined) {
@@ -594,8 +594,8 @@ function compareDeclarations(declarationA, declarationB, docContext) {
 	}
 	if (declarationA.isInline && !declarationB.isInline) return 1;
 	if (!declarationA.isInline && declarationB.isInline) return -1;
-	let selectorDataA = declarationA.selector ? docContext.selectorData.get(declarationA.selector) : null;
-	let selectorDataB = declarationB.selector ? docContext.selectorData.get(declarationB.selector) : null;
+	const selectorDataA = declarationA.selector ? docContext.selectorData.get(declarationA.selector) : null;
+	const selectorDataB = declarationB.selector ? docContext.selectorData.get(declarationB.selector) : null;
 	if (selectorDataA && selectorDataB) {
 		const layerComparison = compareLayers(selectorDataA.layerStack, selectorDataB.layerStack, docContext);
 		if (layerComparison !== 0) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "single-file-core",
-  "version": "1.5.56",
+  "version": "1.5.58",
   "description": "SingleFile Core",
   "author": "Gildas Lormeau",
   "license": "AGPL-3.0-or-later",

package/processors/frame-tree/content/content-frame-tree.js

@@ -439,7 +439,7 @@ function getFrames(document) {
 	document.querySelectorAll(ALL_ELEMENTS_CSS_SELECTOR).forEach(element => {
 		const shadowRoot = helper.getShadowRoot(element);
 		if (shadowRoot) {
-			frames = frames.concat(...shadowRoot.querySelectorAll(FRAMES_CSS_SELECTOR));
+			frames = frames.concat(...getFrames(shadowRoot));
 		}
 	});
 	return frames;

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

@@ -52,12 +52,16 @@
 	const BOOTSTRAP_EVENT = "single-file-bootstrap";
 	const FONT_STYLE_PROPERTIES = {
 		family: "font-family",
-		style: "font-style",
-		weight: "font-weight",
+		ascentOverride: "ascent-override",
+		descentOverride: "descent-override",
+		display: "font-display",
+		featureSettings: "font-feature-settings",
+		lineGapOverride: "line-gap-override",
 		stretch: "font-stretch",
+		style: "font-style",
 		unicodeRange: "unicode-range",
-		variant: "font-variant",
-		featureSettings: "font-feature-settings"
+		variationSettings: "font-variation-settings",
+		weight: "font-weight"
 	};
 
 	const fetch = globalThis.fetch.bind(globalThis);