selector edge cases fix

Author: Aaryan430

lib/core/utils/dq-element.js

@@ -6,9 +6,25 @@ import cache from '../base/cache';
 
 const CACHE_KEY = 'DqElm.RunOptions';
 
+/**
+ * Escapes a string for use in CSS selectors
+ * @param {String} str - The string to escape
+ * @returns {String} The escaped string
+ */
+function escapeCSSSelector(str) {
+  // Use the CSS.escape method if available
+  if (window.CSS && window.CSS.escape) {
+    return window.CSS.escape(str);
+  }
+  // Simple fallback for browsers that don't support CSS.escape
+  return str
+    .replace(/[!"#$%&'()*+,./:;<=>?@[\\\]^`{|}~]/g, '\\$&')
+    .replace(/^\d/, '\\3$& ');
+}
+
 function getFullPathSelector(elm) {
-  if (elm.nodeName === 'BODY') {
-    return 'BODY';
+  if (elm.nodeName === 'HTML' || elm.nodeName === 'BODY') {
+    return elm.nodeName.toLowerCase();
   }
 
   if (cache.get('getFullPathSelector') === undefined) {
@@ -28,15 +44,29 @@ function getFullPathSelector(elm) {
       names.unshift(sourceCache.get(elm));
       break;
     } else if (elm.id) {
-      names.unshift('#' + elm.getAttribute('id'));
-      break;
+      // Check if the ID is unique in the document before using it
+      const escapedId = escapeCSSSelector(elm.getAttribute('id'));
+      const elementsWithSameId = document.querySelectorAll(`#${escapedId}`);
+      if (elementsWithSameId.length === 1) {
+        // ID is unique, safe to use
+        names.unshift('#' + escapedId);
+        break;
+      } else {
+        // ID is not unique, fallback to position-based selector
+        let c = 1;
+        let e = elm;
+        for (; e.previousElementSibling; e = e.previousElementSibling, c++) {
+          // Increment counter for each previous sibling
+        }
+        names.unshift(`${elm.nodeName.toLowerCase()}:nth-child(${c})`);
+      }
     } else {
-      let c = 1,
-        e = elm;
+      let c = 1;
+      let e = elm;
       for (; e.previousElementSibling; e = e.previousElementSibling, c++) {
         // Increment counter for each previous sibling
       }
-      names.unshift(elm.nodeName + ':nth-child(' + c + ')');
+      names.unshift(`${elm.nodeName.toLowerCase()}:nth-child(${c})`);
     }
     elm = elm.parentElement;
   }