fixed issue with nested ranges

extension/ui/content/content-ui.js

@@ -121,22 +121,22 @@ this.singlefile.ui = this.singlefile.ui || (() => {
 			range = selection.getRangeAt(indexRange);
 			if (range && range.commonAncestorContainer) {
 				const treeWalker = document.createTreeWalker(range.commonAncestorContainer);
-				const ancestorElement = range.commonAncestorContainer != Node.ELEMENT_NODE ? range.commonAncestorContainer.parentElement : range.commonAncestorContainer;
+				// const ancestorElement = range.commonAncestorContainer != Node.ELEMENT_NODE ? range.commonAncestorContainer.parentElement : range.commonAncestorContainer;
 				if (treeWalker.currentNode == range.endContainer) {
 					selectionFound = true;
 					markSelectedNode(treeWalker.currentNode);
-				}
-				while (treeWalker.currentNode != range.endContainer) {
-					if (treeWalker.currentNode == range.startContainer || treeWalker.currentNode == range.endContainer) {
-						selectionFound = true;
-					}
-					if (selectionFound) {
-						markSelectedNode(treeWalker.currentNode);
+				} else {
+					while (treeWalker.currentNode != range.endContainer) {
+						if (treeWalker.currentNode == range.startContainer || treeWalker.currentNode == range.endContainer) {
+							selectionFound = true;
+						}
+						if (selectionFound) {
+							markSelectedNode(treeWalker.currentNode);
+						}
+						treeWalker.nextNode();
 					}
-					treeWalker.nextNode();
 				}
 				if (selectionFound) {
-					ancestorElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
 					contentSelected = true;
 				}
 			}
@@ -147,16 +147,17 @@ this.singlefile.ui = this.singlefile.ui || (() => {
 	function markSelectedNode(node) {
 		const element = node.nodeType == Node.ELEMENT_NODE ? node : node.parentElement;
 		element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, "");
+		if (node.parentElement) {
+			markSelectedNode(node.parentElement);
+		}
 	}
 
 	function markSelectedArea(selectedAreaElement) {
-		selectedAreaElement.setAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
 		selectedAreaElement.querySelectorAll("*").forEach(element => element.setAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME, ""));
 	}
 
 	function unmarkSelection() {
 		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ATTRIBUTE_NAME));
-		document.querySelectorAll("[" + SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME + "]").forEach(selectedContent => selectedContent.removeAttribute(SingleFile.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME));
 	}
 
 	function getSelectedArea() {

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

@@ -24,7 +24,6 @@
 this.SingleFileCore = this.SingleFileCore || (() => {
 
 	const SELECTED_CONTENT_ATTRIBUTE_NAME = "data-single-file-selected-content";
-	const SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME = "data-single-file-selected-content-root";
 	const DEBUG = false;
 
 	let docUtil, cssTree, sessionId = 0;
@@ -56,7 +55,6 @@ this.SingleFileCore = this.SingleFileCore || (() => {
 	}
 
 	SingleFileClass.SELECTED_CONTENT_ATTRIBUTE_NAME = SELECTED_CONTENT_ATTRIBUTE_NAME;
-	SingleFileClass.SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME = SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME;
 
 	// -------------
 	// ProgressEvent
@@ -497,12 +495,7 @@ this.SingleFileCore = this.SingleFileCore || (() => {
 		}
 
 		removeUnselectedElements() {
-			const rootElements = this.doc.querySelectorAll("[" + SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME + "]");
-			ProcessorHelper.removeUnselectedElements(rootElements, this.doc);
-			rootElements.forEach(rootElement => {
-				rootElement.removeAttribute(SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME);
-				rootElement.removeAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME);
-			});
+			ProcessorHelper.removeUnselectedElements(this.doc);
 		}
 
 		insertVideoPosters() {
@@ -1151,37 +1144,20 @@ this.SingleFileCore = this.SingleFileCore || (() => {
 			}
 		}
 
-		static removeUnselectedElements(rootElements, doc) {
-			rootElements.forEach(rootElement => {
-				rootElement.querySelectorAll("*").forEach(element => {
-					if (element.getAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME) != "" && !element.querySelector("[" + SELECTED_CONTENT_ATTRIBUTE_NAME + "]")) {
-						removeNode(element);
-					}
-				});
-				markParentElements(rootElement.parentElement);
-			});
+		static removeUnselectedElements(doc) {
 			removeUnmarkedElements(doc.body);
-
-			function markParentElements(element) {
-				element.setAttribute(SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME, "");
-				if (element.parentElement) {
-					markParentElements(element.parentElement);
-				}
-			}
+			doc.body.removeAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME);
 
 			function removeUnmarkedElements(element) {
 				let selectedElementFound = false;
 				Array.from(element.childNodes).forEach(node => {
-					const isSelectedElement = node.getAttribute && node.getAttribute(SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME) == "";
+					const isSelectedElement = node.getAttribute && node.getAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME) == "";
 					selectedElementFound = selectedElementFound || isSelectedElement;
 					if (isSelectedElement) {
-						node.removeAttribute(SELECTED_CONTENT_ROOT_ATTRIBUTE_NAME);
+						node.removeAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME);
 						removeUnmarkedElements(node);
 					} else if (selectedElementFound) {
 						removeNode(node);
-					} else if (node.getAttribute && node.getAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME) == "") {
-						node.removeAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME);
-						node.querySelectorAll("[" + SELECTED_CONTENT_ATTRIBUTE_NAME + "]").forEach(node => node.removeAttribute(SELECTED_CONTENT_ATTRIBUTE_NAME));
 					} else if (node.style) {
 						node.style.setProperty("display", "none", "important");
 						if (node.childNodes) {