replace img src with 1x1 image if it is a child of a hidden element (#146)

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

@@ -68,22 +68,21 @@ this.docHelper = this.docHelper || (() => {
 			if (doc.body && (options.removeHiddenElements || options.removeUnusedFonts || options.compressHTML)) {
 				let elementsInfo = getElementsInfo(win, doc.body);
 				if (options.removeHiddenElements) {
-					const markerRemovedContent = REMOVED_CONTENT_ATTRIBUTE_NAME;
 					let ignoredTags = JSON.parse(JSON.stringify(IGNORED_REMOVED_TAG_NAMES));
 					if (!options.removeScripts) {
 						ignoredTags = ignoredTags.concat("SCRIPT");
 					}
-					markHiddenCandidates(win, doc.body, elementsInfo, false, markerRemovedContent, new Set(), ignoredTags);
-					markHiddenElements(win, doc.body, markerRemovedContent);
+					markHiddenCandidates(win, doc.body, elementsInfo, false, new Set(), ignoredTags);
+					markHiddenElements(win, doc.body, elementsInfo, imageData);
 					doc.querySelectorAll("iframe").forEach(element => {
 						if (element.getBoundingClientRect) {
 							const boundingRect = element.getBoundingClientRect();
 							if (element.hidden || element.style.display == "none" || boundingRect.width <= 1 && boundingRect.height <= 1) {
-								element.setAttribute(markerRemovedContent, "");
+								element.setAttribute(REMOVED_CONTENT_ATTRIBUTE_NAME, "");
 							}
 						}
 					});
-					elementsInfo = new Map(Array.from(elementsInfo).filter(([element]) => element.getAttribute(markerRemovedContent) != ""));
+					elementsInfo = new Map(Array.from(elementsInfo).filter(([element]) => element.getAttribute(REMOVED_CONTENT_ATTRIBUTE_NAME) != ""));
 				}
 				if (options.removeUnusedFonts) {
 					let loadedFonts;
@@ -164,14 +163,14 @@ this.docHelper = this.docHelper || (() => {
 		return elementsInfo;
 	}
 
-	function markHiddenCandidates(win, element, styles, elementHidden, markerRemovedContent, removedCandidates, ignoredTags) {
+	function markHiddenCandidates(win, element, styles, elementHidden, removedCandidates, ignoredTags) {
 		const elements = Array.from(element.childNodes).filter(node => node instanceof win.HTMLElement);
-		elements.forEach(element => markHiddenCandidates(win, element, styles, elementHidden || testHiddenElement(element, styles.get(element)), markerRemovedContent, removedCandidates, ignoredTags));
+		elements.forEach(element => markHiddenCandidates(win, element, styles, elementHidden || testHiddenElement(element, styles.get(element)), removedCandidates, ignoredTags));
 		if (elementHidden && !ignoredTags.includes(element.tagName)) {
 			if (elements.length) {
 				if (!elements.find(element => !removedCandidates.has(element))) {
 					removedCandidates.add(element);
-					elements.forEach(element => element.setAttribute(markerRemovedContent, ""));
+					elements.forEach(element => element.setAttribute(REMOVED_CONTENT_ATTRIBUTE_NAME, ""));
 				}
 			} else {
 				removedCandidates.add(element);
@@ -179,12 +178,18 @@ this.docHelper = this.docHelper || (() => {
 		}
 	}
 
-	function markHiddenElements(win, element, markerRemovedContent) {
+	function markHiddenElements(win, element, styles, imageData) {
 		const elements = Array.from(element.childNodes).filter(node => node.nodeType == win.Node.ELEMENT_NODE);
-		if (element.getAttribute(markerRemovedContent) == "") {
-			element.removeAttribute(markerRemovedContent);
+		if (element.getAttribute(REMOVED_CONTENT_ATTRIBUTE_NAME) == "") {
+			element.removeAttribute(REMOVED_CONTENT_ATTRIBUTE_NAME);
+			if (element.tagName == "IMG") {
+				const imgData = imageData[Number(element.getAttribute(IMAGE_ATTRIBUTE_NAME))];
+				if (imgData) {
+					imgData.currentSrc = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";
+				}
+			}
 		} else {
-			elements.forEach(element => markHiddenElements(win, element, markerRemovedContent));
+			elements.forEach(element => markHiddenElements(win, element, styles, imageData));
 		}
 	}