single-file-core 1.6.12 → 1.6.14

package/core/helper.js

@@ -601,7 +601,7 @@ function fixInvalidNesting(document, NESTING_TRACK_ID_ATTRIBUTE_NAME, preventCle
 			const id = element.getAttribute(NESTING_TRACK_ID_ATTRIBUTE_NAME);
 			const originalElement = trackIds[id];
 			if (originalElement != element) {
-				if (!preventCleanup) {
+				if (!preventCleanup || options.mergeCopies) {
 					if (originalElement.contains(element)) {
 						element.replaceWith(...element.childNodes);
 					} else {

package/core/index.js

@@ -503,8 +503,7 @@ class Processor {
 		this.doc = util.parseDocContent(pageContent, this.baseURI);
 		util.fixInvalidNesting(this.doc, true, { recreateOnly: true });
 		removeInsertedParagraphs(this.doc);
-		this.nestingPositions = getNestingPositions(this.doc);
-		util.fixInvalidNesting(this.doc);
+		util.fixInvalidNesting(this.doc, true, { mergeCopies: true });
 		if (this.options.saveRawPage) {
 			let charset;
 			this.doc.querySelectorAll("meta[charset]").forEach(element => {
@@ -612,14 +611,20 @@ class Processor {
 		if (this.options.displayStats) {
 			size = util.getContentSize(this.doc.documentElement.outerHTML);
 		}
-		restoreNestingPositions(this.nestingPositions);
 		const collapsedElementCount = collapseRecreatedElements(this.doc);
-		if (collapsedElementCount || this.doc.querySelector(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`)) {
+		const invalidNesting = collapsedElementCount || this.doc.querySelector(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`);
+		if (invalidNesting) {
 			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);
+		let content = util.serialize(this.doc, this.options.compressHTML);
+		if (invalidNesting) {
+			const closedParagraphs = getClosedParagraphs(this.doc, content);
+			if (closedParagraphs.size) {
+				content = util.serialize(this.doc, this.options.compressHTML, closedParagraphs);
+			}
+		}
 		if (this.options.displayStats) {
 			const contentSize = util.getContentSize(content);
 			this.stats.set("processed", "HTML bytes", contentSize);
@@ -1010,11 +1015,17 @@ class Processor {
 	}
 
 	resetReferrerMeta() {
-		this.doc.querySelectorAll("meta[name=referrer]").forEach(element => element.remove());
 		const metaElement = this.doc.createElement("meta");
 		metaElement.setAttribute("name", "referrer");
 		metaElement.setAttribute("content", "no-referrer");
-		this.doc.head.appendChild(metaElement);
+		const referrerElements = Array.from(this.doc.querySelectorAll("meta[name=referrer]"));
+		const headReferrerElement = referrerElements.find(element => element.parentElement == this.doc.head);
+		if (headReferrerElement) {
+			headReferrerElement.replaceWith(metaElement);
+		} else {
+			this.doc.head.appendChild(metaElement);
+		}
+		referrerElements.forEach(element => element.remove());
 	}
 
 	setInputValues() {
@@ -1447,7 +1458,6 @@ class Processor {
 	insertShadowRootContents() {
 		const doc = this.doc;
 		const options = this.options;
-		const nestingPositions = this.nestingPositions || [];
 		if (options.shadowRoots && options.shadowRoots.length) {
 			processElement(this.doc);
 		}
@@ -1490,8 +1500,7 @@ class Processor {
 						}
 						util.fixInvalidNesting(doc, true, { rootElement: templateElement, recreateOnly: true });
 						removeInsertedParagraphs(templateElement);
-						nestingPositions.push(...getNestingPositions(templateElement));
-						util.fixInvalidNesting(doc, true, { rootElement: templateElement });
+						util.fixInvalidNesting(doc, true, { rootElement: templateElement, mergeCopies: true });
 						if (templateElement.querySelector(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`)) {
 							templateElement.setAttribute(SHADOWROOT_ATTRIBUTE_NAME, "open");
 						}
@@ -1808,33 +1817,6 @@ function testIgnoredPath(resourceURL) {
 	return resourceURL && (resourceURL.startsWith(DATA_URI_PREFIX) || resourceURL == ABOUT_BLANK_URI);
 }
 
-function getNestingPositions(doc) {
-	return Array.from(doc.querySelectorAll(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`)).map(element => ({
-		element,
-		parentNode: element.parentNode,
-		previousSibling: element.previousSibling,
-		nextSibling: element.nextSibling
-	}));
-}
-
-function restoreNestingPositions(positions) {
-	if (positions) {
-		positions.forEach(({ element, parentNode, previousSibling, nextSibling }) => {
-			if (element.isConnected && parentNode && parentNode.isConnected) {
-				if (previousSibling && previousSibling.parentNode == parentNode) {
-					parentNode.insertBefore(element, previousSibling.nextSibling);
-				} else if (!previousSibling) {
-					parentNode.insertBefore(element, parentNode.firstChild);
-				} else if (nextSibling && nextSibling.parentNode == parentNode) {
-					parentNode.insertBefore(element, nextSibling);
-				} else {
-					parentNode.appendChild(element);
-				}
-			}
-		});
-	}
-}
-
 function collapseRecreatedElements(doc) {
 	const elements = Array.from(doc.querySelectorAll(`[${util.NESTING_RECREATED_ATTRIBUTE_NAME}]`)).reverse();
 	elements.forEach(element => {
@@ -1850,6 +1832,25 @@ function collapseRecreatedElements(doc) {
 }
 
 function removeInsertedParagraphs(doc) {
+	getInsertedParagraphs(doc).forEach((_, paragraph) => paragraph.remove());
+}
+
+function getClosedParagraphs(doc, content) {
+	const parsedDoc = util.parseDocContent(content);
+	const roots = [];
+	addRoots(parsedDoc);
+	const trackIds = new Set();
+	roots.forEach(root => getInsertedParagraphs(root).forEach(trackId => trackIds.add(trackId)));
+	return new Set(Array.from(doc.querySelectorAll(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`)).filter(element =>
+		element.tagName == PARAGRAPH_TAG_NAME && trackIds.has(element.getAttribute(util.NESTING_TRACK_ID_ATTRIBUTE_NAME))));
+
+	function addRoots(root) {
+		roots.push(root);
+		root.querySelectorAll("template").forEach(templateElement => addRoots(templateElement.content));
+	}
+}
+
+function getInsertedParagraphs(doc) {
 	const trackedElements = new Map();
 	doc.querySelectorAll(`[${util.NESTING_TRACK_ID_ATTRIBUTE_NAME}]`).forEach(element =>
 		trackedElements.set(element.getAttribute(util.NESTING_TRACK_ID_ATTRIBUTE_NAME), element));
@@ -1858,33 +1859,33 @@ function removeInsertedParagraphs(doc) {
 		const parentTrackId = getParentTrackId(trackId);
 		const expectedParent = trackedElements.get(parentTrackId);
 		if (expectedParent && element.parentElement != expectedParent && !element.contains(expectedParent) &&
-			testParagraphExpectedAncestor(trackedElements, parentTrackId)) {
+			getExpectedParagraphTrackId(trackedElements, parentTrackId)) {
 			displacedElements.add(element);
 		}
 	});
-	const insertedParagraphs = new Set();
+	const insertedParagraphs = new Map();
 	displacedElements.forEach(element => {
 		let sibling = element.nextSibling;
 		while (sibling && (sibling.nodeType != 1 || displacedElements.has(sibling))) {
 			sibling = sibling.nextSibling;
 		}
 		if (sibling && sibling.tagName == PARAGRAPH_TAG_NAME && !sibling.attributes.length && !sibling.childNodes.length) {
-			insertedParagraphs.add(sibling);
+			const trackId = element.getAttribute(util.NESTING_TRACK_ID_ATTRIBUTE_NAME);
+			insertedParagraphs.set(sibling, getExpectedParagraphTrackId(trackedElements, getParentTrackId(trackId)));
 		}
 	});
-	insertedParagraphs.forEach(paragraph => paragraph.remove());
+	return insertedParagraphs;
 }
 
-function testParagraphExpectedAncestor(trackedElements, trackId) {
+function getExpectedParagraphTrackId(trackedElements, trackId) {
 	let element = trackedElements.get(trackId);
 	while (element) {
 		if (element.tagName == PARAGRAPH_TAG_NAME) {
-			return true;
+			return trackId;
 		}
 		trackId = getParentTrackId(trackId);
 		element = trackId ? trackedElements.get(trackId) : null;
 	}
-	return false;
 }
 
 function getParentTrackId(trackId) {

package/core/infobar.js

@@ -149,12 +149,26 @@ const INFOBAR_STYLES = `
 }
 `;
 const INFOBAR_ANIMATIONS_STYLES = `
-.infobar {
+.infobar::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  background-color: #dd6a00;
+  border-radius: inherit;
+  opacity: 0;
+  pointer-events: none;
   animation-name: flash;
   animation-duration: .5s;
   animation-timing-function: cubic-bezier(0.39, 0.58, 0.57, 1);
   animation-delay: 1s;
   animation-iteration-count: 2;
+  transition: visibility 0s 999999s;
+}
+
+.infobar:focus-within::before, .infobar.infobar-focus::before {
+  visibility: hidden;
+  transition-delay: 0s;
 }
 
 .infobar::after {
@@ -180,10 +194,10 @@ const INFOBAR_ANIMATIONS_STYLES = `
 
 @keyframes flash {
   0%, 100% {
-    background-color: #737373;
+    opacity: 0;
   }
   50% {
-    background-color: #dd6a00;
+    opacity: 1;
   }
 }
 
@@ -199,7 +213,7 @@ const INFOBAR_ANIMATIONS_STYLES = `
 }
 
 @media (prefers-reduced-motion: reduce) {
-  .infobar,
+  .infobar::before,
   .infobar::after {
     animation-name: none;
   }

package/core/util.js

@@ -185,8 +185,8 @@ function getInstance(utilOptions) {
 		postProcessDoc(doc, markedElements, invalidElements) {
 			helper.postProcessDoc(doc, markedElements, invalidElements);
 		},
-		serialize(doc, compressHTML) {
-			return modules.serializer.process(doc, compressHTML);
+		serialize(doc, compressHTML, omittedEndTagElements) {
+			return modules.serializer.process(doc, compressHTML, omittedEndTagElements);
 		},
 		removeQuotes(string) {
 			return helper.removeQuotes(string);

package/modules/html-serializer.js

@@ -59,7 +59,7 @@ export {
 	process
 };
 
-function process(doc, compressHTML) {
+function process(doc, compressHTML, omittedEndTagElements) {
 	const docType = doc.doctype;
 	let docTypeString = "";
 	if (docType) {
@@ -74,16 +74,16 @@ function process(doc, compressHTML) {
 			docTypeString += " [" + docType.internalSubset + "]";
 		docTypeString += "> ";
 	}
-	return docTypeString + serialize(doc.documentElement, compressHTML);
+	return docTypeString + serialize(doc.documentElement, compressHTML, omittedEndTagElements);
 }
 
-function serialize(node, compressHTML) {
+function serialize(node, compressHTML, omittedEndTagElements) {
 	if (node.nodeType == Node_TEXT_NODE) {
 		return serializeTextNode(node);
 	} else if (node.nodeType == Node_COMMENT_NODE) {
 		return serializeCommentNode(node);
 	} else if (node.nodeType == Node_ELEMENT_NODE) {
-		return serializeElement(node, compressHTML);
+		return serializeElement(node, compressHTML, omittedEndTagElements);
 	}
 }
 
@@ -95,7 +95,7 @@ function serializeTextNode(textNode) {
 	}
 	if (!parentTagName || TEXT_NODE_TAGS.includes(parentTagName)) {
 		if ((parentTagName == "SCRIPT" && (!parentNode.type || parentNode.type == "text/javascript")) || parentTagName == "STYLE") {
-			return textNode.textContent.replace(/<\//gi, "<\\/").replace(/\/>/gi, "\\/>");
+			return textNode.textContent.replace(/<\//gi, "<\\/");
 		}
 		return textNode.textContent;
 	} else {
@@ -107,7 +107,7 @@ function serializeCommentNode(commentNode) {
 	return "<!--" + commentNode.textContent + "-->";
 }
 
-function serializeElement(element, compressHTML) {
+function serializeElement(element, compressHTML, omittedEndTagElements) {
 	const tagName = getTagName(element);
 	const omittedStartTag = compressHTML && OMITTED_START_TAGS.find(omittedStartTag => tagName == getTagName(omittedStartTag) && omittedStartTag.accept(element));
 	let content = "";
@@ -119,9 +119,9 @@ function serializeElement(element, compressHTML) {
 	if (tagName == "TEMPLATE" && !element.childNodes.length) {
 		content += element.innerHTML;
 	} else {
-		Array.from(element.childNodes).forEach(childNode => content += serialize(childNode, compressHTML));
+		Array.from(element.childNodes).forEach(childNode => content += serialize(childNode, compressHTML, omittedEndTagElements));
 	}
-	const omittedEndTag = compressHTML && OMITTED_END_TAGS.find(omittedEndTag => tagName == getTagName(omittedEndTag) && omittedEndTag.accept(element.nextSibling, element));
+	const omittedEndTag = (omittedEndTagElements && omittedEndTagElements.has(element)) || compressHTML && OMITTED_END_TAGS.find(omittedEndTag => tagName == getTagName(omittedEndTag) && omittedEndTag.accept(element.nextSibling, element));
 	if (!omittedEndTag && !VOID_TAG_NAMES.includes(tagName)) {
 		content += "</" + tagName.toLowerCase() + ">";
 	}

package/package.json

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