ff-automationv2 1.0.0 → 2.0.1-beta.0

package/src/fireflinkData/fireflinkLocators/elementsFromHTML.ts

@@ -1,656 +1,656 @@
-import { JSDOM, VirtualConsole } from "jsdom";
-import { logger } from "../../utils/logger/logData.js"
-type ElementDetails = {
-  id?: string | null;
-  className?: string | null;
-  xpathByText?: string | null;
-  xpathById?: string | null;
-  xpathByClass?: string | null;
-  xpathAbsolute?: string | null;
-  xpathByName?: string | null;
-  xpathByPlaceholder?: string | null;
-  xpathByType?: string | null;
-  visibleText?: string | null;
-  relativeXpath?: string | null;
-  [key: string]: any;
-};
-
-const isUnique = (xpathResult: XPathResult): boolean => {
-  return xpathResult && xpathResult.snapshotLength === 1;
-};
-
-const getElementFromShadowRoot = (
-  element: Element,
-  selector: string
-): Element | null => {
-  const shadowRoot = (element as HTMLElement).shadowRoot;
-  if (shadowRoot && !selector.includes("dynamic")) {
-    return shadowRoot.querySelector(selector);
-  }
-  return null;
-};
-
-const isSVGElement = (element: Element): boolean => {
-  return (
-    typeof window !== "undefined" &&
-    typeof SVGElement !== "undefined" &&
-    element instanceof SVGElement
-  );
-};
-
-const getXPath = (element: Element, xpath: string): string | null => {
-  const window = element.ownerDocument.defaultView;
-  if (!window) return null;
-
-  const xpathEvaluator = new window.XPathEvaluator();
-  const xpathResult = xpathEvaluator.evaluate(
-    xpath,
-    element.ownerDocument,
-    null,
-    window.XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
-    null
-  );
-
-  return isUnique(xpathResult) ? xpath : null;
-};
-
-const getId = (element: Element | null): string | null => {
-  return element?.id || null;
-};
-
-const getClassName = (element: Element): string | null => {
-  return (element as HTMLElement).className || null;
-};
-
-const getVisibleText = (element: Element): string | null => {
-  return element.textContent?.trim() || null;
-};
-
-const getXPathByText = (element: Element): string | null => {
-  const text = getVisibleText(element);
-  if (text) {
-    const xpath = `//${element.nodeName.toLowerCase()}[text()='${text}']`;
-    return getXPath(element, xpath);
-  }
-  return null;
-};
-
-
-
-
-
-const getXPathById = (element: Element): string | null => {
-  if (element.id) {
-    const xpath = `//${element.nodeName.toLowerCase()}[@id='${element.id}']`;
-    return getXPath(element, xpath);
-  }
-  return null;
-};
-
-const getXPathByClass = (element: Element): string | null => {
-  const classNames = (element as HTMLElement).classList;
-  if (classNames.length > 0) {
-    const xpath = `//${element.nodeName.toLowerCase()}[@class='${classNames[0]
-      }']`;
-    return getXPath(element, xpath);
-  }
-  return null;
-};
-
-const getXpathByName = (element: Element): string | null => {
-  const selector = element.nodeName.toLowerCase();
-  const elementEl = element as HTMLElement;
-
-  if (elementEl.hasAttribute("name")) {
-    const attrValue = elementEl.getAttribute("name");
-    const xpath = `//${selector}[@name='${attrValue}']`;
-    return getXPath(element, xpath) || null;
-  }
-
-  return null;
-};
-
-const getName = (element: Element): string | null => {
-  const elementEl = element as HTMLElement;
-
-  if (elementEl.hasAttribute("name")) {
-    const attrValue = elementEl.getAttribute("name");
-    const name = `${attrValue}`;
-    return name || null;
-  }
-
-  return null;
-};
-
-const getFFxpath = (element: Element): string | null => {
-  const elementEl = element as HTMLElement;
-
-  if (elementEl.hasAttribute("ff-xpath") && !elementEl.getAttribute("ff-xpath")?.includes("/iframe")) {
-    const attrValue = elementEl.getAttribute("ff-xpath");
-    const name = `${attrValue}`;
-    return name || null;
-  }
-
-  return null;
-};
-
-const getXpathByPlaceholder = (element: Element): string | null => {
-  const selector = element.nodeName.toLowerCase();
-  const elementEl = element as HTMLElement;
-
-  if (elementEl.hasAttribute("placeholder")) {
-    const attrValue = elementEl.getAttribute("placeholder");
-    const xpath = `//${selector}[@placeholder='${attrValue}']`;
-    return getXPath(element, xpath) || null;
-  }
-
-  return null;
-};
-
-
-
-const getXpathByType = (element: Element): string | null => {
-  const selector = element.nodeName.toLowerCase();
-  const elementEl = element as HTMLElement;
-
-  if (elementEl.hasAttribute("type")) {
-    const attrValue = elementEl.getAttribute("type");
-    const xpath = `//${selector}[@type='${attrValue}']`;
-    return getXPath(element, xpath) || null;
-  }
-
-  return null;
-};
-
-const getXPathAbsolute = (element: Element): string => {
-  const path: string[] = [];
-  while (element && element.nodeType === 1) {
-    // ELEMENT_NODE
-    let selector = element.nodeName.toLowerCase();
-    let sibling = element;
-    let siblingCount = 1;
-
-    while ((sibling = sibling.previousElementSibling as Element)) {
-      if (sibling.nodeName.toLowerCase() === element.nodeName.toLowerCase()) {
-        siblingCount++;
-      }
-    }
-
-    if (siblingCount > 1) {
-      selector += `[${siblingCount}]`;
-    }
-    path.unshift(selector);
-    element = element.parentNode as Element;
-  }
-  return "//" + path.join("/");
-};
-
-const relations: string[] = [
-  "/preceding-sibling",
-  "/following-sibling",
-  "/parent",
-  "/descendant",
-  "/ancestor",
-  "/self",
-  "/ancestor-or-self",
-  "/child",
-  "/preceding",
-  "/following",
-];
-
-function getElementFromXPath(
-  tempDiv: HTMLElement,
-  xpath: string
-): Element | null {
-  const currentElement: Element | null = tempDiv;
-  const window = currentElement.ownerDocument.defaultView;
-  if (!window) return null;
-
-  const xpathEvaluator = new window.XPathEvaluator();
-  const xpathResult = xpathEvaluator.evaluate(
-    xpath,
-    currentElement.ownerDocument,
-    null,
-    window.XPathResult.FIRST_ORDERED_NODE_TYPE,
-    null
-  );
-  return xpathResult.singleNodeValue as Element | null;
-}
-
-function checkReferenceElementIsValid(
-  locator: string,
-  relation: string,
-  tempDiv: HTMLElement
-): string | null {
-  if (locator.includes(relation)) {
-    const locatotSplitArray: string[] = locator.split(relation);
-    const sourceLoc = locatotSplitArray[0].trim();
-    const currentElement: Element | null = tempDiv;
-    const window = currentElement.ownerDocument.defaultView;
-    if (!window) return null;
-    if (!locator.includes("dynamic")) {
-      const xpathEvaluator = new window.XPathEvaluator();
-      const xpathResult = xpathEvaluator.evaluate(
-        sourceLoc,
-        currentElement.ownerDocument,
-        null,
-        window.XPathResult.FIRST_ORDERED_NODE_TYPE,
-        null
-      );
-
-      const sourceElement = xpathResult.singleNodeValue;
-      if (sourceElement) {
-        const xpathResultComplete = xpathEvaluator.evaluate(
-          locator,
-          currentElement.ownerDocument,
-          null,
-          window.XPathResult.FIRST_ORDERED_NODE_TYPE,
-          null
-        );
-        const completeElement = xpathResultComplete.singleNodeValue;
-        let relativeXpath: string;
-        if (completeElement) {
-          relativeXpath = locator;
-          return relativeXpath;
-        } else {
-          logger.error("Complete Locator is Invalid:", locator);
-          relativeXpath = locator;
-          return relativeXpath;
-        }
-      } else {
-        logger.error("Source Locator Not Found:", sourceLoc);
-      }
-    }
-  }
-  return null;
-}
-interface Locator {
-  name: string;
-  type: string;
-  value: string;
-  reference: string;
-  status: string;
-  isRecorded: string;
-}
-
-const getElementsFromHTML = (
-  locators: Locator[],
-  htmlString: string
-): ElementDetails | null => {
-  const virtualConsole = new VirtualConsole();
-  const dom = new JSDOM(htmlString, {
-    resources: "usable",
-    runScripts: "outside-only", // Prevents inline script execution in JSDOM
-    pretendToBeVisual: true,
-    virtualConsole,
-    includeNodeLocations: true,
-  });
-
-  const document = dom.window.document;
-  global.SVGElement = dom.window.SVGElement;
-  const tempDiv = document.createElement("div");
-  const elementsToRemove = document.querySelectorAll(
-    "script, style, link[rel='stylesheet'], meta, noscript, embed, object, param, source, svg"
-  );
-
-  if (elementsToRemove) {
-    elementsToRemove.forEach((tag) => {
-      (tag as Element).remove();
-    });
-  }
-
-  tempDiv.innerHTML = document.body.innerHTML;
-  // tempDiv.innerHTML = htmlString;
-  const finalLocators: any = [];
-
-  for (const locator of locators) {
-    try {
-      const isDynamic = String(locator.value || locator.type || "");
-      if (
-        isDynamic.includes("dynamic") ||
-        isDynamic.match("dynamic") ||
-        isDynamic.includes("{") ||
-        isDynamic.includes("}")
-      ) {
-        finalLocators.push({
-          name: locator.name,
-          type: locator.type,
-          value: locator.value,
-          reference: locator.reference,
-          status: locator.status,
-          isRecorded: locator.isRecorded,
-        });
-        continue;
-      }
-      const isRecorded = String(locator.isRecorded || "");
-
-      if (isRecorded.includes("N") || isRecorded.match("N")) {
-        finalLocators.push({
-          name: locator.name,
-          type: locator.type,
-          value: locator.value,
-          reference: locator.reference,
-          status: locator.status,
-          isRecorded: locator.isRecorded,
-        });
-      }
-      try {
-        let targetElement: Element | null = null;
-        if (locator.value.startsWith("iframe")) {
-          const iframe = tempDiv.querySelector(
-            locator.value
-          ) as HTMLIFrameElement;
-          if (iframe) {
-            const iframeDocument =
-              iframe.contentDocument || iframe.contentWindow?.document;
-            if (iframeDocument) {
-              targetElement = iframeDocument.querySelector(
-                locator.value.slice(6)
-              );
-            }
-          }
-        } else {
-          const selectors = locator.value.split(">>>"); // Custom delimiter for shadow DOM
-          let currentElement: Element | null = tempDiv;
-
-          for (const selector of selectors) {
-            if (currentElement) {
-              const trimmedSelector = selector.trim();
-              if (
-                locator.name.includes("id") ||
-                trimmedSelector.startsWith("#")
-              ) {
-                targetElement = currentElement.querySelector(
-                  "#" + trimmedSelector
-                );
-              } else if (
-                locator.name.includes("className") ||
-                trimmedSelector.startsWith(".")
-              ) {
-                targetElement = currentElement.querySelector(
-                  "." + trimmedSelector
-                );
-              } else if (
-                (locator.name.includes("xpath") ||
-                  trimmedSelector.startsWith("//")) &&
-                !locator.type.match("dynamic")
-              ) {
-                targetElement = getElementFromXPath(tempDiv, trimmedSelector);
-              } else {
-                targetElement = currentElement.querySelector(trimmedSelector);
-                if (!targetElement) {
-                  targetElement = getElementFromShadowRoot(
-                    currentElement,
-                    trimmedSelector
-                  );
-                }
-              }
-
-              if (
-                !targetElement &&
-                isSVGElement(currentElement) &&
-                !locator.type.match("dynamic")
-              ) {
-                targetElement = currentElement.querySelector(trimmedSelector);
-              }
-
-              currentElement = targetElement;
-            }
-          }
-        }
-
-        const locatorExists = (name: string, value: string) => {
-          return finalLocators.some(
-            (_loc: any) =>
-              _loc.name === name &&
-              _loc.value === value &&
-              (!_loc.value.includes("dynamic") ||
-                !locator.type.match("dynamic"))
-          );
-        };
-
-        const xpathFunctions = [
-          { name: "xpath", value: getXPathByText },
-          { name: "xpath", value: getXPathById },
-          { name: "xpath", value: getXPathByClass },
-          { name: "xpath", value: getXPathAbsolute },
-          { name: "xpath", value: getXpathByName },
-          { name: "xpath", value: getXpathByPlaceholder },
-          { name: "xpath", value: getXpathByType },
-        ];
-
-        if (targetElement) {
-          const idValue = getId(targetElement);
-          if (idValue && !locatorExists("id", idValue)) {
-            locators.forEach(() => {
-              if (locator.value === idValue) {
-                finalLocators.push({
-                  name: "id",
-                  type: locator.type,
-                  value: idValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: "id",
-                  type: locator.type,
-                  value: idValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          }
-
-
-          if (getVisibleText(targetElement)) {
-            const textValue = getVisibleText(targetElement);
-            locators.forEach((_loc) => {
-              if (_loc.value === textValue) {
-                finalLocators.push({
-                  name: "linkText",
-                  type: "static",
-                  value: textValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: "linkText",
-                  type: "static",
-                  value: textValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          }
-
-          if (getName(targetElement)) {
-            const nameLocator = getName(targetElement);
-            locators.forEach((_loc) => {
-              if (_loc.value === nameLocator) {
-                finalLocators.push({
-                  name: "name",
-                  type: "static",
-                  value: nameLocator,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: "name",
-                  type: "static",
-                  value: nameLocator,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          }
-          if (getFFxpath(targetElement)) {
-            const nameLocator = getFFxpath(targetElement);
-            locators.forEach((_loc) => {
-              if (_loc.value === nameLocator) {
-                finalLocators.push({
-                  name: "xpath",
-                  type: "static",
-                  value: nameLocator,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: "xpath",
-                  type: "static",
-                  value: nameLocator,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          }
-
-          const classValue = getClassName(targetElement);
-          if (
-            classValue &&
-            classValue.trim() !== "" &&
-            !locatorExists("className", classValue)
-          ) {
-            locators.forEach((_loc) => {
-              if (_loc.value === classValue) {
-                finalLocators.push({
-                  name: "className",
-                  type: locator.type,
-                  value: classValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: "className",
-                  type: locator.type,
-                  value: classValue,
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          }
-          xpathFunctions.forEach((fn) => {
-            locators.forEach((_loc) => {
-              if (_loc.value === fn.value(targetElement)) {
-                finalLocators.push({
-                  name: fn.name,
-                  type: locator.type,
-                  value: fn.value(targetElement),
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: locator.isRecorded,
-                  isAiRecorded: "Y",
-                });
-              } else {
-                finalLocators.push({
-                  name: fn.name,
-                  type: locator.type,
-                  value: fn.value(targetElement),
-                  reference: locator.reference,
-                  status: locator.status,
-                  isRecorded: "Y",
-                  isAiRecorded: "Y",
-                });
-              }
-            });
-          });
-
-          for (const locator of locators) {
-            try {
-              let relativeXpath = null;
-              if (locator.value) {
-                for (const relation of relations) {
-                  if (locator.value.includes(relation)) {
-                    relativeXpath = checkReferenceElementIsValid(
-                      locator.value,
-                      relation,
-                      tempDiv
-                    );
-
-                    if (relativeXpath) {
-                      finalLocators.push({
-                        name: "xpath",
-                        type: locator.type,
-                        value: relativeXpath,
-                        reference: locator.reference,
-                        status: locator.status,
-                        isRecorded:
-                          locator.isRecorded !== "" &&
-                            locator.isRecorded !== null
-                            ? locator.isRecorded
-                            : "Y",
-                      });
-                      break;
-                    }
-                  }
-                }
-              }
-            } catch (error: any) {
-              logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
-            }
-          }
-
-          const uniqueLocators = new Map();
-          finalLocators.forEach((_loc: any) => {
-            if (!uniqueLocators.has(_loc.value)) {
-              uniqueLocators.set(_loc.value, _loc);
-            }
-          });
-
-          const ffLoc = Array.from(uniqueLocators.values());
-
-          const jsonResult = [
-            {
-              locators: ffLoc.filter(
-                (locator) =>
-                  Object.prototype.hasOwnProperty.call(locator, "value") &&
-                  locator?.value !== null &&
-                  locator.value !== ""
-              ),
-            },
-          ];
-
-          return jsonResult;
-        }
-      } catch (error: any) {
-        logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
-        continue;
-      }
-    } catch (error: any) {
-      logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
-      continue;
-    }
-  }
-  return null;
-};
-
-export { getElementsFromHTML };
+import { JSDOM, VirtualConsole } from "jsdom";
+import { logger } from "../../utils/logger/logData.js"
+type ElementDetails = {
+  id?: string | null;
+  className?: string | null;
+  xpathByText?: string | null;
+  xpathById?: string | null;
+  xpathByClass?: string | null;
+  xpathAbsolute?: string | null;
+  xpathByName?: string | null;
+  xpathByPlaceholder?: string | null;
+  xpathByType?: string | null;
+  visibleText?: string | null;
+  relativeXpath?: string | null;
+  [key: string]: any;
+};
+
+const isUnique = (xpathResult: XPathResult): boolean => {
+  return xpathResult && xpathResult.snapshotLength === 1;
+};
+
+const getElementFromShadowRoot = (
+  element: Element,
+  selector: string
+): Element | null => {
+  const shadowRoot = (element as HTMLElement).shadowRoot;
+  if (shadowRoot && !selector.includes("dynamic")) {
+    return shadowRoot.querySelector(selector);
+  }
+  return null;
+};
+
+const isSVGElement = (element: Element): boolean => {
+  return (
+    typeof window !== "undefined" &&
+    typeof SVGElement !== "undefined" &&
+    element instanceof SVGElement
+  );
+};
+
+const getXPath = (element: Element, xpath: string): string | null => {
+  const window = element.ownerDocument.defaultView;
+  if (!window) return null;
+
+  const xpathEvaluator = new window.XPathEvaluator();
+  const xpathResult = xpathEvaluator.evaluate(
+    xpath,
+    element.ownerDocument,
+    null,
+    window.XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
+    null
+  );
+
+  return isUnique(xpathResult) ? xpath : null;
+};
+
+const getId = (element: Element | null): string | null => {
+  return element?.id || null;
+};
+
+const getClassName = (element: Element): string | null => {
+  return (element as HTMLElement).className || null;
+};
+
+const getVisibleText = (element: Element): string | null => {
+  return element.textContent?.trim() || null;
+};
+
+const getXPathByText = (element: Element): string | null => {
+  const text = getVisibleText(element);
+  if (text) {
+    const xpath = `//${element.nodeName.toLowerCase()}[text()='${text}']`;
+    return getXPath(element, xpath);
+  }
+  return null;
+};
+
+
+
+
+
+const getXPathById = (element: Element): string | null => {
+  if (element.id) {
+    const xpath = `//${element.nodeName.toLowerCase()}[@id='${element.id}']`;
+    return getXPath(element, xpath);
+  }
+  return null;
+};
+
+const getXPathByClass = (element: Element): string | null => {
+  const classNames = (element as HTMLElement).classList;
+  if (classNames.length > 0) {
+    const xpath = `//${element.nodeName.toLowerCase()}[@class='${classNames[0]
+      }']`;
+    return getXPath(element, xpath);
+  }
+  return null;
+};
+
+const getXpathByName = (element: Element): string | null => {
+  const selector = element.nodeName.toLowerCase();
+  const elementEl = element as HTMLElement;
+
+  if (elementEl.hasAttribute("name")) {
+    const attrValue = elementEl.getAttribute("name");
+    const xpath = `//${selector}[@name='${attrValue}']`;
+    return getXPath(element, xpath) || null;
+  }
+
+  return null;
+};
+
+const getName = (element: Element): string | null => {
+  const elementEl = element as HTMLElement;
+
+  if (elementEl.hasAttribute("name")) {
+    const attrValue = elementEl.getAttribute("name");
+    const name = `${attrValue}`;
+    return name || null;
+  }
+
+  return null;
+};
+
+const getFFxpath = (element: Element): string | null => {
+  const elementEl = element as HTMLElement;
+
+  if (elementEl.hasAttribute("ff-xpath") && !elementEl.getAttribute("ff-xpath")?.includes("/iframe")) {
+    const attrValue = elementEl.getAttribute("ff-xpath");
+    const name = `${attrValue}`;
+    return name || null;
+  }
+
+  return null;
+};
+
+const getXpathByPlaceholder = (element: Element): string | null => {
+  const selector = element.nodeName.toLowerCase();
+  const elementEl = element as HTMLElement;
+
+  if (elementEl.hasAttribute("placeholder")) {
+    const attrValue = elementEl.getAttribute("placeholder");
+    const xpath = `//${selector}[@placeholder='${attrValue}']`;
+    return getXPath(element, xpath) || null;
+  }
+
+  return null;
+};
+
+
+
+const getXpathByType = (element: Element): string | null => {
+  const selector = element.nodeName.toLowerCase();
+  const elementEl = element as HTMLElement;
+
+  if (elementEl.hasAttribute("type")) {
+    const attrValue = elementEl.getAttribute("type");
+    const xpath = `//${selector}[@type='${attrValue}']`;
+    return getXPath(element, xpath) || null;
+  }
+
+  return null;
+};
+
+const getXPathAbsolute = (element: Element): string => {
+  const path: string[] = [];
+  while (element && element.nodeType === 1) {
+    // ELEMENT_NODE
+    let selector = element.nodeName.toLowerCase();
+    let sibling = element;
+    let siblingCount = 1;
+
+    while ((sibling = sibling.previousElementSibling as Element)) {
+      if (sibling.nodeName.toLowerCase() === element.nodeName.toLowerCase()) {
+        siblingCount++;
+      }
+    }
+
+    if (siblingCount > 1) {
+      selector += `[${siblingCount}]`;
+    }
+    path.unshift(selector);
+    element = element.parentNode as Element;
+  }
+  return "//" + path.join("/");
+};
+
+const relations: string[] = [
+  "/preceding-sibling",
+  "/following-sibling",
+  "/parent",
+  "/descendant",
+  "/ancestor",
+  "/self",
+  "/ancestor-or-self",
+  "/child",
+  "/preceding",
+  "/following",
+];
+
+function getElementFromXPath(
+  tempDiv: HTMLElement,
+  xpath: string
+): Element | null {
+  const currentElement: Element | null = tempDiv;
+  const window = currentElement.ownerDocument.defaultView;
+  if (!window) return null;
+
+  const xpathEvaluator = new window.XPathEvaluator();
+  const xpathResult = xpathEvaluator.evaluate(
+    xpath,
+    currentElement.ownerDocument,
+    null,
+    window.XPathResult.FIRST_ORDERED_NODE_TYPE,
+    null
+  );
+  return xpathResult.singleNodeValue as Element | null;
+}
+
+function checkReferenceElementIsValid(
+  locator: string,
+  relation: string,
+  tempDiv: HTMLElement
+): string | null {
+  if (locator.includes(relation)) {
+    const locatotSplitArray: string[] = locator.split(relation);
+    const sourceLoc = locatotSplitArray[0].trim();
+    const currentElement: Element | null = tempDiv;
+    const window = currentElement.ownerDocument.defaultView;
+    if (!window) return null;
+    if (!locator.includes("dynamic")) {
+      const xpathEvaluator = new window.XPathEvaluator();
+      const xpathResult = xpathEvaluator.evaluate(
+        sourceLoc,
+        currentElement.ownerDocument,
+        null,
+        window.XPathResult.FIRST_ORDERED_NODE_TYPE,
+        null
+      );
+
+      const sourceElement = xpathResult.singleNodeValue;
+      if (sourceElement) {
+        const xpathResultComplete = xpathEvaluator.evaluate(
+          locator,
+          currentElement.ownerDocument,
+          null,
+          window.XPathResult.FIRST_ORDERED_NODE_TYPE,
+          null
+        );
+        const completeElement = xpathResultComplete.singleNodeValue;
+        let relativeXpath: string;
+        if (completeElement) {
+          relativeXpath = locator;
+          return relativeXpath;
+        } else {
+          logger.error("Complete Locator is Invalid:", locator);
+          relativeXpath = locator;
+          return relativeXpath;
+        }
+      } else {
+        logger.error("Source Locator Not Found:", sourceLoc);
+      }
+    }
+  }
+  return null;
+}
+interface Locator {
+  name: string;
+  type: string;
+  value: string;
+  reference: string;
+  status: string;
+  isRecorded: string;
+}
+
+const getElementsFromHTML = (
+  locators: Locator[],
+  htmlString: string
+): ElementDetails | null => {
+  const virtualConsole = new VirtualConsole();
+  const dom = new JSDOM(htmlString, {
+    resources: "usable",
+    runScripts: "outside-only", // Prevents inline script execution in JSDOM
+    pretendToBeVisual: true,
+    virtualConsole,
+    includeNodeLocations: true,
+  });
+
+  const document = dom.window.document;
+  global.SVGElement = dom.window.SVGElement;
+  const tempDiv = document.createElement("div");
+  const elementsToRemove = document.querySelectorAll(
+    "script, style, link[rel='stylesheet'], meta, noscript, embed, object, param, source, svg"
+  );
+
+  if (elementsToRemove) {
+    elementsToRemove.forEach((tag) => {
+      (tag as Element).remove();
+    });
+  }
+
+  tempDiv.innerHTML = document.body.innerHTML;
+  // tempDiv.innerHTML = htmlString;
+  const finalLocators: any = [];
+
+  for (const locator of locators) {
+    try {
+      const isDynamic = String(locator.value || locator.type || "");
+      if (
+        isDynamic.includes("dynamic") ||
+        isDynamic.match("dynamic") ||
+        isDynamic.includes("{") ||
+        isDynamic.includes("}")
+      ) {
+        finalLocators.push({
+          name: locator.name,
+          type: locator.type,
+          value: locator.value,
+          reference: locator.reference,
+          status: locator.status,
+          isRecorded: locator.isRecorded,
+        });
+        continue;
+      }
+      const isRecorded = String(locator.isRecorded || "");
+
+      if (isRecorded.includes("N") || isRecorded.match("N")) {
+        finalLocators.push({
+          name: locator.name,
+          type: locator.type,
+          value: locator.value,
+          reference: locator.reference,
+          status: locator.status,
+          isRecorded: locator.isRecorded,
+        });
+      }
+      try {
+        let targetElement: Element | null = null;
+        if (locator.value.startsWith("iframe")) {
+          const iframe = tempDiv.querySelector(
+            locator.value
+          ) as HTMLIFrameElement;
+          if (iframe) {
+            const iframeDocument =
+              iframe.contentDocument || iframe.contentWindow?.document;
+            if (iframeDocument) {
+              targetElement = iframeDocument.querySelector(
+                locator.value.slice(6)
+              );
+            }
+          }
+        } else {
+          const selectors = locator.value.split(">>>"); // Custom delimiter for shadow DOM
+          let currentElement: Element | null = tempDiv;
+
+          for (const selector of selectors) {
+            if (currentElement) {
+              const trimmedSelector = selector.trim();
+              if (
+                locator.name.includes("id") ||
+                trimmedSelector.startsWith("#")
+              ) {
+                targetElement = currentElement.querySelector(
+                  "#" + trimmedSelector
+                );
+              } else if (
+                locator.name.includes("className") ||
+                trimmedSelector.startsWith(".")
+              ) {
+                targetElement = currentElement.querySelector(
+                  "." + trimmedSelector
+                );
+              } else if (
+                (locator.name.includes("xpath") ||
+                  trimmedSelector.startsWith("//")) &&
+                !locator.type.match("dynamic")
+              ) {
+                targetElement = getElementFromXPath(tempDiv, trimmedSelector);
+              } else {
+                targetElement = currentElement.querySelector(trimmedSelector);
+                if (!targetElement) {
+                  targetElement = getElementFromShadowRoot(
+                    currentElement,
+                    trimmedSelector
+                  );
+                }
+              }
+
+              if (
+                !targetElement &&
+                isSVGElement(currentElement) &&
+                !locator.type.match("dynamic")
+              ) {
+                targetElement = currentElement.querySelector(trimmedSelector);
+              }
+
+              currentElement = targetElement;
+            }
+          }
+        }
+
+        const locatorExists = (name: string, value: string) => {
+          return finalLocators.some(
+            (_loc: any) =>
+              _loc.name === name &&
+              _loc.value === value &&
+              (!_loc.value.includes("dynamic") ||
+                !locator.type.match("dynamic"))
+          );
+        };
+
+        const xpathFunctions = [
+          { name: "xpath", value: getXPathByText },
+          { name: "xpath", value: getXPathById },
+          { name: "xpath", value: getXPathByClass },
+          { name: "xpath", value: getXPathAbsolute },
+          { name: "xpath", value: getXpathByName },
+          { name: "xpath", value: getXpathByPlaceholder },
+          { name: "xpath", value: getXpathByType },
+        ];
+
+        if (targetElement) {
+          const idValue = getId(targetElement);
+          if (idValue && !locatorExists("id", idValue)) {
+            locators.forEach(() => {
+              if (locator.value === idValue) {
+                finalLocators.push({
+                  name: "id",
+                  type: locator.type,
+                  value: idValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: "id",
+                  type: locator.type,
+                  value: idValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          }
+
+
+          if (getVisibleText(targetElement)) {
+            const textValue = getVisibleText(targetElement);
+            locators.forEach((_loc) => {
+              if (_loc.value === textValue) {
+                finalLocators.push({
+                  name: "linkText",
+                  type: "static",
+                  value: textValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: "linkText",
+                  type: "static",
+                  value: textValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          }
+
+          if (getName(targetElement)) {
+            const nameLocator = getName(targetElement);
+            locators.forEach((_loc) => {
+              if (_loc.value === nameLocator) {
+                finalLocators.push({
+                  name: "name",
+                  type: "static",
+                  value: nameLocator,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: "name",
+                  type: "static",
+                  value: nameLocator,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          }
+          if (getFFxpath(targetElement)) {
+            const nameLocator = getFFxpath(targetElement);
+            locators.forEach((_loc) => {
+              if (_loc.value === nameLocator) {
+                finalLocators.push({
+                  name: "xpath",
+                  type: "static",
+                  value: nameLocator,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: "xpath",
+                  type: "static",
+                  value: nameLocator,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          }
+
+          const classValue = getClassName(targetElement);
+          if (
+            classValue &&
+            classValue.trim() !== "" &&
+            !locatorExists("className", classValue)
+          ) {
+            locators.forEach((_loc) => {
+              if (_loc.value === classValue) {
+                finalLocators.push({
+                  name: "className",
+                  type: locator.type,
+                  value: classValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: "className",
+                  type: locator.type,
+                  value: classValue,
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          }
+          xpathFunctions.forEach((fn) => {
+            locators.forEach((_loc) => {
+              if (_loc.value === fn.value(targetElement)) {
+                finalLocators.push({
+                  name: fn.name,
+                  type: locator.type,
+                  value: fn.value(targetElement),
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: locator.isRecorded,
+                  isAiRecorded: "Y",
+                });
+              } else {
+                finalLocators.push({
+                  name: fn.name,
+                  type: locator.type,
+                  value: fn.value(targetElement),
+                  reference: locator.reference,
+                  status: locator.status,
+                  isRecorded: "Y",
+                  isAiRecorded: "Y",
+                });
+              }
+            });
+          });
+
+          for (const locator of locators) {
+            try {
+              let relativeXpath = null;
+              if (locator.value) {
+                for (const relation of relations) {
+                  if (locator.value.includes(relation)) {
+                    relativeXpath = checkReferenceElementIsValid(
+                      locator.value,
+                      relation,
+                      tempDiv
+                    );
+
+                    if (relativeXpath) {
+                      finalLocators.push({
+                        name: "xpath",
+                        type: locator.type,
+                        value: relativeXpath,
+                        reference: locator.reference,
+                        status: locator.status,
+                        isRecorded:
+                          locator.isRecorded !== "" &&
+                            locator.isRecorded !== null
+                            ? locator.isRecorded
+                            : "Y",
+                      });
+                      break;
+                    }
+                  }
+                }
+              }
+            } catch (error: any) {
+              logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
+            }
+          }
+
+          const uniqueLocators = new Map();
+          finalLocators.forEach((_loc: any) => {
+            if (!uniqueLocators.has(_loc.value)) {
+              uniqueLocators.set(_loc.value, _loc);
+            }
+          });
+
+          const ffLoc = Array.from(uniqueLocators.values());
+
+          const jsonResult = [
+            {
+              locators: ffLoc.filter(
+                (locator) =>
+                  Object.prototype.hasOwnProperty.call(locator, "value") &&
+                  locator?.value !== null &&
+                  locator.value !== ""
+              ),
+            },
+          ];
+
+          return jsonResult;
+        }
+      } catch (error: any) {
+        logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
+        continue;
+      }
+    } catch (error: any) {
+      logger.error(`[${Object.getPrototypeOf(this).constructor.name}] : Error processing locator:`, locator, error.message);
+      continue;
+    }
+  }
+  return null;
+};
+
+export { getElementsFromHTML };