ignore shadowRoot of UI elements

extension/ui/content/content-ui-main.js

@@ -37,7 +37,7 @@ this.singlefile.extension.ui.content.main = this.singlefile.extension.ui.content
 	const LOGS_LINE_CLASSNAME = "singlefile-logs-line";
 	const LOGS_LINE_TEXT_ELEMENT_CLASSNAME = "singlefile-logs-line-text";
 	const LOGS_LINE_STATUS_ELEMENT_CLASSNAME = "singlefile-logs-line-icon";
-	const SINGLE_FILE_UI_ELEMENT_CLASS = "single-file-ui-element";
+	const SINGLE_FILE_UI_ELEMENT_CLASS = this.singlefile.lib.helper.SINGLE_FILE_UI_ELEMENT_CLASS;
 	const SELECT_PX_THRESHOLD = 8;
 	const LOG_PANEL_DEFERRED_IMAGES_MESSAGE = browser.i18n.getMessage("logPanelDeferredImages");
 	const LOG_PANEL_FRAME_CONTENTS_MESSAGE = browser.i18n.getMessage("logPanelFrameContents");

lib/single-file/processors/lazy/content/content-lazy-loader.js

@@ -26,7 +26,6 @@
 this.singlefile.lib.processors.lazy.content.loader = this.singlefile.lib.processors.lazy.content.loader || (() => {
 
 	const ATTRIBUTES_MUTATION_TYPE = "attributes";
-	const SINGLE_FILE_UI_ELEMENT_CLASS = "single-file-ui-element";
 
 	const singlefile = this.singlefile;
 	const browser = this.browser;
@@ -67,7 +66,7 @@ this.singlefile.lib.processors.lazy.content.loader = this.singlefile.lib.process
 							mutation.target.addEventListener("load", onResourceLoad);
 						}
 						if (mutation.attributeName == "src" || mutation.attributeName == "srcset" || mutation.target.tagName == "SOURCE") {
-							return mutation.target.className != SINGLE_FILE_UI_ELEMENT_CLASS;
+							return !mutation.target.classList || !mutation.target.classList.contains(singlefile.lib.helper.SINGLE_FILE_UI_ELEMENT_CLASS);
 						}
 					});
 					if (updated.length) {

lib/single-file/single-file-core.js

@@ -390,7 +390,6 @@ this.singlefile.lib.core = this.singlefile.lib.core || (() => {
 	const SHADOW_DELEGATE_FOCUS_ATTRIBUTE_NAME = "delegatesfocus";
 	const SCRIPT_TEMPLATE_SHADOW_ROOT = "data-template-shadow-root";
 	const UTF8_CHARSET = "utf-8";
-	const SINGLE_FILE_UI_ELEMENT_CLASS = "single-file-ui-element";
 
 	class Processor {
 		constructor(options, batchRequest) {
@@ -700,7 +699,7 @@ this.singlefile.lib.core = this.singlefile.lib.core || (() => {
 		}
 
 		removeDiscardedResources() {
-			this.doc.querySelectorAll("." + SINGLE_FILE_UI_ELEMENT_CLASS).forEach(element => element.remove());
+			this.doc.querySelectorAll("." + util.SINGLE_FILE_UI_ELEMENT_CLASS).forEach(element => element.remove());
 			this.doc.querySelectorAll("meta[http-equiv=refresh], meta[disabled-http-equiv], meta[http-equiv=\"content-security-policy\"]").forEach(element => element.remove());
 			const objectElements = this.doc.querySelectorAll("applet, object[data]:not([type=\"image/svg+xml\"]):not([type=\"image/svg-xml\"]):not([type=\"text/html\"]), embed[src]:not([src*=\".svg\"]):not([src*=\".pdf\"])");
 			this.stats.set("discarded", "objects", objectElements.length);

lib/single-file/single-file-helper.js

@@ -59,6 +59,7 @@ this.singlefile.lib.helper = this.singlefile.lib.helper || (() => {
 	};
 	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 addEventListener = (type, listener, options) => window.addEventListener(type, listener, options);
 	const dispatchEvent = event => window.dispatchEvent(event);
 
@@ -98,7 +99,8 @@ this.singlefile.lib.helper = this.singlefile.lib.helper || (() => {
 		SELECTED_CONTENT_ATTRIBUTE_NAME,
 		ASYNC_SCRIPT_ATTRIBUTE_NAME,
 		COMMENT_HEADER,
-		COMMENT_HEADER_LEGACY
+		COMMENT_HEADER_LEGACY,
+		SINGLE_FILE_UI_ELEMENT_CLASS
 	};
 
 	function initDoc(doc) {
@@ -186,7 +188,7 @@ this.singlefile.lib.helper = this.singlefile.lib.helper || (() => {
 			}
 			getResourcesInfo(win, doc, element, options, data, elementHidden, computedStyle);
 			const shadowRoot = getShadowRoot(element);
-			if (shadowRoot) {
+			if (shadowRoot && !element.classList.contains(SINGLE_FILE_UI_ELEMENT_CLASS)) {
 				const shadowRootInfo = {};
 				element.setAttribute(SHADOW_ROOT_ATTRIBUTE_NAME, data.shadowRoots.length);
 				data.markedElements.push(element);

lib/single-file/single-file-util.js

@@ -204,7 +204,8 @@ this.singlefile.lib.util = this.singlefile.lib.util || (() => {
 				STYLESHEET_ATTRIBUTE_NAME: helper.STYLESHEET_ATTRIBUTE_NAME,
 				SELECTED_CONTENT_ATTRIBUTE_NAME: helper.SELECTED_CONTENT_ATTRIBUTE_NAME,
 				COMMENT_HEADER: helper.COMMENT_HEADER,
-				COMMENT_HEADER_LEGACY: helper.COMMENT_HEADER_LEGACY
+				COMMENT_HEADER_LEGACY: helper.COMMENT_HEADER_LEGACY,
+				SINGLE_FILE_UI_ELEMENT_CLASS: helper.SINGLE_FILE_UI_ELEMENT_CLASS
 			};
 
 			async function getContent(resourceURL, options) {