ff-dom 1.0.16 → 1.0.18-beta.1

package/src/utils/getElementsFromHTML.ts

@@ -1,685 +1,513 @@
-//@ts-nocheck
-import { JSDOM, VirtualConsole } from "jsdom";
-
-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 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",
-];
-
-const normalizeXPath = (xpath: string): string => {
-  xpath = xpath.replace(/text\(\)\s*=\s*['"](.+?)['"]/g, "normalize-space(.)='$1'");
-  xpath = xpath.replace(/\.\s*=\s*['"](.+?)['"]/g, "normalize-space(.)='$1'");
-
-  return xpath;
-};
-
-function getElementFromXPath(
-  tempDiv: HTMLElement,
-  xpath: string
-): Element | null {
-  let 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, //here even tempDiv can be passed
-    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();
-    let 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 {
-          console.error("Complete Locator is Invalid:", locator);
-          relativeXpath = locator;
-          return relativeXpath;
-        }
-      } else {
-        console.error("Source Locator Not Found:", sourceLoc);
-      }
-    }
-  }
-  return null;
-}
-interface Locator {
-  name: string;
-  type: string;
-  value: string;
-  reference: string;
-  status: string;
-  isRecorded: string;
-}
-
-const getElementsFromHTML = (
-  name: string,
-  desc: string,
-  type: string,
-  locators: Locator[],
-  isShared: string,
-  projectId: string,
-  projectType: string,
-  isRecorded: string,
-  folder: string,
-  parentId: string,
-  parentName: string,
-  platform: string,
-  licenseId: string,
-  licenseType: string,
-  userId: string,
-  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;
-  let finalLocators = [];
-
-  locators: for (const locator of locators) {
-    try {
-      const isRecorded = String(locator.isRecorded || "");
-      const recordedNLocators = locators.filter((l) => l.isRecorded === "N");
-
-      if (recordedNLocators.length > 0) {
-        for (const locator of recordedNLocators) {
-          finalLocators.push({
-            name: locator.name,
-            type: locator.type,
-            value: locator.value,
-            reference: locator.reference,
-            status: locator.status,
-            isRecorded: locator.isRecorded,
-          });
-        }
-      }
-
-      let relativeXpath: string | null = null;
-      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;
-      }
-
-      if (isShared.includes("Y")) {
-        break locators;
-      }
-      for (const relation of relations) {
-        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")
-                ) {
-                  if (tempDiv.innerHTML) {
-                    const normalizedXPath = normalizeXPath(trimmedSelector);
-                    targetElement = getElementFromXPath(
-                      tempDiv,
-                      normalizedXPath
-                    );
-                    if (targetElement) {
-                      finalLocators.push({
-                        name: locator.name,
-                        type: locator.type,
-                        value: trimmedSelector,
-                        reference: locator.reference,
-                        status: locator.status,
-                        isRecorded: String(locator.isRecorded).includes("N")
-                          ? "N"
-                          : "Y",
-                      });
-                    }
-                  }
-                } 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;
-              } else {
-                console.error("Element not found at:", selector);
-                break;
-              }
-            }
-          }
-
-          const locatorExists = (name: string, value: string) => {
-            return finalLocators.some(
-              (loc) =>
-                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((loc) => {
-                if (locator.value === idValue && locator.name === "id") {
-                  finalLocators.push({
-                    name: "id",
-                    type: locator.type,
-                    value: idValue,
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: locator.isRecorded,
-                  });
-                } else {
-                  finalLocators.push({
-                    name: "id",
-                    type: locator.type,
-                    value: idValue,
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: "Y",
-                    isSelfHealed: "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,
-                  });
-                } else {
-                  finalLocators.push({
-                    name: "linkText",
-                    type: "static",
-                    value: textValue,
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: "Y",
-                    isSelfHealed: "Y",
-                  });
-                }
-              });
-            }
-
-            if (getName(targetElement)) {
-              const nameLocator = getName(targetElement);
-              if (nameLocator && !locatorExists("name", nameLocator)) {
-                locators.forEach((loc) => {
-                  if (loc.value === nameLocator && locator.name === "name") {
-                    finalLocators.push({
-                      name: "name",
-                      type: "static",
-                      value: nameLocator,
-                      reference: locator.reference,
-                      status: locator.status,
-                      isRecorded: locator.isRecorded,
-                    });
-                  } else {
-                    finalLocators.push({
-                      name: "name",
-                      type: "static",
-                      value: nameLocator,
-                      reference: locator.reference,
-                      status: locator.status,
-                      isRecorded: "Y",
-                      isSelfHealed: "Y",
-                    });
-                  }
-                });
-              }
-            }
-
-            const classValue = getClassName(targetElement);
-            if (
-              classValue &&
-              classValue.trim() !== "" &&
-              !locatorExists("className", classValue)
-            ) {
-              locators.forEach((loc) => {
-                if (loc.value === classValue && locator.name === "className") {
-                  finalLocators.push({
-                    name: "className",
-                    type: locator.type,
-                    value: classValue,
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: locator.isRecorded,
-                  });
-                } else {
-                  finalLocators.push({
-                    name: "className",
-                    type: locator.type,
-                    value: classValue,
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: "Y",
-                    isSelfHealed: "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,
-                  });
-                } else {
-                  finalLocators.push({
-                    name: fn.name,
-                    type: locator.type,
-                    value: fn.value(targetElement),
-                    reference: locator.reference,
-                    status: locator.status,
-                    isRecorded: "Y",
-                    isSelfHealed: "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) {
-                console.error("Error processing locator:", locator, error);
-              }
-            }
-
-            let uniqueLocators = new Map();
-
-             finalLocators.forEach((obj) => {
-              let val = obj.value;
-              if (obj.isRecorded === 'Y' && val) {
-                val = String(val).replace(/"/g, "'").replace(/\\'/g, "'");
-              }
-
-              // filter out redundant/invalid values
-              if (!val || val === 'null' || val === "''") return;
-
-              // ensure unique entries
-              if (!uniqueLocators.has(val)) {
-                uniqueLocators.set(val, { ...obj, value: val });
-              }
-            });
-
-            let ffLoc = Array.from(uniqueLocators.values());
-
-            const jsonResult = [
-              {
-                name: `${name}`,
-                desc: `${desc}`,
-                type: `${type}`,
-                locators: ffLoc.filter(
-                  (locator) =>
-                    locator.hasOwnProperty("value") &&
-                    locator?.value !== null &&
-                    locator.value !== ""
-                ),
-                isShared: `${isShared}`,
-                projectId: `${projectId}`,
-                projectType: `${projectType}`,
-                isRecorded: `${isRecorded}`,
-                folder: `${folder}`,
-                parentId: `${parentId}`,
-                parentName: `${parentName}`,
-                platform: `${platform}`,
-                licenseId: `${licenseId}`,
-                licenseType: `${licenseType}`,
-                userId: `${userId}`,
-              },
-            ];
-
-            return jsonResult;
-          }
-        } catch (error) {
-          console.error("Error processing locator:", locator, error);
-          continue;
-        }
-      }
-    } catch (error) {
-      console.error("Error processing locator:", locator, error);
-      continue;
-    }
-  }
-  return null;
-};
-
-export { getElementsFromHTML };
+import { ElementRecord, Locator } from "../types/locator.ts";
+import { parseDOM } from "./xpath.ts";
+import { isSvg, normalizeXPath } from "./xpathHelpers.ts";
+
+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 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 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 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 relations: string[] = [
+  "/preceding-sibling",
+  "/following-sibling",
+  "/parent",
+  "/descendant",
+  "/ancestor",
+  "/self",
+  "/ancestor-or-self",
+  "/child",
+  "/preceding",
+  "/following",
+];
+
+function getElementFromXPath(
+  tempDiv: HTMLElement,
+  xpath: string
+): Element | null {
+  let 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, //here even tempDiv can be passed
+    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();
+    let 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 {
+          console.error("Complete Locator is Invalid:", locator);
+          relativeXpath = locator;
+          return relativeXpath;
+        }
+      } else {
+        console.error("Source Locator Not Found:", sourceLoc);
+      }
+    }
+  }
+  return null;
+}
+
+const getElementsFromHTML = (
+  record: ElementRecord,
+  docmt: Document
+): ElementDetails | null => {
+  const document = docmt;
+  // global.SVGElement = document.defaultView?.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;
+  const finalLocatorsSet: Set<string> = new Set();
+  let finalLocators: any[] = [];
+
+  function createLocator(base: any, overrides: Partial<any> = {}) {
+    const newLocator: any = {
+      name: overrides.name ?? base?.name,
+      type: overrides.type ?? base?.type,
+      value: overrides.value ?? base?.value,
+      reference: overrides.reference ?? base?.reference,
+      status: overrides.status ?? base?.status,
+      isRecorded: overrides.isRecorded ?? base?.isRecorded,
+    };
+
+    if (overrides.hasOwnProperty("isSelfHealed")) {
+      newLocator.isSelfHealed = overrides.isSelfHealed;
+    } else if (base?.hasOwnProperty("isSelfHealed")) {
+      newLocator.isSelfHealed = base.isSelfHealed;
+    }
+
+    pushUniqueLocator(newLocator);
+  }
+
+  function pushUniqueLocator(obj: any) {
+    const key = `${obj.name}:${obj.value}`;
+    if (!finalLocatorsSet.has(key)) {
+      finalLocatorsSet.add(key);
+      finalLocators.push(obj);
+    }
+  }
+
+  /** Locator Value Cleaner (Handles Special Scenarios) **/
+  const cleanLocatorValue = (
+    val: string | null | undefined,
+    type?: string,
+    isRecorded?: string
+  ): string | null => {
+    if (!val) return null;
+
+    let cleaned = val.trim();
+
+    // Return null for empty or literal "null"
+    if (!cleaned || cleaned.toLowerCase() === "null") return null;
+
+    // Unescape any escaped quotes
+    cleaned = cleaned.replace(/\\"/g, '"').replace(/\\'/g, "'");
+
+    // Remove surrounding single or double quotes
+    cleaned = cleaned.replace(/^['"](.+?)['"]$/, "$1");
+
+    // Replace double single quotes with a single quote inside XPath
+    cleaned = cleaned.replace(/''/g, "'");
+
+    // Normalize double quotes in XPath attribute selectors [@id="" -> [@id='']
+    cleaned = cleaned.replace(
+      /\[@(id|name)=['"]{2}(.+?)['"]{2}\]/g,
+      "[@$1='$2']"
+    );
+
+    // For DOM selectors (id or name), remove ALL quotes
+    if (type === "id" || type === "name") {
+      cleaned = cleaned.replace(/['"]/g, "").trim();
+    }
+
+    if (type === "xpath" && isRecorded === "Y" && !val.startsWith("//"))
+      return null;
+
+    // Final check for empty strings
+    if (!cleaned || /^['"]{2}$/.test(cleaned)) return null;
+
+    return cleaned;
+  };
+
+  locators: for (const locator of record.locators) {
+    try {
+      const isRecorded = String(locator.isRecorded || "");
+      const recordedNLocators = record.locators.filter((l) => l.isRecorded === "N");
+
+      if (recordedNLocators.length > 0) {
+        for (const locator of recordedNLocators) {
+          createLocator(locator);
+        }
+      }
+
+      const isDynamic = String(locator.value || locator.type || "");
+      if (
+        isDynamic.includes("dynamic") ||
+        isDynamic.match("dynamic") ||
+        isDynamic.includes("{") ||
+        isDynamic.includes("}")
+      ) {
+        createLocator(locator);
+        continue;
+      }
+
+      if (record.isShared.includes("Y")) {
+        break locators;
+      }
+
+      for (const relation of relations) {
+        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")
+                ) {
+                  if (tempDiv.innerHTML) {
+                    const normalizedXPath = normalizeXPath(trimmedSelector);
+                    targetElement = getElementFromXPath(
+                      tempDiv,
+                      normalizedXPath
+                    );
+                    if (targetElement) {
+                      createLocator(locator, {
+                        value: trimmedSelector,
+                        isRecorded: String(locator.isRecorded).includes("N")
+                          ? "N"
+                          : "Y",
+                      });
+                    }
+                  }
+                } else {
+                  targetElement = currentElement.querySelector(trimmedSelector);
+                  if (!targetElement) {
+                    targetElement = getElementFromShadowRoot(
+                      currentElement,
+                      trimmedSelector
+                    );
+                  }
+                }
+
+                if (
+                  !targetElement &&
+                  isSvg(currentElement) &&
+                  !locator.type.match("dynamic")
+                ) {
+                  targetElement = currentElement.querySelector(trimmedSelector);
+                }
+                currentElement = targetElement;
+              } else {
+                console.error("Element not found at:", selector);
+                break;
+              }
+            }
+          }
+
+          const locatorExists = (name: string, value: string): boolean => {
+            const key = `${name}:${value}`;
+            return finalLocatorsSet.has(key);
+          };
+
+          if (targetElement) {
+            const idValue = getId(targetElement);
+            if (idValue && !locatorExists("id", idValue)) {
+              record.locators.forEach((loc) => {
+                createLocator(loc, {
+                  name: "id",
+                  value: idValue,
+                  isRecorded:
+                    loc.value === idValue && loc.name === "id"
+                      ? loc.isRecorded
+                      : "Y",
+                  isSelfHealed:
+                    loc.value === idValue && loc.name === "id"
+                      ? loc.isSelfHealed
+                      : "Y",
+                });
+              });
+            }
+
+            const textValue = getVisibleText(targetElement);
+            if (textValue) {
+              record.locators.forEach((loc) => {
+                createLocator(loc, {
+                  name: "linkText",
+                  type: "static",
+                  value: textValue,
+                  isRecorded: loc.value === textValue ? loc.isRecorded : "Y",
+                  isSelfHealed:
+                    loc.value === textValue ? loc.isSelfHealed : "Y",
+                });
+              });
+            }
+
+            const nameLocator = getName(targetElement);
+            if (nameLocator && !locatorExists("name", nameLocator)) {
+              record.locators.forEach((loc) => {
+                createLocator(loc, {
+                  name: "name",
+                  type: "static",
+                  value: nameLocator,
+                  isRecorded:
+                    loc.value === nameLocator && loc.name === "name"
+                      ? loc.isRecorded
+                      : "Y",
+                  isSelfHealed:
+                    loc.value === nameLocator && loc.name === "name"
+                      ? loc.isSelfHealed
+                      : "Y",
+                });
+              });
+            }
+
+            const classValue = getClassName(targetElement);
+            if (
+              classValue &&
+              classValue.trim() !== "" &&
+              !locatorExists("className", classValue)
+            ) {
+              record.locators.forEach((loc) => {
+                createLocator(loc, {
+                  name: "className",
+                  value: classValue,
+                  isRecorded:
+                    loc.value === classValue && loc.name === "className"
+                      ? loc.isRecorded
+                      : "Y",
+                  isSelfHealed:
+                    loc.value === classValue && loc.name === "className"
+                      ? loc.isSelfHealed
+                      : "Y",
+                });
+              });
+            }
+
+            const fnValue = parseDOM(targetElement, document, false, true);
+            record.locators.forEach((loc) => {
+              createLocator(loc, {
+                name: 'xpath',
+                value: fnValue,
+                isRecorded: fnValue?.find((x) => x.value === loc.value)
+                  ? loc.isRecorded
+                  : "Y",
+                isSelfHealed: fnValue?.find((x) => x.value === loc.value)
+                  ? loc.isSelfHealed
+                  : "Y",
+              });
+            });
+
+            for (const locator of record.locators) {
+              try {
+                for (const loc of record.locators) {
+                  if (!loc.value) continue;
+
+                  for (const relation of relations) {
+                    if (loc.value.includes(relation)) {
+                      const relativeXpath = checkReferenceElementIsValid(
+                        loc.value,
+                        relation,
+                        tempDiv
+                      );
+                      if (relativeXpath) {
+                        createLocator(loc, {
+                          name: "xpath",
+                          value: relativeXpath,
+                          isRecorded:
+                            locator.isRecorded !== "" &&
+                            locator.isRecorded !== null
+                              ? locator.isRecorded
+                              : "Y",
+                        });
+                        break;
+                      }
+                    }
+                  }
+                }
+              } catch (error) {
+                console.error("Error processing locator:", locator, error);
+              }
+            }
+
+            const finalAutoHealedLocators = finalLocators.map((obj) => ({
+              ...obj,
+              value: cleanLocatorValue(obj.value, obj.name, obj.isRecorded),
+            }));
+
+            const finalUniqueAutoHealedLocators: Locator[] =
+              finalAutoHealedLocators.reduce(
+                (unique: Locator[], locator: Locator) => {
+                  if (
+                    locator.value &&
+                    !unique.some((l: Locator) => l.value === locator.value)
+                  ) {
+                    unique.push(locator);
+                  }
+                  return unique;
+                },
+                [] as Locator[]
+              );
+
+            const jsonResult = [
+              {
+                name: `${record.name}`,
+                desc: `${record.desc}`,
+                type: `${record.type}`,
+                locators: finalUniqueAutoHealedLocators.filter(
+                  (locator) => locator?.value != null && locator.value !== ""
+                ),
+                isShared: `${record.isShared}`,
+                projectId: `${record.projectId}`,
+                projectType: `${record.projectType}`,
+                isRecorded: `${record.isRecorded}`,
+                folder: `${record.folder}`,
+                parentId: `${record.parentId}`,
+                parentName: `${record.parentName}`,
+                platform: `${record.platform}`,
+                licenseId: `${record.licenseId}`,
+                licenseType: `${record.licenseType}`,
+                userId: `${record.userId}`,
+              },
+            ];
+
+            return jsonResult;
+          }
+        } catch (error) {
+          console.error("Error processing locator:", locator, error);
+          continue;
+        }
+      }
+    } catch (error) {
+      console.error("Error processing locator:", locator, error);
+      continue;
+    }
+  }
+  return null;
+};
+
+export { getElementsFromHTML };