@midscene/shared 0.12.4 → 0.12.5-beta-20250306111616.0

package/dist/es/{constants.js → constants/index.js}

@@ -1,8 +1,7 @@
-// src/constants/index.ts
-var TEXT_SIZE_THRESHOLD = 9;
-var TEXT_MAX_SIZE = 40;
-var CONTAINER_MINI_HEIGHT = 3;
-var CONTAINER_MINI_WIDTH = 3;
+const TEXT_SIZE_THRESHOLD = 9;
+const TEXT_MAX_SIZE = 40;
+const CONTAINER_MINI_HEIGHT = 3;
+const CONTAINER_MINI_WIDTH = 3;
 var NodeType = /* @__PURE__ */ ((NodeType2) => {
   NodeType2["CONTAINER"] = "CONTAINER Node";
   NodeType2["FORM_ITEM"] = "FORM_ITEM Node";

package/dist/es/extractor/client-extractor.js

@@ -0,0 +1,161 @@
+import { NodeType } from "./constants";
+import { midsceneGenerateHash } from "./util";
+function getNodeAttributes(node) {
+  const attrs = {};
+  if (node && node.nodeType === 1) {
+    const element = node;
+    for (let i = 0; i < element.attributes.length; i++) {
+      const attr = element.attributes[i];
+      attrs[attr.nodeName] = attr.nodeValue ?? "";
+    }
+  }
+  return attrs;
+}
+function getRect(attributes) {
+  const x = Math.round(Number.parseFloat(attributes.x ?? "0"));
+  const y = Math.round(Number.parseFloat(attributes.y ?? "0"));
+  const width = Math.round(Number.parseFloat(attributes.width ?? "0"));
+  const height = Math.round(Number.parseFloat(attributes.height ?? "0"));
+  return {
+    left: Math.max(0, Math.floor(x)),
+    top: Math.max(0, Math.floor(y)),
+    width: Math.max(0, width),
+    height: Math.max(0, height)
+  };
+}
+function validTextNodeContent(node) {
+  if (node.nodeType === 3) {
+    return node.nodeValue?.trim() || "";
+  }
+  return "";
+}
+function getXPathForElement(element) {
+  if (element.nodeType !== 1) {
+    return "";
+  }
+  const getIndex = (sib, name) => {
+    let count = 1;
+    for (let cur = sib.previousSibling; cur; cur = cur.previousSibling) {
+      if (cur.nodeType === 1 && cur.nodeName === name) {
+        count++;
+      }
+    }
+    return count;
+  };
+  const buildAttributePart = (elem) => {
+    const attributes = ["id", "resource-id", "content-desc", "class"];
+    for (const attr of attributes) {
+      if (elem.hasAttribute(attr)) {
+        const value = elem.getAttribute(attr);
+        if (value && value.trim() !== "") {
+          return `[@${attr}="${value}"]`;
+        }
+      }
+    }
+    return "";
+  };
+  const getPath = (node, path = "") => {
+    if (node.parentNode) {
+      path = getPath(node.parentNode, path);
+    }
+    if (node.nodeType === 1) {
+      const elem = node;
+      const tagName = elem.nodeName.toLowerCase();
+      let part = `/${tagName}`;
+      const attributePart = buildAttributePart(elem);
+      if (attributePart) {
+        part += attributePart;
+      } else {
+        const index = getIndex(node, node.nodeName);
+        if (index > 1) {
+          part += `[${index}]`;
+        }
+      }
+      path += part;
+    }
+    return path;
+  };
+  return getPath(element);
+}
+function extractTextWithPosition(initNode) {
+  const elementInfoArray = [];
+  let nodeIndex = 1;
+  function dfs(node, parentNode = null) {
+    if (!node) {
+      return;
+    }
+    const currentNodeDes = { node, children: [] };
+    if (parentNode) {
+      parentNode.children.push(currentNodeDes);
+    }
+    collectElementInfo(node);
+    if (node.childNodes && node.childNodes.length > 0) {
+      for (let i = 0; i < node.childNodes.length; i++) {
+        dfs(node.childNodes[i], currentNodeDes);
+      }
+    }
+  }
+  function collectElementInfo(node) {
+    const attributes = getNodeAttributes(node);
+    const rect = getRect(attributes);
+    const nodeHashId = midsceneGenerateHash(null, attributes.placeholder, rect);
+    const text = validTextNodeContent(node);
+    let nodeType;
+    switch (node.nodeName.toUpperCase()) {
+      case "TEXT":
+        nodeType = NodeType.TEXT;
+        break;
+      case "IMAGE":
+        nodeType = NodeType.IMG;
+        break;
+      case "BUTTON":
+        nodeType = NodeType.BUTTON;
+        break;
+      case "SEARCHINPUT":
+      case "TEXTINPUT":
+      case "INPUT":
+        nodeType = NodeType.FORM_ITEM;
+        break;
+      case "NAV":
+      case "LIST":
+      case "CELL":
+        nodeType = NodeType.CONTAINER;
+        break;
+      default:
+        if (attributes.id === "android:id/input" || attributes.id === "android:id/inputArea") {
+          nodeType = NodeType.FORM_ITEM;
+        } else {
+          nodeType = NodeType.CONTAINER;
+        }
+        break;
+    }
+    const xpath = getXPathForElement(node);
+    const elementInfo = {
+      id: nodeHashId,
+      indexId: nodeIndex++,
+      nodeHashId,
+      locator: xpath,
+      attributes: {
+        nodeType,
+        ...attributes
+      },
+      content: text,
+      rect,
+      center: [
+        Math.round(rect.left + rect.width / 2),
+        Math.round(rect.top + rect.height / 2)
+      ],
+      nodeType
+    };
+    if (elementInfo.nodeType !== NodeType.CONTAINER) {
+      elementInfoArray.push(elementInfo);
+    }
+  }
+  const rootNode = initNode;
+  const rootDescriptor = { node: rootNode, children: [] };
+  dfs(rootNode, rootDescriptor);
+  return elementInfoArray;
+}
+export {
+  extractTextWithPosition
+};

package/dist/es/extractor/constants.js

@@ -0,0 +1,10 @@
+import {
+  NodeType,
+  TEXT_MAX_SIZE,
+  TEXT_SIZE_THRESHOLD
+} from "../constants";
+export {
+  NodeType,
+  TEXT_MAX_SIZE,
+  TEXT_SIZE_THRESHOLD
+};

package/dist/es/extractor/debug.js

@@ -0,0 +1,9 @@
+import { webExtractTextWithPosition } from ".";
+import {
+  setExtractTextWithPositionOnWindow,
+  setMidsceneVisibleRectOnWindow
+} from "./util";
+console.log(webExtractTextWithPosition(document.body, true));
+console.log(JSON.stringify(webExtractTextWithPosition(document.body, true)));
+setExtractTextWithPositionOnWindow();
+setMidsceneVisibleRectOnWindow();

package/dist/es/extractor/dom-util.js

@@ -0,0 +1,73 @@
+function isFormElement(node) {
+  return node instanceof HTMLElement && (node.tagName.toLowerCase() === "input" || node.tagName.toLowerCase() === "textarea" || node.tagName.toLowerCase() === "select" || node.tagName.toLowerCase() === "option");
+}
+function isButtonElement(node) {
+  return node instanceof HTMLElement && node.tagName.toLowerCase() === "button";
+}
+function isImgElement(node) {
+  if (!includeBaseElement(node) && node instanceof Element) {
+    const computedStyle = window.getComputedStyle(node);
+    const backgroundImage = computedStyle.getPropertyValue("background-image");
+    if (backgroundImage !== "none") {
+      return true;
+    }
+  }
+  if (isIconfont(node)) {
+    return true;
+  }
+  return node instanceof HTMLElement && node.tagName.toLowerCase() === "img" || node instanceof SVGElement && node.tagName.toLowerCase() === "svg";
+}
+function isIconfont(node) {
+  if (node instanceof Element) {
+    const computedStyle = window.getComputedStyle(node);
+    const fontFamilyValue = computedStyle.fontFamily || "";
+    return fontFamilyValue.toLowerCase().indexOf("iconfont") >= 0;
+  }
+  return false;
+}
+function isTextElement(node) {
+  return node.nodeName.toLowerCase() === "#text" && !isIconfont(node);
+}
+function isContainerElement(node) {
+  if (!(node instanceof HTMLElement))
+    return false;
+  if (includeBaseElement(node)) {
+    return false;
+  }
+  const computedStyle = window.getComputedStyle(node);
+  const backgroundColor = computedStyle.getPropertyValue("background-color");
+  if (backgroundColor) {
+    return true;
+  }
+  return false;
+}
+function includeBaseElement(node) {
+  if (!(node instanceof HTMLElement))
+    return false;
+  if (node.innerText) {
+    return true;
+  }
+  const includeList = [
+    "svg",
+    "button",
+    "input",
+    "textarea",
+    "select",
+    "option",
+    "img"
+  ];
+  for (const tagName of includeList) {
+    const element = node.querySelectorAll(tagName);
+    if (element.length > 0) {
+      return true;
+    }
+  }
+  return false;
+}
+export {
+  isButtonElement,
+  isContainerElement,
+  isFormElement,
+  isImgElement,
+  isTextElement
+};

package/dist/es/extractor/index.js

@@ -0,0 +1,14 @@
+import { descriptionOfTree, traverseTree, treeToList } from "./tree";
+import { extractTextWithPosition } from "./web-extractor";
+import { extractTextWithPosition as extractTextWithPosition2 } from "./client-extractor";
+import { extractTreeNode } from "./web-extractor";
+import { extractTreeNodeAsString } from "./web-extractor";
+export {
+  extractTextWithPosition2 as clientExtractTextWithPosition,
+  descriptionOfTree,
+  traverseTree,
+  treeToList,
+  extractTreeNode as webExtractNodeTree,
+  extractTreeNodeAsString as webExtractNodeTreeAsString,
+  extractTextWithPosition as webExtractTextWithPosition
+};

package/dist/es/extractor/tree.js

@@ -0,0 +1,126 @@
+function truncateText(text, maxLength = 150) {
+  if (typeof text === "undefined") {
+    return "";
+  }
+  if (typeof text === "object") {
+    text = JSON.stringify(text);
+  }
+  if (typeof text === "number") {
+    return text.toString();
+  }
+  if (typeof text === "string" && text.length > maxLength) {
+    return `${text.slice(0, maxLength)}...`;
+  }
+  if (typeof text === "string") {
+    return text.trim();
+  }
+  return "";
+}
+function trimAttributes(attributes, truncateTextLength) {
+  const tailorAttributes = Object.keys(attributes).reduce(
+    (res, currentKey) => {
+      const attributeVal = attributes[currentKey];
+      if (currentKey === "style" || currentKey === "src" || currentKey === "htmlTagName" || currentKey === "nodeType") {
+        return res;
+      }
+      res[currentKey] = truncateText(attributeVal, truncateTextLength);
+      return res;
+    },
+    {}
+  );
+  return tailorAttributes;
+}
+const nodeSizeThreshold = 4;
+function descriptionOfTree(tree, truncateTextLength, filterNonTextContent = false) {
+  const attributesString = (kv) => {
+    return Object.entries(kv).map(
+      ([key, value]) => `${key}="${truncateText(value, truncateTextLength)}"`
+    ).join(" ");
+  };
+  function buildContentTree(node, indent = 0) {
+    let before = "";
+    let contentWithIndent = "";
+    let after = "";
+    let emptyNode = true;
+    const indentStr = "  ".repeat(indent);
+    let children = "";
+    for (let i = 0; i < (node.children || []).length; i++) {
+      const childContent = buildContentTree(node.children[i], indent + 1);
+      if (childContent) {
+        children += `
+${childContent}`;
+      }
+    }
+    if (node.node && node.node.rect.width > nodeSizeThreshold && node.node.rect.height > nodeSizeThreshold && (!filterNonTextContent || filterNonTextContent && node.node.content)) {
+      emptyNode = false;
+      let nodeTypeString;
+      if (node.node.attributes?.htmlTagName) {
+        nodeTypeString = node.node.attributes.htmlTagName.replace(/[<>]/g, "");
+      } else {
+        nodeTypeString = node.node.attributes.nodeType.replace(/\sNode$/, "").toLowerCase();
+      }
+      const markerId = node.node.indexId;
+      const markerIdString = markerId ? `markerId="${markerId}"` : "";
+      const rectAttribute = node.node.rect ? {
+        left: node.node.rect.left,
+        top: node.node.rect.top,
+        width: node.node.rect.width,
+        height: node.node.rect.height
+      } : {};
+      before = `<${nodeTypeString} id="${node.node.id}" ${markerIdString} ${attributesString(trimAttributes(node.node.attributes || {}, truncateTextLength))} ${attributesString(rectAttribute)}>`;
+      const content = truncateText(node.node.content, truncateTextLength);
+      contentWithIndent = content ? `
+${indentStr}  ${content}` : "";
+      after = `</${nodeTypeString}>`;
+    } else if (!filterNonTextContent) {
+      if (!children.trim().startsWith("<>")) {
+        before = "<>";
+        contentWithIndent = "";
+        after = "</>";
+      }
+    }
+    if (emptyNode && !children.trim()) {
+      return "";
+    }
+    const result2 = `${indentStr}${before}${contentWithIndent}${children}
+${indentStr}${after}`;
+    if (result2.trim()) {
+      return result2;
+    }
+    return "";
+  }
+  const result = buildContentTree(tree);
+  return result.replace(/^\s*\n/gm, "");
+}
+function treeToList(tree) {
+  const result = [];
+  function dfs(node) {
+    if (node.node) {
+      result.push(node.node);
+    }
+    for (const child of node.children) {
+      dfs(child);
+    }
+  }
+  dfs(tree);
+  return result;
+}
+function traverseTree(tree, onNode) {
+  function dfs(node) {
+    if (node.node) {
+      node.node = onNode(node.node);
+    }
+    for (const child of node.children) {
+      dfs(child);
+    }
+  }
+  dfs(tree);
+  return tree;
+}
+export {
+  descriptionOfTree,
+  traverseTree,
+  treeToList,
+  trimAttributes,
+  truncateText
+};