single-file-core 1.0.69 → 1.0.71

package/common/infobar.js

@@ -143,7 +143,12 @@ export { displayIcon, appendInfobar, refreshInfobarInfo, extractInfobarData, INF
 
 function appendInfobar(doc, options, useShadowRoot) {
 	if (!doc.querySelector(INFOBAR_TAGNAME)) {
-		let infoData = options.infobarContent ? options.infobarContent : options.saveDate;
+		let infoData;
+		if (options.infobarContent) {
+			infoData = options.infobarContent.replace(/\\n/g, "\n").replace(/\\t/g, "\t");
+		} else if (options.saveDate) {
+			infoData = options.saveDate;
+		}
 		infoData = infoData || "No info";
 		const infobarElement = createElement(doc, INFOBAR_TAGNAME, doc.body);
 		let infobarContainer;

package/package.json

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

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

@@ -238,6 +238,7 @@ function initResponse(message) {
 				frameData.processed = messageFrameData.processed;
 				frameData.scrollPosition = messageFrameData.scrollPosition;
 				frameData.scrolling = messageFrameData.scrolling;
+				frameData.adoptedStyleSheets = messageFrameData.adoptedStyleSheets;
 			}
 		});
 		const remainingFrames = windowData.frames.filter(frameData => !frameData.processed).length;
@@ -407,6 +408,7 @@ function getFrameData(document, globalThis, windowId, options, scrolling) {
 		shadowRoots: docData.shadowRoots,
 		scrollPosition: docData.scrollPosition,
 		scrolling,
+		adoptedStyleSheets: docData.adoptedStyleSheets,
 		processed: true
 	};
 }

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

@@ -44,6 +44,7 @@
 	const FETCH_ACK_EVENT = "single-file-ack-fetch";
 	const FETCH_RESPONSE_EVENT = "single-file-response-fetch";
 	const GET_ADOPTED_STYLESHEETS_REQUEST_EVENT = "single-file-request-get-adopted-stylesheets";
+	const UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT = "single-file-unregister-request-get-adopted-stylesheets";
 	const GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT = "single-file-response-get-adopted-stylesheets";
 	const NEW_FONT_FACE_EVENT = "single-file-new-font-face";
 	const DELETE_FONT_EVENT = "single-file-delete-font";
@@ -312,15 +313,7 @@
 		dispatchEvent(new CustomEvent(FETCH_RESPONSE_EVENT, { detail }));
 	});
 
-	addEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, event => {
-		const shadowRoot = event.target.shadowRoot;
-		if (shadowRoot) {
-			const adoptedStyleSheets = Array.from(shadowRoot.adoptedStyleSheets).map(stylesheet => Array.from(stylesheet.cssRules).map(cssRule => cssRule.cssText).join("\n"));
-			if (adoptedStyleSheets.length) {
-				event.target.dispatchEvent(new CustomEvent(GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT, { detail: { adoptedStyleSheets } }));
-			}
-		}		
-	}, { capture: true });
+	addEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, getAdoptedStylesheetsListener);
 
 	if (globalThis.FontFace) {
 		const FontFace = globalThis.FontFace;
@@ -385,6 +378,19 @@
 		globalThis.IntersectionObserver.toString = function () { return "function IntersectionObserver() { [native code] }"; };
 	}
 
