retrieve shadow root contents recursively

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

@@ -110,16 +110,14 @@ this.docHelper = this.docHelper || (() => {
 						}
 					});
 				}
-				shadowRootsData = getshadowRootsData(elementsInfo);
-			} else if (doc.body) {
-				shadowRootsData = getshadowRootsData(getShadowRootElementsInfo(win, doc.body));
 			}
 		}
+		shadowRootsData = getShadowRootsData(doc.body);
 		retrieveInputValues(doc);
 		return {
 			canvasData,
 			fontsData: getFontsData(doc),
-			stylesheetsData: getstylesheetsData(doc),
+			stylesheetsData: getStylesheetsData(doc),
 			imageData,
 			postersData: getPostersData(doc),
 			usedFonts,
@@ -128,19 +126,21 @@ this.docHelper = this.docHelper || (() => {
 		};
 	}
 
-	function getshadowRootsData(elementsInfo) {
-		let shadowRootsData, elementIndex = 0;
-		elementsInfo.forEach((elementInfo, element) => {
-			if (element.attributes && elementInfo.shadowRoot) {
-				element.setAttribute(SHADOW_ROOT_ATTRIBUTE_NAME, elementIndex);
-				elementIndex++;
-				if (!shadowRootsData) {
-					shadowRootsData = [];
-				}
-				shadowRootsData.push({ content: element.shadowRoot.innerHTML, height: element.clientHeight });
-			}
-		});
+	function getShadowRootsData(element) {
+		let shadowRootsData = [];
+		getData(element);
 		return shadowRootsData;
+
+		function getData(element) {
+			element.childNodes.forEach(node => {
+				getData(node);
+				if (node.shadowRoot) {
+					node.setAttribute(SHADOW_ROOT_ATTRIBUTE_NAME, shadowRootsData.length);
+					shadowRootsData.push({ content: node.shadowRoot.innerHTML });
+					getData(node.shadowRoot);
+				}
+			});
+		}
 	}
 
 	function getUsedFonts(styles, loadedFonts) {
@@ -162,17 +162,6 @@ this.docHelper = this.docHelper || (() => {
 		return removeQuotes(fontFamilyName.trim()).toLowerCase();
 	}
 
-	function getShadowRootElementsInfo(win, element, elementsInfo = new Map()) {
-		const elements = Array.from(element.childNodes).filter(node => !win || node instanceof win.Element);
-		elements.forEach(element => {
-			getShadowRootElementsInfo(win, element, elementsInfo);
-			elementsInfo.set(element, {
-				shadowRoot: element.shadowRoot
-			});
-		});
-		return elementsInfo;
-	}
-
 	function getElementsInfo(win, element, elementsInfo = new Map()) {
 		const elements = Array.from(element.childNodes).filter(node => !win || node instanceof win.Element);
 		elements.forEach(element => {
@@ -196,8 +185,7 @@ this.docHelper = this.docHelper || (() => {
 			fontWeight: getFontWeight(computedStyle.getPropertyValue("font-weight")),
 			fontStyle: computedStyle.getPropertyValue("font-style") || "normal",
 			fontVariant: computedStyle.getPropertyValue("font-variant") || "normal",
-			whiteSpace: computedStyle.getPropertyValue("white-space"),
-			shadowRoot: element.shadowRoot
+			whiteSpace: computedStyle.getPropertyValue("white-space")
 		});
 	}
 
@@ -282,7 +270,7 @@ this.docHelper = this.docHelper || (() => {
 		}
 	}
 
-	function getstylesheetsData(doc) {
+	function getStylesheetsData(doc) {
 		if (doc) {
 			const contents = [];
 			doc.querySelectorAll("style").forEach((styleElement, styleIndex) => {