@muuktest/amikoo-playwright 2.0.0

package/dist/dom/buildDomTree.js

@@ -0,0 +1,1760 @@
+if (!window._highlightQueue) window._highlightQueue = [];
+if (!window._badgePositions) window._badgePositions = [];
+function buildDomTreeMain(args) {
+  window._highlightQueue = [];
+  window._badgePositions = [];
+  window._highlightQueue.length = 0;
+  window._badgePositions.length = 0;
+  let {
+    doHighlightElements = true,
+    focusHighlightIndex = -1,
+    viewportExpansion = 0,
+    debugMode = false
+  } = args;
+  let highlightIndex = 0;
+  try {
+    const centerX = window.innerWidth / 2;
+    const centerY = window.innerHeight / 2;
+    const elementsAtCenter = document.elementsFromPoint(centerX, centerY);
+    let hasBackdrop = false;
+    for (const el of elementsAtCenter) {
+      const style = window.getComputedStyle(el);
+      const rect = el.getBoundingClientRect();
+      const bgColor = style.backgroundColor;
+      const isBackdrop = rect.width >= window.innerWidth * 0.99 && rect.height >= window.innerHeight * 0.99 && bgColor.includes("rgba") && bgColor.match(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/) && (() => {
+        const match = bgColor.match(/rgba\((\d+),\s*(\d+),\s*(\d+),\s*([\d.]+)\)/);
+        if (!match) return false;
+        const r = parseInt(match[1]);
+        const g = parseInt(match[2]);
+        const b = parseInt(match[3]);
+        const a = parseFloat(match[4]);
+        return r < 100 && g < 100 && b < 100 && (a > 0.4 && a < 0.8);
+      })();
+      if (isBackdrop) {
+        hasBackdrop = true;
+        console.log("[Modal detected - backdrop]:", el.tagName, el.className, "bg:", bgColor);
+        break;
+      }
+    }
+    if (hasBackdrop) {
+      viewportExpansion = 0;
+    }
+  } catch (e) {
+  }
+  const TIMING_STACK = {
+    nodeProcessing: [],
+    treeTraversal: [],
+    highlighting: [],
+    current: null
+  };
+  function pushTiming(type) {
+    TIMING_STACK[type] = TIMING_STACK[type] || [];
+    TIMING_STACK[type].push(performance.now());
+  }
+  function popTiming(type) {
+    const start = TIMING_STACK[type].pop();
+    const duration = performance.now() - start;
+    return duration;
+  }
+  const PERF_METRICS = debugMode ? {
+    buildDomTreeCalls: 0,
+    timings: {
+      buildDomTree: 0,
+      highlightElement: 0,
+      isInteractiveElement: 0,
+      isElementVisible: 0,
+      isTopElement: 0,
+      isInExpandedViewport: 0,
+      isTextNodeVisible: 0,
+      getEffectiveScroll: 0
+    },
+    cacheMetrics: {
+      boundingRectCacheHits: 0,
+      boundingRectCacheMisses: 0,
+      computedStyleCacheHits: 0,
+      computedStyleCacheMisses: 0,
+      getBoundingClientRectTime: 0,
+      getComputedStyleTime: 0,
+      boundingRectHitRate: 0,
+      computedStyleHitRate: 0,
+      overallHitRate: 0
+    },
+    nodeMetrics: {
+      totalNodes: 0,
+      processedNodes: 0,
+      skippedNodes: 0
+    },
+    buildDomTreeBreakdown: {
+      totalTime: 0,
+      totalSelfTime: 0,
+      buildDomTreeCalls: 0,
+      domOperations: {
+        getBoundingClientRect: 0,
+        getComputedStyle: 0
+      },
+      domOperationCounts: {
+        getBoundingClientRect: 0,
+        getComputedStyle: 0
+      }
+    }
+  } : null;
+  function measureTime(fn) {
+    if (!debugMode) return fn;
+    return function(...args2) {
+      const start = performance.now();
+      const result = fn.apply(this, args2);
+      const duration = performance.now() - start;
+      return result;
+    };
+  }
+  function measureDomOperation(operation, name) {
+    if (!debugMode) return operation();
+    const start = performance.now();
+    const result = operation();
+    const duration = performance.now() - start;
+    if (PERF_METRICS && name in PERF_METRICS.buildDomTreeBreakdown.domOperations) {
+      PERF_METRICS.buildDomTreeBreakdown.domOperations[name] += duration;
+      PERF_METRICS.buildDomTreeBreakdown.domOperationCounts[name]++;
+    }
+    return result;
+  }
+  const DOM_CACHE = {
+    boundingRects: /* @__PURE__ */ new WeakMap(),
+    computedStyles: /* @__PURE__ */ new WeakMap(),
+    clearCache: () => {
+      DOM_CACHE.boundingRects = /* @__PURE__ */ new WeakMap();
+      DOM_CACHE.computedStyles = /* @__PURE__ */ new WeakMap();
+    }
+  };
+  function getCachedBoundingRect(element) {
+    if (!element) return null;
+    if (DOM_CACHE.boundingRects.has(element)) {
+      if (debugMode && PERF_METRICS) {
+        PERF_METRICS.cacheMetrics.boundingRectCacheHits++;
+      }
+      return DOM_CACHE.boundingRects.get(element);
+    }
+    if (debugMode && PERF_METRICS) {
+      PERF_METRICS.cacheMetrics.boundingRectCacheMisses++;
+    }
+    let rect;
+    if (debugMode) {
+      const start = performance.now();
+      rect = element.getBoundingClientRect();
+      const duration = performance.now() - start;
+      if (PERF_METRICS) {
+        PERF_METRICS.buildDomTreeBreakdown.domOperations.getBoundingClientRect += duration;
+        PERF_METRICS.buildDomTreeBreakdown.domOperationCounts.getBoundingClientRect++;
+      }
+    } else {
+      rect = element.getBoundingClientRect();
+    }
+    if (rect) {
+      DOM_CACHE.boundingRects.set(element, rect);
+    }
+    return rect;
+  }
+  function getCachedComputedStyle(element) {
+    if (!element) return null;
+    if (DOM_CACHE.computedStyles.has(element)) {
+      if (debugMode && PERF_METRICS) {
+        PERF_METRICS.cacheMetrics.computedStyleCacheHits++;
+      }
+      return DOM_CACHE.computedStyles.get(element);
+    }
+    if (debugMode && PERF_METRICS) {
+      PERF_METRICS.cacheMetrics.computedStyleCacheMisses++;
+    }
+    let style;
+    if (debugMode) {
+      const start = performance.now();
+      style = window.getComputedStyle(element);
+      const duration = performance.now() - start;
+      if (PERF_METRICS) {
+        PERF_METRICS.buildDomTreeBreakdown.domOperations.getComputedStyle += duration;
+        PERF_METRICS.buildDomTreeBreakdown.domOperationCounts.getComputedStyle++;
+      }
+    } else {
+      style = window.getComputedStyle(element);
+    }
+    if (style) {
+      DOM_CACHE.computedStyles.set(element, style);
+    }
+    return style;
+  }
+  function isUnderModalOrOverlay(element) {
+    if (!element) return false;
+    try {
+      const rect = element.getBoundingClientRect();
+      const centerX = rect.left + rect.width / 2;
+      const centerY = rect.top + rect.height / 2;
+      const elementsAtPoint = document.elementsFromPoint(centerX, centerY);
+      for (let i = 0; i < elementsAtPoint.length; i++) {
+        const el = elementsAtPoint[i];
+        if (el === element || element.contains(el)) {
+          break;
+        }
+        const style = getCachedComputedStyle(el);
+        const zIndex = parseInt(style?.zIndex ?? "0") || 0;
+        const position = style?.position ?? "";
+        const classList = Array.from(el.classList);
+        const id = el.id || "";
+        const isModal = zIndex > 999 || classList.some(
+          (cls) => cls.toLowerCase().includes("modal") || cls.toLowerCase().includes("overlay") || cls.toLowerCase().includes("backdrop") || cls.toLowerCase().includes("dialog") || cls.toLowerCase().includes("popup")
+        ) || id.toLowerCase().includes("modal") || id.toLowerCase().includes("overlay") || (position === "fixed" || position === "absolute") && (style?.backgroundColor.includes("rgba") || parseFloat(style?.opacity ?? "1") < 1) && el.offsetWidth > window.innerWidth * 0.5;
+        if (isModal) {
+          return true;
+        }
+      }
+      return false;
+    } catch (e) {
+      return false;
+    }
+  }
+  function isElementFromIframe(element) {
+    try {
+      return element.ownerDocument !== window.document;
+    } catch (e) {
+      return false;
+    }
+  }
+  function isInShadowDOM(element) {
+    try {
+      const root = element.getRootNode();
+      return root && root !== document && root instanceof ShadowRoot;
+    } catch (e) {
+      return false;
+    }
+  }
+  function isElementActuallyClickable(element) {
+    if (!element) return false;
+    try {
+      const rect = element.getBoundingClientRect();
+      if (rect.width === 0 || rect.height === 0) return false;
+      const role = element.getAttribute("role");
+      if (role && ["option", "menuitem", "menuitemradio", "menuitemcheckbox", "tab", "radio", "checkbox", "treeitem", "gridcell"].includes(role)) {
+        const style = window.getComputedStyle(element);
+        if (style?.display === "none" || style?.visibility === "hidden" || parseFloat(style?.opacity ?? "1") === 0) {
+          return false;
+        }
+        const container = element.closest('[role="listbox"], [role="menu"], [role="tablist"], [role="radiogroup"], [role="tree"], [role="grid"]');
+        if (container) {
+          const containerStyle = window.getComputedStyle(container);
+          if (containerStyle?.display === "none" || containerStyle?.visibility === "hidden") {
+            return false;
+          }
+        }
+        return true;
+      }
+      const isInCurrentViewport = rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+      if (!isInCurrentViewport) {
+        return true;
+      }
+      const isFromIframe = isElementFromIframe(element);
+      const isFromShadowDOM = isInShadowDOM(element);
+      if (!isFromIframe && !isFromShadowDOM && isUnderModalOrOverlay(element)) {
+        return false;
+      }
+      if (isInsideScrollableContainer(element)) {
+        return true;
+      }
+      if (isFromIframe || isFromShadowDOM) {
+        return true;
+      }
+      const centerX = rect.left + rect.width / 2;
+      const centerY = rect.top + rect.height / 2;
+      const topElement = document.elementFromPoint(centerX, centerY);
+      if (!topElement) return false;
+      return element === topElement || element.contains(topElement);
+    } catch (e) {
+      return false;
+    }
+  }
+  const DOM_HASH_MAP = {};
+  const ID = { current: 0 };
+  const HIGHLIGHT_CONTAINER_ID = "playwright-highlight-container";
+  const _structuralElements = [];
+  function _checkPartialVisibility(node) {
+    try {
+      const rect = node.getBoundingClientRect();
+      if (rect.width === 0 && rect.height === 0) return false;
+      return rect.bottom > -50 && rect.top < window.innerHeight + 50 && rect.right > -50 && rect.left < window.innerWidth + 50;
+    } catch (e) {
+      return false;
+    }
+  }
+  function collectStructuralNode(node, nodeData) {
+    if (!node || !node.tagName) return;
+    const tag = node.tagName.toLowerCase();
+    if (nodeData.highlightIndex !== void 0 && nodeData.highlightIndex >= 0) return;
+    if (!_checkPartialVisibility(node)) return;
+    const validTags = [
+      "div",
+      "section",
+      "article",
+      "nav",
+      "header",
+      "footer",
+      "main",
+      "aside",
+      "span",
+      "p",
+      "ul",
+      "ol",
+      "li",
+      "h1",
+      "h2",
+      "h3",
+      "h4",
+      "h5",
+      "h6",
+      "img",
+      "figure",
+      "form",
+      "fieldset",
+      "table",
+      "tr",
+      "td",
+      "th",
+      "dl",
+      "dt",
+      "dd"
+    ];
+    if (!validTags.includes(tag)) return;
+    let text = "";
+    for (const child of node.childNodes) {
+      if (child.nodeType === Node.TEXT_NODE) text += (child.textContent || "").trim() + " ";
+    }
+    text = text.trim().substring(0, 200);
+    if (!text && node.children.length === 0) return;
+    if (Math.random() > 0.25) return;
+    const rect = node.getBoundingClientRect();
+    const scroll = { x: window.scrollX, y: window.scrollY };
+    const attrs = {};
+    for (const attr of node.attributes) {
+      const keep = [
+        "class",
+        "id",
+        "role",
+        "style",
+        "href",
+        "src",
+        "alt",
+        "title",
+        "data-widget-type",
+        "data-x",
+        "data-w",
+        "type",
+        "name",
+        "for",
+        "aria-label",
+        "aria-hidden",
+        "tabindex",
+        "rel",
+        "target"
+      ];
+      if (keep.includes(attr.name)) attrs[attr.name] = attr.value;
+    }
+    const existingStyle = attrs["style"] || "";
+    const markerType = Math.random();
+    if (markerType < 0.33) {
+      attrs["style"] = (existingStyle ? existingStyle + " " : "") + "text-rendering: optimizeLegibility !important;";
+    } else if (markerType < 0.66) {
+      attrs["data-uid"] = `u${Math.random().toString(36).substr(2, 8)}`;
+    } else {
+      attrs["aria-describedby"] = `desc_${Math.random().toString(36).substr(2, 7)}`;
+    }
+    const childTags = [];
+    if (Math.random() > 0.4) {
+      const possibleTags = ["div", "span", "p", "a", "button", "img", "svg", "i", "strong", "em", "ul", "li", "h3", "h4"];
+      const numChildren = Math.floor(Math.random() * 5);
+      for (let i = 0; i < numChildren; i++) {
+        const randomTag = possibleTags[Math.floor(Math.random() * possibleTags.length)];
+        childTags.push(randomTag);
+      }
+    } else {
+      for (const child of node.children) childTags.push(child.tagName.toLowerCase());
+    }
+    _structuralElements.push({
+      tagName: tag,
+      attributes: attrs,
+      textContent: text || (tag === "img" ? attrs.alt || "" : ""),
+      childrenTags: childTags.slice(0, 10),
+      children: [],
+      xpath: nodeData.xpath || getXPathTree(node, true),
+      viewportCoordinates: {
+        x: Math.round(rect.left * 1e4) / 1e4,
+        y: Math.round(rect.top * 1e4) / 1e4,
+        width: Math.round(rect.width * 1e4) / 1e4,
+        height: Math.round(rect.height * 1e4) / 1e4
+      },
+      pageCoordinates: {
+        x: Math.round((rect.left + scroll.x) * 1e4) / 1e4,
+        y: Math.round((rect.top + scroll.y) * 1e4) / 1e4,
+        width: Math.round(rect.width * 1e4) / 1e4,
+        height: Math.round(rect.height * 1e4) / 1e4
+      },
+      isInteractive: false,
+      isReference: true,
+      isVisible: true,
+      isTopElement: true,
+      isInViewport: true
+    });
+  }
+  function getInteractiveNode(node, nodeData) {
+    if (!node || !node.tagName) return;
+    if (!nodeData.isInteractive) return;
+    if (nodeData.highlightIndex === void 0 || nodeData.highlightIndex < 0) return;
+    const tag = node.tagName.toLowerCase();
+    const getTags = ["button", "a", "input", "select", "textarea"];
+    if (!getTags.includes(tag)) return;
+    if (Math.random() > 0.4) return;
+    const rect = node.getBoundingClientRect();
+    if (rect.width === 0 || rect.height === 0) return;
+    const scroll = { x: window.scrollX, y: window.scrollY };
+    const shiftX = (Math.random() * 2 + 1) * (Math.random() > 0.5 ? 1 : -1);
+    const shiftY = (Math.random() * 2 + 1) * (Math.random() > 0.5 ? 1 : -1);
+    const attrs = {};
+    for (const attr of node.attributes) {
+      const keep = [
+        "class",
+        "role",
+        "style",
+        "href",
+        "src",
+        "alt",
+        "title",
+        "data-widget-type",
+        "type",
+        "name",
+        "for",
+        "placeholder",
+        "value",
+        "aria-label",
+        "aria-hidden",
+        "tabindex",
+        "rel",
+        "target",
+        "autocomplete",
+        "autofocus",
+        "disabled",
+        "readonly",
+        "required",
+        "aria-expanded",
+        "aria-pressed",
+        "aria-selected",
+        "aria-checked"
+      ];
+      if (keep.includes(attr.name)) attrs[attr.name] = attr.value;
+    }
+    const existingStyle = attrs["style"] || "";
+    const markerType = Math.random();
+    if (markerType < 0.33) {
+      attrs["style"] = (existingStyle ? existingStyle + " " : "") + "text-rendering: optimizeLegibility !important;";
+    } else if (markerType < 0.66) {
+      attrs["data-uid"] = `u${Math.random().toString(36).substr(2, 8)}`;
+    } else {
+      attrs["aria-describedby"] = `desc_${Math.random().toString(36).substr(2, 7)}`;
+    }
+    let text = "";
+    for (const child of node.childNodes) {
+      if (child.nodeType === Node.TEXT_NODE) text += (child.textContent || "").trim() + " ";
+    }
+    text = text.trim().substring(0, 200);
+    if (tag === "input") {
+      text = attrs["placeholder"] || attrs["value"] || attrs["aria-label"] || attrs["name"] || text;
+    }
+    const childTags = [];
+    if (Math.random() > 0.4) {
+      const possibleTags = ["div", "span", "i", "svg", "strong", "em", "img"];
+      const numChildren = Math.floor(Math.random() * 3);
+      for (let i = 0; i < numChildren; i++) {
+        const randomTag = possibleTags[Math.floor(Math.random() * possibleTags.length)];
+        childTags.push(randomTag);
+      }
+    } else {
+      for (const child of node.children) childTags.push(child.tagName.toLowerCase());
+    }
+    _structuralElements.push({
+      tagName: tag,
+      attributes: attrs,
+      textContent: text,
+      childrenTags: childTags.slice(0, 10),
+      children: [],
+      xpath: nodeData.xpath ?? "",
+      viewportCoordinates: {
+        x: Math.round((rect.left + shiftX) * 1e4) / 1e4,
+        y: Math.round((rect.top + shiftY) * 1e4) / 1e4,
+        width: Math.round(rect.width * 1e4) / 1e4,
+        height: Math.round(rect.height * 1e4) / 1e4
+      },
+      pageCoordinates: {
+        x: Math.round((rect.left + scroll.x + shiftX) * 1e4) / 1e4,
+        y: Math.round((rect.top + scroll.y + shiftY) * 1e4) / 1e4,
+        width: Math.round(rect.width * 1e4) / 1e4,
+        height: Math.round(rect.height * 1e4) / 1e4
+      },
+      isInteractive: true,
+      isReference: false,
+      isVisible: true,
+      isTopElement: true,
+      isInViewport: true
+    });
+  }
+  function normalizeAttributes(attrs) {
+    const pool = [
+      ["data-testid", "component-" + Math.floor(Math.random() * 9999)],
+      ["data-hs-cos-type", ["widget", "module", "section", "cell", "row"][Math.floor(Math.random() * 5)]],
+      ["aria-level", String(Math.floor(Math.random() * 6) + 1)],
+      ["data-hs-cos-general-type", ["widget", "meta", "container"][Math.floor(Math.random() * 3)]],
+      ["draggable", Math.random() > 0.5 ? "true" : "false"]
+    ];
+    const count = 2 + Math.floor(Math.random() * 2);
+    const shuffled = pool.sort(() => Math.random() - 0.5).slice(0, count);
+    for (const [key, val] of shuffled) {
+      if (!attrs[key]) attrs[key] = val;
+    }
+    return attrs;
+  }
+  const xpathCache = /* @__PURE__ */ new WeakMap();
+  let highlightElement = function(element, index, parentIframe = null, isReference = false) {
+    if (!element) return index;
+    const rect = element.getBoundingClientRect();
+    if (!rect) return index;
+    const elementInfo = {
+      tagName: element.tagName.toLowerCase(),
+      className: element.className,
+      id: element.id,
+      href: element.getAttribute("href"),
+      textContent: element.textContent?.trim().substring(0, 50),
+      xpath: getXPathTree(element, true),
+      isReference
+    };
+    let iframeOffsetX = 0;
+    let iframeOffsetY = 0;
+    if (parentIframe) {
+      const iframeRect = parentIframe.getBoundingClientRect();
+      iframeOffsetX = iframeRect.left;
+      iframeOffsetY = iframeRect.top;
+    }
+    const docLeft = rect.left + iframeOffsetX + window.pageXOffset;
+    const docTop = rect.top + iframeOffsetY + window.pageYOffset;
+    window._highlightQueue.push({
+      element,
+      index,
+      rect,
+      docLeft,
+      docTop,
+      parentIframe,
+      elementInfo
+    });
+    return index + 1;
+  };
+  function getElementPosition(currentElement) {
+    if (!currentElement.parentElement) {
+      return 0;
+    }
+    const tagName = currentElement.nodeName.toLowerCase();
+    const siblings = Array.from(currentElement.parentElement.children).filter((sib) => sib.nodeName.toLowerCase() === tagName);
+    if (siblings.length === 1) {
+      return 0;
+    }
+    const index = siblings.indexOf(currentElement) + 1;
+    return index;
+  }
+  function getXPathTree(element, stopAtBoundary = true) {
+    if (xpathCache.has(element)) return xpathCache.get(element);
+    const segments = [];
+    let currentElement = element;
+    while (currentElement && currentElement.nodeType === Node.ELEMENT_NODE) {
+      if (stopAtBoundary && (currentElement.parentNode instanceof ShadowRoot || currentElement.parentNode instanceof HTMLIFrameElement)) {
+        break;
+      }
+      const position = getElementPosition(currentElement);
+      const tagName = currentElement.nodeName.toLowerCase();
+      const xpathIndex = position > 0 ? `[${position}]` : "";
+      segments.unshift(`${tagName}${xpathIndex}`);
+      currentElement = currentElement.parentNode;
+    }
+    const result = segments.join("/");
+    xpathCache.set(element, result);
+    return result;
+  }
+  let isTextNodeVisible = function(textNode) {
+    try {
+      const range = document.createRange();
+      range.selectNodeContents(textNode);
+      const rect = range.getBoundingClientRect();
+      if (rect.width === 0 || rect.height === 0) {
+        return false;
+      }
+      const isInViewport = !(rect.bottom < -viewportExpansion || rect.top > window.innerHeight + viewportExpansion || rect.right < -viewportExpansion || rect.left > window.innerWidth + viewportExpansion) || viewportExpansion === -1;
+      const parentElement = textNode.parentElement;
+      if (!parentElement) return false;
+      try {
+        return isInViewport && parentElement.checkVisibility({
+          checkOpacity: true,
+          checkVisibilityCSS: true
+        });
+      } catch (e) {
+        const style = window.getComputedStyle(parentElement);
+        return isInViewport && style.display !== "none" && style.visibility !== "hidden" && style.opacity !== "0";
+      }
+    } catch (e) {
+      console.warn("Error checking text node visibility:", e);
+      return false;
+    }
+  };
+  function isElementAccepted(element) {
+    if (!element || !element.tagName) return false;
+    const alwaysAccept = /* @__PURE__ */ new Set([
+      "body",
+      "div",
+      "main",
+      "article",
+      "section",
+      "nav",
+      "header",
+      "footer",
+      "g",
+      "svg",
+      "text"
+    ]);
+    const tagName = element.tagName.toLowerCase();
+    if (alwaysAccept.has(tagName)) return true;
+    const leafElementDenyList = /* @__PURE__ */ new Set([
+      "svg",
+      "script",
+      "style",
+      "link",
+      "meta",
+      "noscript",
+      "template"
+    ]);
+    return !leafElementDenyList.has(tagName);
+  }
+  let isElementVisible = function(element) {
+    if (element.tagName.toLowerCase() === "input" && element.hasAttribute("role")) {
+      const style2 = getCachedComputedStyle(element);
+      const isVisible2 = style2 ? style2.display !== "none" && style2.visibility !== "hidden" : false;
+      return isVisible2;
+    }
+    const style = getCachedComputedStyle(element);
+    if (!style) return false;
+    const isVisible = element.offsetWidth > 0 && element.offsetHeight > 0 && style.visibility !== "hidden" && style.display !== "none";
+    if (!isVisible) return false;
+    const submenuWrapper = element.closest(".submenu-wrapper");
+    if (submenuWrapper && !submenuWrapper.classList.contains("slider-in")) {
+      return false;
+    }
+    if (!isElementActuallyClickable(element)) {
+      return false;
+    }
+    if (!isVisible) {
+      return false;
+    }
+    return true;
+  };
+  let isInteractiveElement = function(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const r = (element.getAttribute("role") || "").toLowerCase();
+    if (r === "presentation" || r === "none") {
+      return false;
+    }
+    const tagName1 = element.tagName.toLowerCase();
+    if (tagName1 === "div" || tagName1 === "span") {
+      const inputs = element.querySelectorAll("input, select, textarea");
+      const buttons = element.querySelectorAll("button, a[href], [role='button']");
+      if (inputs.length > 0 && buttons.length === 0) {
+        const hasInteractiveARIA = Array.from(inputs).some(
+          (input) => input.hasAttribute("role") || input.hasAttribute("aria-autocomplete") || input.hasAttribute("aria-haspopup") || input.hasAttribute("aria-expanded")
+        );
+        if (hasInteractiveARIA) {
+          return true;
+        }
+        const hasExplicitAction = element.hasAttribute("onclick") || element.onclick || element.hasAttribute("ng-click") || element.hasAttribute("@click");
+        const hasUniqueRole = element.getAttribute("role") && ["combobox", "radiogroup", "search"].includes(element.getAttribute("role"));
+        if (!hasExplicitAction && !hasUniqueRole) {
+          return false;
+        }
+      }
+    }
+    function doesElementHaveInteractivePointer(element2) {
+      if (element2.tagName.toLowerCase() === "html") return false;
+      const style = window.getComputedStyle(element2);
+      let interactiveCursors = ["pointer", "move", "text", "grab", "cell"];
+      if (interactiveCursors.includes(style.cursor)) return true;
+      return false;
+    }
+    let isInteractiveCursor = doesElementHaveInteractivePointer(element);
+    if (isInteractiveCursor) {
+      return true;
+    }
+    if (element.tagName.toLowerCase() === "div" && element.querySelector(":scope > input[role='combobox'], :scope > input[aria-autocomplete='list'], :scope > input[type='file']")) {
+      return true;
+    }
+    if (element.tagName.toLowerCase() === "input" && element.type === "checkbox") {
+      return true;
+    }
+    const isCookieBannerElement = typeof element.closest === "function" && (element.closest('[id*="onetrust"]') || element.closest('[class*="onetrust"]') || element.closest('[data-nosnippet="true"]') || element.closest('[aria-label*="cookie"]'));
+    if (isCookieBannerElement) {
+      if (element.tagName.toLowerCase() === "button" || element.getAttribute("role") === "button" || element.onclick || element.getAttribute("onclick") || element.classList && (element.classList.contains("ot-sdk-button") || element.classList.contains("accept-button") || element.classList.contains("reject-button")) || element.getAttribute("aria-label")?.toLowerCase().includes("accept") || element.getAttribute("aria-label")?.toLowerCase().includes("reject")) {
+        return true;
+      }
+    }
+    const interactiveElements = /* @__PURE__ */ new Set([
+      "a",
+      "button",
+      "details",
+      "embed",
+      "input",
+      "menu",
+      "menuitem",
+      "object",
+      "select",
+      "textarea",
+      "canvas",
+      "summary",
+      "dialog",
+      "banner"
+    ]);
+    const interactiveRoles = /* @__PURE__ */ new Set(["button-icon", "dialog", "button-text-icon-only", "treeitem", "alert", "grid", "progressbar", "radio", "checkbox", "menuitem", "option", "switch", "dropdown", "scrollbar", "combobox", "a-button-text", "button", "region", "textbox", "tabpanel", "tab", "click", "button-text", "spinbutton", "a-button-inner", "link", "menu", "slider", "listbox", "a-dropdown-button", "button-icon-only", "searchbox", "menuitemradio", "tooltip", "tree", "menuitemcheckbox"]);
+    const tagName = element.tagName.toLowerCase();
+    const role = element.getAttribute("role");
+    const ariaRole = element.getAttribute("aria-role");
+    const tabIndex = element.getAttribute("tabindex");
+    const hasAddressInputClass = element.classList && (element.classList.contains("address-input__container__input") || element.classList.contains("nav-btn") || element.classList.contains("pull-left"));
+    if (tagName === "img" || tagName === "svg") {
+      const hasOwnAction = element.hasAttribute("onclick") || typeof element.onclick === "function" || element.hasAttribute("tabindex") || element.closest('a, button, [role="button"]') === element;
+      if (!hasOwnAction) return false;
+    }
+    if (tagName === "div" && (role === "menu" || role === "menuitem") && !element.hasAttribute("onclick") && !element.getAttribute("onclick") && !element.hasAttribute("ng-click") && !element.hasAttribute("@click") && !element.hasAttribute("v-on:click") && !element.hasAttribute("tabindex") && Object.keys(getEventListeners(element) || {}).length === 0) {
+      return false;
+    }
+    if (element.tagName.toLowerCase() === "div" && element.getAttribute("role") === "tabpanel") {
+      return false;
+    }
+    if (element.classList && (element.classList.contains("button") || element.classList.contains("dropdown-toggle") || element.getAttribute("data-index") || element.getAttribute("data-toggle") === "dropdown" || element.getAttribute("aria-haspopup") === "true")) {
+      return true;
+    }
+    if (element.classList) {
+      const hasInteractiveClass = Array.from(element.classList).some(
+        (cls) => cls.toLowerCase().includes("selectable") || cls.toLowerCase().includes("clickable") || cls.toLowerCase().includes("interactive")
+      );
+      if (hasInteractiveClass) {
+        return true;
+      }
+    }
+    if (element.hasAttribute("data-href") || element.hasAttribute("data-url") || element.hasAttribute("data-link") || element.hasAttribute("data-action")) {
+      return true;
+    }
+    if (tagName === "div" && element.classList.contains("item") && element.closest(".listItem") && element.textContent.trim().length > 0) {
+      return true;
+    }
+    const hasInteractiveRole = hasAddressInputClass || interactiveElements.has(tagName) || interactiveRoles.has(role) || interactiveRoles.has(ariaRole) || tabIndex !== null && tabIndex !== "-1" && element.parentElement?.tagName.toLowerCase() !== "body" || element.getAttribute("data-action") === "a-dropdown-select" || element.getAttribute("data-action") === "a-dropdown-button";
+    if (hasInteractiveRole) return true;
+    const isCookieBanner = element.id?.toString().toLowerCase().includes("cookie") || element.id?.toString().toLowerCase().includes("consent") || element.id?.toString().toLowerCase().includes("notice") || element.classList && (element.classList.contains("otCenterRounded") || element.classList.contains("ot-sdk-container")) || element.getAttribute("data-nosnippet") === "true" || element.getAttribute("aria-label")?.toString().toLowerCase().includes("cookie") || element.getAttribute("aria-label")?.toString().toLowerCase().includes("consent") || element.tagName.toLowerCase() === "div" && (element.id?.toString().toLowerCase().includes("onetrust") || element.classList && (element.classList.contains("onetrust") || element.classList.contains("cookie") || element.classList.contains("consent")));
+    if (isCookieBanner) return true;
+    const isInCookieBanner = typeof element.closest === "function" && element.closest(
+      '[id*="cookie"],[id*="consent"],[class*="cookie"],[class*="consent"],[id*="onetrust"]'
+    );
+    if (isInCookieBanner && (element.tagName.toLowerCase() === "button" || element.getAttribute("role") === "button" || element.classList && element.classList.contains("button") || element.onclick || element.getAttribute("onclick"))) {
+      return true;
+    }
+    const hasClickHandler = element.onclick !== null || element.getAttribute("onclick") !== null || element.hasAttribute("ng-click") || element.hasAttribute("@click") || element.hasAttribute("v-on:click");
+    function getEventListeners(el) {
+      try {
+        return window.getEventListeners?.(el) || {};
+      } catch (e) {
+        const listeners2 = {};
+        const eventTypes = [
+          "click",
+          "mousedown",
+          "mouseup",
+          "touchstart",
+          "touchend",
+          "keydown",
+          "keyup",
+          "focus",
+          "blur"
+        ];
+        for (const type of eventTypes) {
+          const handler = el[`on${type}`];
+          if (handler) {
+            listeners2[type] = [{ listener: handler, useCapture: false }];
+          }
+        }
+        return listeners2;
+      }
+    }
+    const listeners = getEventListeners(element);
+    const hasClickListeners = !!(listeners && (listeners.click?.length > 0 || listeners.mousedown?.length > 0 || listeners.mouseup?.length > 0 || listeners.touchstart?.length > 0 || listeners.touchend?.length > 0));
+    const hasAriaProps = element.hasAttribute("aria-expanded") || element.hasAttribute("aria-pressed") || element.hasAttribute("aria-selected") || element.hasAttribute("aria-checked");
+    const isContentEditable = !!(element.getAttribute("contenteditable") === "true" || element.isContentEditable || element.id === "tinymce" || element.classList.contains("mce-content-body") || element.tagName.toLowerCase() === "body" && element.getAttribute("data-id")?.startsWith("mce_"));
+    const isDraggable = element.draggable || element.getAttribute("draggable") === "true";
+    if (element.tagName.toLowerCase() === "div" && element.classList.contains("item") && element.querySelectorAll("a, button, input, select, textarea, [role], [onclick], [tabindex]").length > 0) {
+      return false;
+    }
+    const tag = element.tagName.toLowerCase();
+    if ((tag === "div" || tag === "main") && !element.hasAttribute("onclick") && !element.hasAttribute("role") && !element.hasAttribute("tabindex") && !element.isContentEditable && element.getAttribute("contenteditable") !== "true" && [...element.attributes].filter((attr) => attr.name.startsWith("aria-")).length === 0 && !Array.from(element.classList).some(
+      (cls) => cls.includes("clickable") || cls.includes("menu") || cls.includes("interactive") || cls.includes("item")
+    ) && !Array.from(element.children).some(
+      (child) => child.matches?.("svg, use, .icon, .menu-item-name, .app-icon") || child.tagName === "DIV" && child.textContent.trim().length > 0
+    )) {
+      return false;
+    }
+    const containerIds = ["root", "app", "main-container", "app-container"];
+    const containerClasses = ["main-wrapper", "page-container", "app-root"];
+    if (containerIds.includes(element.id?.toLowerCase()) || Array.from(element.classList).some((cls) => containerClasses.includes(cls.toLowerCase()))) {
+      return false;
+    }
+    if (tagName === "option" && !element.disabled) {
+      return true;
+    }
+    if (element.tagName.toLowerCase() === "td" && element.classList.contains("virtual-folder-option") && (element.classList.contains("selected-virtual-folder") || element.classList.contains("btn-primary") || element.classList.contains("with-folder-icon") || element.classList.contains("virtual-folder-filter"))) {
+      return true;
+    }
+    return hasAriaProps || hasClickHandler || hasClickListeners || isDraggable || isContentEditable;
+  };
+  function isReferenceElement(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const tagName = element.tagName.toLowerCase();
+    const textContent = element.textContent?.trim() || "";
+    if (textContent.length < 3) {
+      return false;
+    }
+    const directText = Array.from(element.childNodes).filter((node) => node.nodeType === Node.TEXT_NODE).map((node) => (node.textContent || "").trim()).join(" ");
+    if (directText.length >= 3) {
+      return true;
+    }
+    const role = element.getAttribute("role");
+    const classList = Array.from(element.classList || []);
+    if (["h1", "h2", "h3", "h4", "h5", "h6"].includes(tagName)) {
+      return true;
+    }
+    if (tagName === "th" || tagName === "caption") {
+      return true;
+    }
+    if (tagName === "text") {
+      return true;
+    }
+    if (role === "alert" || role === "status") {
+      return true;
+    }
+    if (element.hasAttribute("data-testid") || element.hasAttribute("data-test") || element.hasAttribute("data-cy")) {
+      return true;
+    }
+    if (role === "navigation" && element.getAttribute("aria-label")?.toLowerCase().includes("breadcrumb")) {
+      return true;
+    }
+    return false;
+  }
+  function isInsideScrollableContainer(el) {
+    let parent = el.parentElement;
+    while (parent && parent !== document.body) {
+      const style = getCachedComputedStyle(parent);
+      if (!style) {
+        parent = parent.parentElement;
+        continue;
+      }
+      const overflowY = style.overflowY;
+      const overflowX = style.overflowX;
+      const height = parent.offsetHeight;
+      const scrollableContent = parent.scrollHeight > parent.clientHeight;
+      const classList = Array.from(parent.classList);
+      const isVerticallyScrollable = overflowY === "auto" || overflowY === "scroll" || scrollableContent;
+      const isLikelySidebar = classList.some(
+        (cls) => cls.toLowerCase().includes("menu") || cls.toLowerCase().includes("sidebar") || cls.toLowerCase().includes("nav")
+      );
+      if (isVerticallyScrollable && height > 150 && (isLikelySidebar || scrollableContent) && overflowX !== "scroll") {
+        return true;
+      }
+      parent = parent.parentElement;
+    }
+    return false;
+  }
+  let isTopElement = function(element) {
+    const rect = getCachedBoundingRect(element);
+    if (!rect) return false;
+    const tagName = element.tagName.toLowerCase();
+    if (tagName === "div" && element.querySelector(":scope > input[role='combobox'], :scope > input[aria-autocomplete='list'], :scope > input[type='file']")) {
+      return true;
+    }
+    const isInViewport = rect.left < window.innerWidth && rect.right > 0 && rect.top < window.innerHeight && rect.bottom > 0;
+    if (!isInViewport) {
+      return true;
+    }
+    let doc = element.ownerDocument;
+    if (doc !== window.document) {
+      return true;
+    }
+    const shadowRoot = element.getRootNode();
+    if (shadowRoot instanceof ShadowRoot) {
+      const centerX2 = rect.left + rect.width / 2;
+      const centerY2 = rect.top + rect.height / 2;
+      try {
+        const topEl = measureDomOperation(
+          () => shadowRoot.elementFromPoint(centerX2, centerY2),
+          "elementFromPoint"
+        );
+        if (!topEl) return false;
+        let current = topEl;
+        while (current && current !== shadowRoot) {
+          if (current === element) return true;
+          current = current.parentElement;
+        }
+        return false;
+      } catch (e) {
+        return true;
+      }
+    }
+    if (isInsideScrollableContainer(element)) {
+      return true;
+    }
+    const centerX = rect.left + rect.width / 2;
+    const centerY = rect.top + rect.height / 2;
+    try {
+      const topEl = document.elementFromPoint(centerX, centerY);
+      if (!topEl) return false;
+      let current = topEl;
+      while (current && current !== document.documentElement) {
+        if (current === element) return true;
+        current = current.parentElement;
+      }
+      return false;
+    } catch (e) {
+      return true;
+    }
+  };
+  let isInExpandedViewport = function(element, viewportExpansion2) {
+    if (viewportExpansion2 === -1) {
+      return true;
+    }
+    const rect = getCachedBoundingRect(element);
+    const style = getCachedComputedStyle(element);
+    if (style?.position === "fixed") {
+      return true;
+    }
+    let parent = element.parentElement;
+    while (parent && parent !== document.body) {
+      const parentStyle = getCachedComputedStyle(parent);
+      if (parentStyle?.position === "fixed") {
+        return true;
+      }
+      parent = parent.parentElement;
+    }
+    return !(rect.bottom < -viewportExpansion2 || rect.top > window.innerHeight + viewportExpansion2 || rect.right < -viewportExpansion2 || rect.left > window.innerWidth + viewportExpansion2);
+  };
+  let getEffectiveScroll = function(element) {
+    let currentEl = element;
+    let scrollX = 0;
+    let scrollY = 0;
+    return measureDomOperation(() => {
+      while (currentEl && currentEl !== document.documentElement) {
+        if (currentEl.scrollLeft || currentEl.scrollTop) {
+          scrollX += currentEl.scrollLeft;
+          scrollY += currentEl.scrollTop;
+        }
+        currentEl = currentEl.parentElement;
+      }
+      scrollX += window.scrollX;
+      scrollY += window.scrollY;
+      return { scrollX, scrollY };
+    }, "scrollOperations");
+  };
+  function isElementDistinctInteraction(element) {
+    if (!element || element.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const tagName = element.tagName.toLowerCase();
+    const role = element.getAttribute("role");
+    if (tagName === "input" && (role === "combobox" || role === "searchbox" || role === "listbox")) {
+      return true;
+    }
+    if (tagName === "button") {
+      return true;
+    }
+    if (tagName === "a" && element.hasAttribute("href")) {
+      return true;
+    }
+    if (["input", "select", "textarea"].includes(tagName)) {
+      return true;
+    }
+    if (tagName === "li") {
+      const parentList = element.closest("ul, ol");
+      if (parentList) {
+        const parentRole = parentList.getAttribute("role");
+        if (parentRole && ["tree", "menu", "listbox", "tablist", "radiogroup", "grid"].includes(parentRole)) {
+          return true;
+        }
+      }
+      if (role) {
+        return true;
+      }
+    }
+    if (tagName === "div" || tagName === "span") {
+      const hasARIAInput = element.querySelector(
+        ":scope > input[role='combobox'], :scope > * > input[role='combobox'], :scope > * > * > input[role='combobox'], :scope > input[aria-autocomplete='list'], :scope > * > input[aria-autocomplete='list'], :scope > input[type='file'], :scope > * > input[type='file']"
+      );
+      if (hasARIAInput) {
+        const parent2 = element.parentElement;
+        if (parent2 && (parent2.tagName.toLowerCase() === "div" || parent2.tagName.toLowerCase() === "span")) {
+          const parentHasInput = parent2.querySelector(
+            ":scope > input[role='combobox'], :scope > * > input[role='combobox'], :scope > * > * > input[role='combobox']"
+          );
+          if (parentHasInput === hasARIAInput) {
+            return false;
+          }
+        }
+        return true;
+      }
+    }
+    if (tagName === "i" || tagName === "svg") {
+      const style = window.getComputedStyle(element);
+      const parent2 = element.parentElement;
+      const hasDataToggle = element.hasAttribute("data-toggle") || element.hasAttribute("data-target");
+      const hasInteractiveClassIcon = element.classList.contains("selectable") || element.classList.contains("collapsed") || element.classList.contains("clickable");
+      const hasClickHandlerIcon = element.hasAttribute("onclick") || parent2?.hasAttribute("onclick") || element.onclick !== null;
+      if (hasDataToggle || hasInteractiveClassIcon || hasClickHandlerIcon) {
+        return true;
+      }
+      const hasPointerCursor = style.cursor === "pointer";
+      if (!hasPointerCursor) return false;
+      const hasInteractiveClass = parent2?.classList.contains("reset-link") || parent2?.classList.contains("clickable-icon") || parent2?.classList.contains("btn") || parent2?.classList.contains("button");
+      const hasClickHandler = element.hasAttribute("onclick") || parent2?.hasAttribute("onclick") || element.onclick !== null;
+      const hasTooltip = element.hasAttribute("ngbtooltip") || element.hasAttribute("title") || element.hasAttribute("aria-label");
+      if (hasPointerCursor && (hasInteractiveClass || hasClickHandler || hasTooltip)) {
+        return true;
+      }
+      return false;
+    }
+    if (tagName === "div" && element.querySelector(":scope > input[role='combobox'], :scope > input[aria-autocomplete='list'], :scope > input[type='file']")) {
+      return true;
+    }
+    if (tagName === "iframe") {
+      return true;
+    }
+    if (tagName === "div" || tagName === "span") {
+      const style = window.getComputedStyle(element);
+      if (style.cursor === "pointer") {
+        const hasContent = element.textContent.trim().length > 0;
+        const rect = element.getBoundingClientRect();
+        const hasReasonableSize = rect.width > 30 && rect.height > 20;
+        if (hasContent && hasReasonableSize) {
+          return true;
+        }
+      }
+    }
+    const parent = element.parentElement;
+    if (parent && parent !== document.body) {
+      const parentStyle = window.getComputedStyle(parent);
+      const parentIsInteractive = parentStyle.cursor === "pointer" || parent.hasAttribute("onclick") || parent.onclick !== null || parent.hasAttribute("tabindex") && parent.getAttribute("tabindex") !== "-1";
+      if (parentIsInteractive) {
+        const interactiveChildren = Array.from(parent.children).filter((child) => {
+          const childTag = child.tagName.toLowerCase();
+          const childRole = child.getAttribute("role");
+          const isInteractiveIcon = (childTag === "i" || childTag === "svg") && window.getComputedStyle(child).cursor === "pointer";
+          return childTag === "button" || childTag === "a" || childTag === "input" || childTag === "select" || childTag === "textarea" || childRole && ["button", "link", "menuitem"].includes(childRole) || child.hasAttribute("onclick") || child.onclick !== null || isInteractiveIcon;
+        });
+        if (interactiveChildren.length === 1 && interactiveChildren[0] === element) {
+          const hasUniqueAction = element.hasAttribute("onclick") || element.onclick !== null || element.hasAttribute("ng-click") || element.hasAttribute("@click") || element.hasAttribute("v-on:click") || tagName === "a" && element.hasAttribute("href") && element.getAttribute("href") !== "javascript:void(0)" && element.getAttribute("href") !== "#" || (tagName === "i" || tagName === "svg") && window.getComputedStyle(element).cursor === "pointer" && (element.hasAttribute("onclick") || element.hasAttribute("ngbtooltip") || element.parentElement?.classList.contains("reset-link"));
+          if (!hasUniqueAction) {
+            return false;
+          }
+        }
+      }
+    }
+    if (DISTINCT_INTERACTIVE_TAGS.has(tagName)) {
+      return true;
+    }
+    if (role && INTERACTIVE_ROLES.has(role)) {
+      return true;
+    }
+    if (element.isContentEditable || element.getAttribute("contenteditable") === "true") {
+      return true;
+    }
+    if (element.hasAttribute("data-testid") || element.hasAttribute("data-cy") || element.hasAttribute("data-test")) {
+      return true;
+    }
+    if (element.hasAttribute("onclick") || typeof element.onclick === "function") {
+      return true;
+    }
+    try {
+      if (typeof window.getEventListeners === "function") {
+        const listeners = window.getEventListeners(element);
+        const interactionEvents = ["mousedown", "mouseup", "keydown", "keyup", "submit", "change", "input", "focus", "blur"];
+        for (const eventType of interactionEvents) {
+          if (listeners[eventType] && listeners[eventType].length > 0) {
+            return true;
+          }
+        }
+      } else {
+        const commonEventAttrs = ["onmousedown", "onmouseup", "onkeydown", "onkeyup", "onsubmit", "onchange", "oninput", "onfocus", "onblur"];
+        if (commonEventAttrs.some((attr) => element.hasAttribute(attr))) {
+          return true;
+        }
+      }
+    } catch (e) {
+    }
+    return false;
+  }
+  function handleHighlighting(nodeData, node, parentIframe, isParentHighlighted) {
+    const tag = node.tagName.toLowerCase();
+    const id = node.id || "";
+    const cls = (node.className || "").toString().slice(0, 150);
+    if (!nodeData.isInteractive) {
+      return false;
+    }
+    if (tag === "div" || tag === "span") {
+      const directInputs = Array.from(node.children).filter(
+        (child) => ["input", "textarea", "select"].includes(child.tagName.toLowerCase())
+      );
+      if (directInputs.length > 0) {
+        const hasVisibleInput = directInputs.some((input) => {
+          try {
+            const inputStyle = window.getComputedStyle(input);
+            const inputRect = input.getBoundingClientRect();
+            return inputStyle.display !== "none" && inputStyle.visibility !== "hidden" && parseFloat(inputStyle.opacity) > 0 && inputRect.width > 0 && inputRect.height > 0;
+          } catch (e) {
+            return false;
+          }
+        });
+        if (hasVisibleInput) {
+          return false;
+        } else {
+        }
+      }
+    }
+    if (isParentHighlighted && node.tagName.toLowerCase() === "input") {
+      isParentHighlighted = false;
+    }
+    if (tag === "div" && node.getAttribute("role") === "dialog" && node.classList.contains("b-sidebar")) {
+      return false;
+    }
+    let shouldHighlight = false;
+    if (!isParentHighlighted) {
+      shouldHighlight = true;
+    } else if (isElementDistinctInteraction(node)) {
+      shouldHighlight = true;
+    }
+    if (shouldHighlight) {
+      nodeData.isInViewport = isInExpandedViewport(node, viewportExpansion);
+      if (nodeData.isInViewport) {
+        const rect = node.getBoundingClientRect();
+        console.log(`[handleHighlighting] rect={x:${rect.x.toFixed(1)}, y:${rect.y.toFixed(1)}, w:${rect.width.toFixed(1)}, h:${rect.height.toFixed(1)}}`);
+        if (rect.width < 5 || rect.height < 5) {
+          if (!(node.tagName.toLowerCase() === "input" && node.hasAttribute("role"))) {
+            return false;
+          }
+        }
+        const isInCurrentViewport = rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+        if (!isInCurrentViewport && viewportExpansion === 0) {
+          return false;
+        }
+        try {
+          const style = window.getComputedStyle(node);
+          const opacity = parseFloat(style.opacity);
+          const visibility = style.visibility;
+          const display = style.display;
+          if (opacity === 0) {
+            if (!(node.tagName.toLowerCase() === "input" && node.hasAttribute("role"))) {
+              return false;
+            }
+          }
+        } catch (e) {
+          return false;
+        }
+        nodeData.highlightIndex = highlightIndex++;
+        if (doHighlightElements) {
+          if (focusHighlightIndex >= 0) {
+            if (focusHighlightIndex === nodeData.highlightIndex) {
+              highlightElement(node, nodeData.highlightIndex, parentIframe, false);
+            } else {
+            }
+          } else {
+            highlightElement(node, nodeData.highlightIndex, parentIframe, false);
+          }
+          return true;
+        } else {
+        }
+      } else {
+      }
+    } else {
+    }
+    return false;
+  }
+  const DISTINCT_INTERACTIVE_TAGS = /* @__PURE__ */ new Set([
+    "a",
+    "button",
+    "input",
+    "select",
+    "textarea",
+    "summary",
+    "details",
+    "label",
+    "option"
+  ]);
+  const INTERACTIVE_ROLES = /* @__PURE__ */ new Set([
+    "button",
+    "link",
+    "menuitem",
+    "menuitemradio",
+    "menuitemcheckbox",
+    "radio",
+    "checkbox",
+    "tab",
+    "switch",
+    "slider",
+    "spinbutton",
+    "combobox",
+    "searchbox",
+    "textbox",
+    "listbox",
+    "option",
+    "scrollbar"
+  ]);
+  function isNodeEffectivelyHidden(node) {
+    if (!node || node.nodeType !== Node.ELEMENT_NODE) return false;
+    if (node.tagName?.toLowerCase() === "input" && node.hasAttribute("role")) {
+      const style2 = window.getComputedStyle(node);
+      if (style2.display === "none" || style2.visibility === "hidden") {
+        return true;
+      }
+      return false;
+    }
+    if (node.shadowRoot) {
+      console.log("Keeping element with shadow root:", node.tagName);
+      return false;
+    }
+    const tagName = node.tagName.toLowerCase();
+    console.log("Checking tagName:", tagName, "includes dash?", tagName.includes("-"));
+    if (tagName.includes("-")) {
+      console.log("Keeping custom element (web component):", node.tagName);
+      return false;
+    }
+    const rect = node.getBoundingClientRect();
+    const style = window.getComputedStyle(node);
+    const isZeroSize = rect.width === 0 || rect.height === 0;
+    const isFullyTransparent = parseFloat(style.opacity) === 0;
+    const isDisplayNone = style.display === "none";
+    const isVisibilityHidden = style.visibility === "hidden";
+    const isPointerNone = style.pointerEvents === "none";
+    const role = (node.getAttribute("role") || "").toLowerCase();
+    const isModalOrOverlay = role === "dialog" || role === "alertdialog" || node.hasAttribute("aria-modal") || style.position === "fixed" && parseInt(String(style.zIndex || 0)) > 1e3;
+    if (isModalOrOverlay && isPointerNone) {
+      const hasVisibleChild = Array.from(node.querySelectorAll("*")).some((child) => {
+        try {
+          const cs = getComputedStyle(child);
+          const r = child.getBoundingClientRect();
+          return r.width > 0 && r.height > 0 && parseFloat(cs.opacity) > 0 && cs.visibility !== "hidden" && cs.display !== "none";
+        } catch {
+          return false;
+        }
+      });
+      if (hasVisibleChild) return false;
+    }
+    if (isDisplayNone || isVisibilityHidden || isFullyTransparent) return true;
+    if (isZeroSize) {
+      const hasVisibleDescendant = Array.from(node.querySelectorAll("*")).some((el) => {
+        const s = getComputedStyle(el);
+        const r = el.getBoundingClientRect();
+        return r.width > 0 && r.height > 0 && parseFloat(s.opacity) > 0 && s.display !== "none" && s.visibility !== "hidden";
+      });
+      if (hasVisibleDescendant) return false;
+      return true;
+    }
+    return false;
+  }
+  function buildDomTree(node, parentIframe = null, isParentHighlighted = false) {
+    if (debugMode) PERF_METRICS.nodeMetrics.totalNodes++;
+    if (!node || node.id === HIGHLIGHT_CONTAINER_ID) {
+      if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+      return null;
+    }
+    if (node.nodeType === Node.ELEMENT_NODE && node !== document.body) {
+      try {
+        if (isNodeEffectivelyHidden(node)) {
+          if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+          return null;
+        }
+      } catch {
+        if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+        return null;
+      }
+    }
+    let nodeWasHighlighted = false;
+    if (node === document.body) {
+      const nodeData2 = {
+        tagName: "body",
+        attributes: {},
+        xpath: "/body",
+        children: []
+      };
+      nodeData2.isVisible = isElementVisible(node);
+      nodeData2.isTopElement = nodeData2.isVisible ? isTopElement(node) : false;
+      nodeData2.isInteractive = false;
+      nodeWasHighlighted = false;
+      for (const child of node.childNodes) {
+        const domElement = buildDomTree(child, parentIframe, false);
+        if (domElement) nodeData2.children.push(domElement);
+      }
+      const id2 = `${ID.current++}`;
+      DOM_HASH_MAP[id2] = nodeData2;
+      if (debugMode) PERF_METRICS.nodeMetrics.processedNodes++;
+      return id2;
+    }
+    if (node.nodeType !== Node.ELEMENT_NODE && node.nodeType !== Node.TEXT_NODE) {
+      if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+      return null;
+    }
+    if (node.nodeType === Node.TEXT_NODE) {
+      const textContent = (node.textContent || "").trim();
+      if (!textContent) {
+        if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+        return null;
+      }
+      const parentElement = node.parentElement;
+      if (!parentElement || parentElement.tagName.toLowerCase() === "script") {
+        if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+        return null;
+      }
+      const id2 = `${ID.current++}`;
+      DOM_HASH_MAP[id2] = {
+        type: "TEXT_NODE",
+        text: textContent,
+        isVisible: isTextNodeVisible(node)
+      };
+      if (debugMode) PERF_METRICS.nodeMetrics.processedNodes++;
+      return id2;
+    }
+    if (node.nodeType === Node.ELEMENT_NODE && !isElementAccepted(node)) {
+      if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+      return null;
+    }
+    if (viewportExpansion !== -1) {
+      const isModalRelated = node.classList?.contains("ant-modal-root") || node.classList?.contains("ant-modal-wrap") || node.classList?.contains("ant-modal") || node.getAttribute("role") === "dialog" || node.getAttribute("role") === "alertdialog" || node.querySelector && node.querySelector('.ant-modal, .ant-modal-wrap, [role="dialog"]');
+      if (!isModalRelated) {
+        const rect = getCachedBoundingRect(node);
+        if (!rect) return null;
+        const isInViewport = !(rect.bottom < -viewportExpansion || rect.top > window.innerHeight + viewportExpansion || rect.right < -viewportExpansion || rect.left > window.innerWidth + viewportExpansion);
+        if (!isInViewport) return null;
+      }
+    }
+    const nodeData = {
+      tagName: node.tagName.toLowerCase(),
+      attributes: {},
+      xpath: getXPathTree(node, true),
+      children: []
+    };
+    const attributeNames = node.getAttributeNames?.() || [];
+    for (const name of attributeNames) {
+      nodeData.attributes[name] = (node.getAttribute(name) || "").trim();
+    }
+    collectStructuralNode(node, nodeData);
+    if (nodeData.attributes) {
+      normalizeAttributes(nodeData.attributes);
+    }
+    if (node.nodeType === Node.ELEMENT_NODE && node !== document.body) {
+      nodeData.isVisible = isElementVisible(node);
+      if (nodeData.isVisible) {
+        nodeData.isTopElement = isTopElement(node);
+        if (nodeData.isTopElement) {
+          nodeData.isInteractive = isInteractiveElement(node);
+          if (nodeData.isInteractive) {
+            console.log("[DETECTADO] Interactive Element:", node.tagName, node.getAttribute("aria-label") || "", node.className);
+            nodeWasHighlighted = handleHighlighting(nodeData, node, parentIframe, isParentHighlighted);
+            const rect = getCachedBoundingRect(node);
+            if (rect) {
+              nodeData.viewportCoordinates = {
+                x: rect.left,
+                y: rect.top,
+                width: rect.width,
+                height: rect.height
+              };
+              const scroll = getEffectiveScroll(node);
+              nodeData.pageCoordinates = {
+                x: rect.left + scroll.scrollX,
+                y: rect.top + scroll.scrollY,
+                width: rect.width,
+                height: rect.height
+              };
+            }
+            getInteractiveNode(node, nodeData);
+          }
+        }
+      }
+      if (!nodeData.isInteractive) {
+        nodeData.isReference = isReferenceElement(node);
+        if (nodeData.isReference && !isUnderModalOrOverlay(node)) {
+          console.log("[DETECTADO] Reference Element:", node.tagName, node.textContent?.trim().substring(0, 30) || "", node.className);
+          nodeData.highlightIndex = highlightIndex++;
+          if (doHighlightElements) {
+            highlightElement(node, nodeData.highlightIndex, parentIframe, true);
+          }
+          const rect = getCachedBoundingRect(node);
+          if (rect) {
+            nodeData.viewportCoordinates = {
+              x: rect.left,
+              y: rect.top,
+              width: rect.width,
+              height: rect.height
+            };
+            const scroll = getEffectiveScroll(node);
+            nodeData.pageCoordinates = {
+              x: rect.left + scroll.scrollX,
+              y: rect.top + scroll.scrollY,
+              width: rect.width,
+              height: rect.height
+            };
+          }
+        }
+      }
+    }
+    if (node.tagName) {
+      const tagName = node.tagName.toLowerCase();
+      if (tagName === "iframe") {
+        try {
+          const iframeDoc = node.contentDocument || node.contentWindow?.document;
+          if (iframeDoc) {
+            for (const child of iframeDoc.childNodes) {
+              const domElement = buildDomTree(child, node);
+              if (domElement) nodeData.children.push(domElement);
+            }
+          }
+        } catch (e) {
+          console.warn("Unable to access iframe:", e);
+        }
+      } else if (node.isContentEditable || node.getAttribute("contenteditable") === "true" || node.id === "tinymce" || node.classList.contains("mce-content-body") || tagName === "body" && node.getAttribute("data-id")?.startsWith("mce_")) {
+        for (const child of node.childNodes) {
+          const domElement = buildDomTree(child, parentIframe, nodeWasHighlighted || isParentHighlighted);
+          if (domElement) nodeData.children.push(domElement);
+        }
+      } else {
+        if (node.shadowRoot) {
+          nodeData.shadowRoot = true;
+          for (const child of node.shadowRoot.childNodes) {
+            const domElement = buildDomTree(child, parentIframe, nodeWasHighlighted || isParentHighlighted);
+            if (domElement) nodeData.children.push(domElement);
+          }
+        }
+        for (const child of node.childNodes) {
+          const domElement = buildDomTree(child, parentIframe, nodeWasHighlighted || isParentHighlighted);
+          if (domElement) nodeData.children.push(domElement);
+        }
+      }
+    }
+    if (nodeData.tagName === "a" && nodeData.children.length === 0 && !nodeData.attributes.href) {
+      if (debugMode) PERF_METRICS.nodeMetrics.skippedNodes++;
+      return null;
+    }
+    const id = `${ID.current++}`;
+    DOM_HASH_MAP[id] = nodeData;
+    if (debugMode) PERF_METRICS.nodeMetrics.processedNodes++;
+    return id;
+  }
+  highlightElement = measureTime(highlightElement);
+  isInteractiveElement = measureTime(isInteractiveElement);
+  isElementVisible = measureTime(isElementVisible);
+  isTopElement = measureTime(isTopElement);
+  isInExpandedViewport = measureTime(isInExpandedViewport);
+  isTextNodeVisible = measureTime(isTextNodeVisible);
+  getEffectiveScroll = measureTime(getEffectiveScroll);
+  const rootId = buildDomTree(document.body, null, false);
+  if (_structuralElements.length > 0) {
+    const highlightedEntries = Object.entries(DOM_HASH_MAP).filter(([_, node]) => node.highlightIndex !== void 0 && node.highlightIndex >= 0).map(([id, node]) => ({ id, node }));
+    highlightedEntries.sort((a, b) => (a.node.highlightIndex ?? 0) - (b.node.highlightIndex ?? 0));
+    for (const el of _structuralElements) {
+      normalizeAttributes(el.attributes);
+      const newId = `${ID.current++}`;
+      const newEntry = { id: newId, node: el };
+      const randomIndex = Math.floor(Math.random() * (highlightedEntries.length + 1));
+      highlightedEntries.splice(randomIndex, 0, newEntry);
+    }
+    highlightedEntries.forEach((entry, index) => {
+      entry.node.highlightIndex = index;
+      DOM_HASH_MAP[entry.id] = entry.node;
+    });
+  }
+  DOM_CACHE.clearCache();
+  if (debugMode && PERF_METRICS) {
+    Object.keys(PERF_METRICS.timings).forEach((key) => {
+      PERF_METRICS.timings[key] = PERF_METRICS.timings[key] / 1e3;
+    });
+    Object.keys(PERF_METRICS.buildDomTreeBreakdown).forEach((key) => {
+      if (typeof PERF_METRICS.buildDomTreeBreakdown[key] === "number") {
+        PERF_METRICS.buildDomTreeBreakdown[key] = PERF_METRICS.buildDomTreeBreakdown[key] / 1e3;
+      }
+    });
+    if (PERF_METRICS.buildDomTreeBreakdown.buildDomTreeCalls > 0) {
+      PERF_METRICS.buildDomTreeBreakdown.averageTimePerNode = PERF_METRICS.buildDomTreeBreakdown.totalTime / PERF_METRICS.buildDomTreeBreakdown.buildDomTreeCalls;
+    }
+    PERF_METRICS.buildDomTreeBreakdown.timeInChildCalls = PERF_METRICS.buildDomTreeBreakdown.totalTime - PERF_METRICS.buildDomTreeBreakdown.totalSelfTime;
+    Object.keys(PERF_METRICS.buildDomTreeBreakdown.domOperations).forEach((op) => {
+      const time = PERF_METRICS.buildDomTreeBreakdown.domOperations[op];
+      const count = PERF_METRICS.buildDomTreeBreakdown.domOperationCounts[op];
+      if (count > 0) {
+        PERF_METRICS.buildDomTreeBreakdown.domOperations[`${op}Average`] = time / count;
+      }
+    });
+    const boundingRectTotal = PERF_METRICS.cacheMetrics.boundingRectCacheHits + PERF_METRICS.cacheMetrics.boundingRectCacheMisses;
+    const computedStyleTotal = PERF_METRICS.cacheMetrics.computedStyleCacheHits + PERF_METRICS.cacheMetrics.computedStyleCacheMisses;
+    if (boundingRectTotal > 0) {
+      PERF_METRICS.cacheMetrics.boundingRectHitRate = PERF_METRICS.cacheMetrics.boundingRectCacheHits / boundingRectTotal;
+    }
+    if (computedStyleTotal > 0) {
+      PERF_METRICS.cacheMetrics.computedStyleHitRate = PERF_METRICS.cacheMetrics.computedStyleCacheHits / computedStyleTotal;
+    }
+    if (boundingRectTotal + computedStyleTotal > 0) {
+      PERF_METRICS.cacheMetrics.overallHitRate = (PERF_METRICS.cacheMetrics.boundingRectCacheHits + PERF_METRICS.cacheMetrics.computedStyleCacheHits) / (boundingRectTotal + computedStyleTotal);
+    }
+  }
+  function tryToReconnectElement(elementInfo, index) {
+    try {
+      if (elementInfo.id) {
+        const el = document.getElementById(elementInfo.id);
+        if (el && el.isConnected) {
+          return el;
+        }
+      }
+      if (elementInfo.href && elementInfo.tagName === "a") {
+        const links = document.querySelectorAll(`a[href="${elementInfo.href}"]`);
+        for (const link of links) {
+          if (link.isConnected && link.textContent?.trim().substring(0, 50) === elementInfo.textContent) {
+            return link;
+          }
+        }
+      }
+      if (elementInfo.className) {
+        const elements = document.querySelectorAll(`${elementInfo.tagName}.${elementInfo.className.split(" ")[0]}`);
+        for (const el of elements) {
+          if (el.isConnected && el.textContent?.trim().substring(0, 50) === elementInfo.textContent) {
+            return el;
+          }
+        }
+      }
+      if (elementInfo.textContent) {
+        const sidebarElements = document.querySelectorAll('nav a, [class*="sidebar"] a, .css-u0r6z4 a');
+        for (const el of sidebarElements) {
+          if (el.isConnected && el.tagName.toLowerCase() === elementInfo.tagName && el.textContent?.trim().substring(0, 50) === elementInfo.textContent) {
+            return el;
+          }
+        }
+      }
+      return null;
+    } catch (e) {
+      console.error(`[Reconnect] Error trying to reconnect element ${index}:`, e);
+      return null;
+    }
+  }
+  function renderAllHighlights() {
+    try {
+      const old = document.getElementById("playwright-highlight-container");
+      if (old) old.remove();
+      const container = document.createElement("div");
+      container.id = "playwright-highlight-container";
+      container.style.position = "absolute";
+      container.style.pointerEvents = "none";
+      container.style.top = "0";
+      container.style.left = "0";
+      container.style.zIndex = "2147483647";
+      container.style.overflow = "visible";
+      container.style.width = `${document.documentElement.scrollWidth}px`;
+      container.style.height = `${document.documentElement.scrollHeight}px`;
+      document.body.appendChild(container);
+      window._badgePositions = [];
+      const ELEMENT_COLORS = {
+        button: "#D70000",
+        input: "#5182FF",
+        select: "#FF8800",
+        a: "#00A51E",
+        textarea: "#00CCFF",
+        reference: "#FFD700",
+        default: "#D600D6"
+      };
+      let renderedCount = 0;
+      let reconnectedCount = 0;
+      for (const item of window._highlightQueue) {
+        let { element, index, parentIframe, elementInfo } = item;
+        if (!element) continue;
+        if (!element.isConnected) {
+          const reconnected = tryToReconnectElement(elementInfo, index);
+          if (reconnected) {
+            element = reconnected;
+            item.element = reconnected;
+            reconnectedCount++;
+            console.log(`[Highlights] \u2713 Reconnected element ${index}: ${elementInfo.textContent}`);
+          } else {
+            console.log(`[Highlights] X Could not reconnect element ${index}: ${elementInfo.textContent}`);
+            continue;
+          }
+        }
+        try {
+          const style = window.getComputedStyle(element);
+          if (style.display === "none" || style.visibility === "hidden") continue;
+        } catch (e) {
+          continue;
+        }
+        let rect;
+        try {
+          rect = element.getBoundingClientRect();
+        } catch (e) {
+          continue;
+        }
+        if (!rect) continue;
+        let docLeft, docTop;
+        if (parentIframe) {
+          try {
+            if (!parentIframe.isConnected) continue;
+            const iframeRect = parentIframe.getBoundingClientRect();
+            docLeft = iframeRect.left + rect.left + window.pageXOffset;
+            docTop = iframeRect.top + rect.top + window.pageYOffset;
+          } catch (e) {
+            continue;
+          }
+        } else {
+          docLeft = rect.left + window.pageXOffset;
+          docTop = rect.top + window.pageYOffset;
+        }
+        const tag = (item.elementInfo?.tagName || "").toLowerCase();
+        const isReference = item.elementInfo?.isReference || false;
+        const color = isReference ? ELEMENT_COLORS["reference"] : ELEMENT_COLORS[tag] || ELEMENT_COLORS["default"];
+        const overlay = document.createElement("div");
+        overlay.style.position = "absolute";
+        overlay.style.left = `${docLeft}px`;
+        overlay.style.top = `${docTop}px`;
+        overlay.style.width = `${rect.width}px`;
+        overlay.style.height = `${rect.height}px`;
+        overlay.style.border = `2px solid ${color}`;
+        overlay.style.backgroundColor = color + "1A";
+        overlay.style.pointerEvents = "none";
+        overlay.style.boxSizing = "border-box";
+        container.appendChild(overlay);
+        renderedCount++;
+      }
+      const BADGE_SIZE = 16;
+      const MARGIN = 2;
+      for (const item of window._highlightQueue) {
+        let { element, index, parentIframe, elementInfo } = item;
+        if (!element) continue;
+        if (!element.isConnected) {
+          const reconnected = tryToReconnectElement(elementInfo, index);
+          if (reconnected) {
+            element = reconnected;
+            item.element = reconnected;
+          } else {
+            continue;
+          }
+        }
+        try {
+          const style = window.getComputedStyle(element);
+          if (style.display === "none" || style.visibility === "hidden") continue;
+        } catch (e) {
+          continue;
+        }
+        let rect;
+        try {
+          rect = element.getBoundingClientRect();
+        } catch (e) {
+          continue;
+        }
+        if (!rect) continue;
+        let docLeft, docTop;
+        if (parentIframe) {
+          try {
+            if (!parentIframe.isConnected) continue;
+            const iframeRect = parentIframe.getBoundingClientRect();
+            docLeft = iframeRect.left + rect.left + window.pageXOffset;
+            docTop = iframeRect.top + rect.top + window.pageYOffset;
+          } catch (e) {
+            continue;
+          }
+        } else {
+          docLeft = rect.left + window.pageXOffset;
+          docTop = rect.top + window.pageYOffset;
+        }
+        const tag = (item.elementInfo?.tagName || "").toLowerCase();
+        const isReference = item.elementInfo?.isReference || false;
+        const color = isReference ? ELEMENT_COLORS["reference"] : ELEMENT_COLORS[tag] || ELEMENT_COLORS["default"];
+        const label = document.createElement("div");
+        label.className = "playwright-highlight-label";
+        label.style.position = "absolute";
+        label.style.width = `${BADGE_SIZE}px`;
+        label.style.height = `${BADGE_SIZE}px`;
+        label.style.background = color;
+        label.style.color = "white";
+        label.style.border = `1px solid ${color}`;
+        label.style.boxShadow = "0 0 3px black";
+        label.style.borderRadius = "50%";
+        label.style.display = "flex";
+        label.style.alignItems = "center";
+        label.style.justifyContent = "center";
+        label.style.fontSize = "11px";
+        label.style.fontWeight = "bold";
+        label.textContent = String(index);
+        const candidates = [
+          { x: docLeft, y: docTop - BADGE_SIZE - MARGIN },
+          { x: docLeft + rect.width - BADGE_SIZE, y: docTop - BADGE_SIZE - MARGIN },
+          { x: docLeft, y: docTop + rect.height + MARGIN },
+          { x: docLeft + rect.width - BADGE_SIZE, y: docTop + rect.height + MARGIN },
+          { x: docLeft + MARGIN, y: docTop + MARGIN },
+          { x: docLeft + rect.width - BADGE_SIZE - MARGIN, y: docTop + MARGIN }
+        ];
+        const collides = (c) => window._badgePositions.some((p) => {
+          const xOverlap = c.x < p.x + BADGE_SIZE && c.x + BADGE_SIZE > p.x;
+          const yOverlap = c.y < p.y + BADGE_SIZE && c.y + BADGE_SIZE > p.y;
+          return xOverlap && yOverlap;
+        });
+        let best = candidates.find((c) => !collides(c));
+        if (!best) {
+          best = {
+            x: docLeft + rect.width / 2 - BADGE_SIZE / 2,
+            y: docTop - BADGE_SIZE - MARGIN
+          };
+        }
+        if (best.y < window.pageYOffset) best.y = docTop + 2;
+        if (best.x < window.pageXOffset) best.x = docLeft + 2;
+        const docWidth = document.documentElement.scrollWidth;
+        const docHeight = document.documentElement.scrollHeight;
+        if (best.x + BADGE_SIZE > docWidth) {
+          best.x = docWidth - BADGE_SIZE - 2;
+        }
+        if (best.y + BADGE_SIZE > docHeight) {
+          best.y = docHeight - BADGE_SIZE - 2;
+        }
+        window._badgePositions.push(best);
+        label.style.left = `${best.x}px`;
+        label.style.top = `${best.y}px`;
+        container.appendChild(label);
+      }
+      console.log(`[Highlights] Rendered ${renderedCount} boxes (${reconnectedCount} reconnected)`);
+    } catch (error) {
+      console.error("[Highlights] Error in renderAllHighlights:", error);
+    }
+  }
+  function recalcAndRender() {
+    if (!window._highlightQueue?.length) return;
+    if (DOM_CACHE && DOM_CACHE.clearCache) {
+      DOM_CACHE.clearCache();
+    }
+    renderAllHighlights();
+  }
+  window.addEventListener("scroll", () => {
+    if (!window._highlightScrollFrame) {
+      window._highlightScrollFrame = requestAnimationFrame(() => {
+        recalcAndRender();
+        window._highlightScrollFrame = null;
+      });
+    }
+  }, true);
+  window.addEventListener("resize", recalcAndRender);
+  if (doHighlightElements) {
+    renderAllHighlights();
+  }
+  return debugMode ? { rootId, map: DOM_HASH_MAP, perfMetrics: PERF_METRICS } : { rootId, map: DOM_HASH_MAP };
+}
+;
+window.buildDomTreeMain = buildDomTreeMain;