+	function getAdoptedStylesheetsListener(event) {
+		const shadowRoot = event.target.shadowRoot;
+		event.stopPropagation();
+		if (shadowRoot) {
+			shadowRoot.addEventListener(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, getAdoptedStylesheetsListener, {});
+			shadowRoot.addEventListener(UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, () => shadowRoot.removeEventListener(getAdoptedStylesheetsListener), { once: true });
+			const adoptedStyleSheets = Array.from(shadowRoot.adoptedStyleSheets).map(stylesheet => Array.from(stylesheet.cssRules).map(cssRule => cssRule.cssText).join("\n"));
+			if (adoptedStyleSheets.length) {
+				event.target.dispatchEvent(new CustomEvent(GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT, { detail: { adoptedStyleSheets } }));
+			}
+		}
+	}
+
 	async function getDetailObject(fontFamily, src, descriptors) {
 		const detail = {};
 		detail["font-family"] = fontFamily;

package/single-file-core.js

@@ -182,6 +182,7 @@ class Runner {
 			this.options.usedFonts = docData.usedFonts;
 			this.options.shadowRoots = docData.shadowRoots;
 			this.options.referrer = docData.referrer;
+			this.options.adoptedStyleSheets = docData.adoptedStyleSheets;
 			this.markedElements = docData.markedElements;
 			this.invalidElements = docData.invalidElements;
 		}
@@ -499,6 +500,10 @@ class Processor {
 		if (legacyInfobarElement) {
 			legacyInfobarElement.remove();
 		}
+		const infobarElement = this.doc.querySelector(util.INFOBAR_TAGNAME);
+		if (infobarElement) {
+			infobarElement.remove();
+		}
 		if (this.options.includeInfobar) {
 			util.appendInfobar(this.doc, this.options);
 		}
@@ -621,6 +626,11 @@ class Processor {
 				}
 			});
 		}
+		if (this.options.adoptedStyleSheets.length) {
+			const styleElement = this.doc.createElement("style");
+			styleElement.textContent = this.options.adoptedStyleSheets.join("\n");
+			this.doc.body.appendChild(styleElement);
+		}
 	}
 
 	removeUnselectedElements() {
@@ -1158,6 +1168,7 @@ class Processor {
 				options.shadowRoots = frameData.shadowRoots;
 				options.scrollPosition = frameData.scrollPosition;
 				options.scrolling = frameData.scrolling;
+				options.adoptedStyleSheets = frameData.adoptedStyleSheets;
 				frameData.runner = new Runner(options);
 				frameData.frameElement = frameElement;
 				await frameData.runner.loadPage();

package/single-file-helper.js

@@ -30,6 +30,7 @@ import * as infobar from "./common/infobar.js";
 const ON_BEFORE_CAPTURE_EVENT_NAME = "single-file-on-before-capture";
 const ON_AFTER_CAPTURE_EVENT_NAME = "single-file-on-after-capture";
 const GET_ADOPTED_STYLESHEETS_REQUEST_EVENT = "single-file-request-get-adopted-stylesheets";
+const UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT = "single-file-unregister-request-get-adopted-stylesheets";
 const GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT = "single-file-response-get-adopted-stylesheets";
 const REMOVED_CONTENT_ATTRIBUTE_NAME = "data-single-file-removed-content";
 const HIDDEN_CONTENT_ATTRIBUTE_NAME = "data-single-file-hidden-content";
@@ -64,6 +65,7 @@ const FONT_WEIGHTS = {
 const COMMENT_HEADER = "Page saved with SingleFile";
 const COMMENT_HEADER_LEGACY = "Archive processed by SingleFile";
 const SINGLE_FILE_UI_ELEMENT_CLASS = "single-file-ui-element";
+const INFOBAR_TAGNAME = infobar.INFOBAR_TAGNAME;
 const EMPTY_RESOURCE = "data:,";
 const addEventListener = (type, listener, options) => globalThis.addEventListener(type, listener, options);
 const dispatchEvent = event => { try { globalThis.dispatchEvent(event); } catch (error) {  /* ignored */ } };
@@ -103,7 +105,8 @@ export {
 	COMMENT_HEADER,
 	COMMENT_HEADER_LEGACY,
 	SINGLE_FILE_UI_ELEMENT_CLASS,
-	EMPTY_RESOURCE
+	EMPTY_RESOURCE,
+	INFOBAR_TAGNAME
 };
 
 function initUserScriptHandler() {
@@ -183,7 +186,8 @@ function preProcessDoc(doc, win, options) {
 		referrer: doc.referrer,
 		markedElements: elementsInfo.markedElements,
 		invalidElements,
-		scrollPosition: { x: win.scrollX, y: win.scrollY }
+		scrollPosition: { x: win.scrollX, y: win.scrollY },
+		adoptedStyleSheets: getStylesheetsContent(doc.adoptedStyleSheets)
 	};
 }
 
@@ -229,23 +233,30 @@ function getElementsInfo(win, doc, element, options, data = { usedFonts: new Map
 				element.setAttribute(SHADOW_ROOT_ATTRIBUTE_NAME, data.shadowRoots.length);
 				data.markedElements.push(element);
 				data.shadowRoots.push(shadowRootInfo);
-				getElementsInfo(win, doc, shadowRoot, options, data, elementHidden);
-				shadowRootInfo.content = shadowRoot.innerHTML;
-				shadowRootInfo.mode = shadowRoot.mode;
 				try {
 					if (shadowRoot.adoptedStyleSheets) {
 						if (shadowRoot.adoptedStyleSheets.length) {
-							shadowRootInfo.adoptedStyleSheets = Array.from(shadowRoot.adoptedStyleSheets).map(stylesheet => Array.from(stylesheet.cssRules).map(cssRule => cssRule.cssText).join("\n"));
+							shadowRootInfo.adoptedStyleSheets = getStylesheetsContent(shadowRoot.adoptedStyleSheets);
 						} else if (shadowRoot.adoptedStyleSheets.length === undefined) {
 							const listener = event => shadowRootInfo.adoptedStyleSheets = event.detail.adoptedStyleSheets;
 							element.addEventListener(GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT, listener);
-							element.dispatchEvent(new CustomEvent(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, { options: { bubbles: true, composed: true }}));
+							element.dispatchEvent(new CustomEvent(GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, { bubbles: true }));
 							element.removeEventListener(GET_ADOPTED_STYLESHEETS_RESPONSE_EVENT, listener);
 						}
 					}
 				} catch (error) {
 					// ignored
 				}
+				getElementsInfo(win, doc, shadowRoot, options, data, elementHidden);
+				shadowRootInfo.content = shadowRoot.innerHTML;
+				shadowRootInfo.mode = shadowRoot.mode;
+				try {
+					if (shadowRoot.adoptedStyleSheets && shadowRoot.adoptedStyleSheets.length === undefined) {
+						element.dispatchEvent(new CustomEvent(UNREGISTER_GET_ADOPTED_STYLESHEETS_REQUEST_EVENT, { bubbles: true }));
+					}
+				} catch (error) {
+					// ignored
+				}
 			}
 			getElementsInfo(win, doc, element, options, data, elementHidden);
 			if (!options.autoSaveExternalSave && options.removeHiddenElements && ascendantHidden) {
@@ -264,6 +275,10 @@ function getElementsInfo(win, doc, element, options, data = { usedFonts: new Map
 	return data;
 }
 
+function getStylesheetsContent(styleSheets) {
+	return Array.from(styleSheets).map(stylesheet => Array.from(stylesheet.cssRules).map(cssRule => cssRule.cssText).join("\n"));
+}
+
 function getResourcesInfo(win, doc, element, options, data, elementHidden, computedStyle) {
 	const tagName = element.tagName && element.tagName.toUpperCase();
 	if (tagName == "CANVAS") {

package/single-file-util.js

@@ -183,7 +183,8 @@ function getInstance(utilOptions) {
 		COMMENT_HEADER: helper.COMMENT_HEADER,
 		COMMENT_HEADER_LEGACY: helper.COMMENT_HEADER_LEGACY,
 		SINGLE_FILE_UI_ELEMENT_CLASS: helper.SINGLE_FILE_UI_ELEMENT_CLASS,
-		EMPTY_RESOURCE: helper.EMPTY_RESOURCE
+		EMPTY_RESOURCE: helper.EMPTY_RESOURCE,
+		INFOBAR_TAGNAME: helper.INFOBAR_TAGNAME
 	};
 
 	async function getContent(resourceURL, options) {