@skrillex1224/playwright-toolkit 2.1.243 → 2.1.245

package/dist/index.cjs

@@ -3439,6 +3439,11 @@ var DEFAULT_ACTIVATE_FALLBACK_TIMEOUT_MS = 900;
 var INTERACTIVE_SELECTOR = [
   "button",
   '[role="button"]',
+  '[role="link"]',
+  '[role="menuitem"]',
+  '[role="tab"]',
+  '[role="switch"]',
+  '[role="checkbox"]',
   "a[href]",
   "label",
   "input",
@@ -3453,6 +3458,34 @@ var EDITABLE_SELECTOR = [
   "textarea",
   '[contenteditable="true"]'
 ].join(",");
+var INTERACTIVE_HINT_PATTERN = [
+  "btn",
+  "button",
+  "send",
+  "submit",
+  "confirm",
+  "cancel",
+  "retry",
+  "reload",
+  "search",
+  "copy",
+  "share",
+  "close",
+  "more",
+  "\u53D1\u9001",
+  "\u63D0\u4EA4",
+  "\u786E\u5B9A",
+  "\u786E\u8BA4",
+  "\u53D6\u6D88",
+  "\u91CD\u8BD5",
+  "\u641C\u7D22",
+  "\u590D\u5236",
+  "\u5206\u4EAB",
+  "\u5173\u95ED",
+  "\u66F4\u591A",
+  "\u5C55\u5F00",
+  "\u6536\u8D77"
+].join("|");
 var clamp = (value, min, max) => Math.min(max, Math.max(min, value));
 var resolveViewport = (page) => page?.viewportSize?.() || { width: 390, height: 844 };
 var describeTarget = (target) => {
@@ -3492,7 +3525,47 @@ var withTimeout = async (operation, timeoutMs, label) => {
   }
 };
 var checkElementVisibility = async (element) => {
-  return element.evaluate((el, interactiveSelector) => {
+  return element.evaluate((el, { interactiveSelector, interactiveHintPattern }) => {
+    const interactiveHintRe = new RegExp(interactiveHintPattern, "i");
+    const nodeClassName = (node) => {
+      if (!node) return "";
+      if (typeof node.className === "string") return node.className;
+      if (node.className && typeof node.className.baseVal === "string") return node.className.baseVal;
+      return "";
+    };
+    const interactiveScore = (node) => {
+      if (!node || node.nodeType !== Node.ELEMENT_NODE) return 0;
+      let score = 0;
+      if (typeof node.matches === "function" && node.matches(interactiveSelector)) score += 8;
+      const hints = [
+        node.id || "",
+        nodeClassName(node),
+        node.getAttribute?.("aria-label") || "",
+        node.getAttribute?.("title") || "",
+        node.getAttribute?.("data-testid") || "",
+        node.getAttribute?.("data-test") || "",
+        node.getAttribute?.("data-click") || "",
+        node.getAttribute?.("data-action") || "",
+        node.getAttribute?.("onclick") || "",
+        String(node.textContent || "").trim().slice(0, 24)
+      ].join(" ");
+      if (interactiveHintRe.test(hints)) score += 4;
+      const style = window.getComputedStyle(node);
+      if (style?.cursor === "pointer") score += 2;
+      return score;
+    };
+    const closestInteractive = (node) => {
+      let best = null;
+      let bestScore = 0;
+      for (let current = node; current && current !== document.body; current = current.parentElement) {
+        const score = interactiveScore(current);
+        if (score > bestScore || score > 0 && score === bestScore) {
+          best = current;
+          bestScore = score;
+        }
+      }
+      return best;
+    };
     const targetStyle = window.getComputedStyle(el);
     if (!targetStyle || targetStyle.display === "none" || targetStyle.visibility === "hidden" || targetStyle.visibility === "collapse") {
       return { code: "NOT_INTERACTABLE", reason: "\u5143\u7D20\u4E0D\u53EF\u89C1", direction: "down" };
@@ -3554,16 +3627,13 @@ var checkElementVisibility = async (element) => {
         positioning
       };
     }
-    const targetInteractive = typeof el.closest === "function" ? el.closest(interactiveSelector) : null;
+    const targetInteractive = closestInteractive(el);
     const sameInteractiveTarget = (pointElement) => {
       if (!pointElement) return false;
       if (pointElement === el || el.contains(pointElement) || pointElement.contains(el)) {
         return true;
       }
-      if (!targetInteractive || typeof pointElement.closest !== "function") {
-        return false;
-      }
-      return pointElement.closest(interactiveSelector) === targetInteractive;
+      return Boolean(targetInteractive && closestInteractive(pointElement) === targetInteractive);
     };
     const describeElement = (node) => {
       if (!node) return null;
@@ -3610,10 +3680,53 @@ var checkElementVisibility = async (element) => {
       };
     }
     return { code: "VISIBLE", isFixed, positioning };
-  }, INTERACTIVE_SELECTOR);
+  }, {
+    interactiveSelector: INTERACTIVE_SELECTOR,
+    interactiveHintPattern: INTERACTIVE_HINT_PATTERN
+  });
 };
 var resolveSafeTapPoint = async (element) => {
-  return element.evaluate((el, interactiveSelector) => {
+  return element.evaluate((el, { interactiveSelector, interactiveHintPattern }) => {
+    const interactiveHintRe = new RegExp(interactiveHintPattern, "i");
+    const nodeClassName = (node) => {
+      if (!node) return "";
+      if (typeof node.className === "string") return node.className;
+      if (node.className && typeof node.className.baseVal === "string") return node.className.baseVal;
+      return "";
+    };
+    const interactiveScore = (node) => {
+      if (!node || node.nodeType !== Node.ELEMENT_NODE) return 0;
+      let score = 0;
+      if (typeof node.matches === "function" && node.matches(interactiveSelector)) score += 8;
+      const hints = [
+        node.id || "",
+        nodeClassName(node),
+        node.getAttribute?.("aria-label") || "",
+        node.getAttribute?.("title") || "",
+        node.getAttribute?.("data-testid") || "",
+        node.getAttribute?.("data-test") || "",
+        node.getAttribute?.("data-click") || "",
+        node.getAttribute?.("data-action") || "",
+        node.getAttribute?.("onclick") || "",
+        String(node.textContent || "").trim().slice(0, 24)
+      ].join(" ");
+      if (interactiveHintRe.test(hints)) score += 4;
+      const style = window.getComputedStyle(node);
+      if (style?.cursor === "pointer") score += 2;
+      return score;
+    };
+    const closestInteractive = (node) => {
+      let best = null;
+      let bestScore = 0;
+      for (let current = node; current && current !== document.body; current = current.parentElement) {
+        const score = interactiveScore(current);
+        if (score > bestScore || score > 0 && score === bestScore) {
+          best = current;
+          bestScore = score;
+        }
+      }
+      return best;
+    };
     const rect = el.getBoundingClientRect();
     if (!rect || rect.width <= 0 || rect.height <= 0) {
       return null;
@@ -3650,16 +3763,13 @@ var resolveSafeTapPoint = async (element) => {
     if (visibleWidth <= 1 || visibleHeight <= 1) {
       return null;
     }
-    const targetInteractive = typeof el.closest === "function" ? el.closest(interactiveSelector) : null;
+    const targetInteractive = closestInteractive(el);
     const sameInteractiveTarget = (pointElement) => {
       if (!pointElement) return false;
       if (pointElement === el || el.contains(pointElement) || pointElement.contains(el)) {
         return true;
       }
-      if (!targetInteractive || typeof pointElement.closest !== "function") {
-        return false;
-      }
-      return pointElement.closest(interactiveSelector) === targetInteractive;
+      return Boolean(targetInteractive && closestInteractive(pointElement) === targetInteractive);
     };
     const cx = visibleLeft + visibleWidth / 2;
     const cy = visibleTop + visibleHeight / 2;
@@ -3687,14 +3797,53 @@ var resolveSafeTapPoint = async (element) => {
       x: chosen.x,
       y: chosen.y
     };
-  }, INTERACTIVE_SELECTOR);
+  }, {
+    interactiveSelector: INTERACTIVE_SELECTOR,
+    interactiveHintPattern: INTERACTIVE_HINT_PATTERN
+  });
 };
 var activateElementFallback = async (element, point = null, options = {}) => {
-  return element.evaluate((el, { innerPoint, innerOptions, interactiveSelector, editableSelector }) => {
+  return element.evaluate((el, { innerPoint, innerOptions, interactiveSelector, editableSelector, interactiveHintPattern }) => {
+    const interactiveHintRe = new RegExp(interactiveHintPattern, "i");
+    const nodeClassName = (node) => {
+      if (!node) return "";
+      if (typeof node.className === "string") return node.className;
+      if (node.className && typeof node.className.baseVal === "string") return node.className.baseVal;
+      return "";
+    };
+    const interactiveScore = (node) => {
+      if (!node || node.nodeType !== Node.ELEMENT_NODE) return 0;
+      let score = 0;
+      if (typeof node.matches === "function" && node.matches(interactiveSelector)) score += 8;
+      const hints = [
+        node.id || "",
+        nodeClassName(node),
+        node.getAttribute?.("aria-label") || "",
+        node.getAttribute?.("title") || "",
+        node.getAttribute?.("data-testid") || "",
+        node.getAttribute?.("data-test") || "",
+        node.getAttribute?.("data-click") || "",
+        node.getAttribute?.("data-action") || "",
+        node.getAttribute?.("onclick") || "",
+        String(node.textContent || "").trim().slice(0, 24)
+      ].join(" ");
+      if (interactiveHintRe.test(hints)) score += 4;
+      const style = window.getComputedStyle(node);
+      if (style?.cursor === "pointer") score += 2;
+      return score;
+    };
     const pointElement = innerPoint ? document.elementFromPoint(innerPoint.x, innerPoint.y) : null;
     const nearestInteractive = (node) => {
-      if (!node || typeof node.closest !== "function") return null;
-      return node.closest(interactiveSelector);
+      let best = null;
+      let bestScore = 0;
+      for (let current = node; current && current !== document.body; current = current.parentElement) {
+        const score = interactiveScore(current);
+        if (score > bestScore || score > 0 && score === bestScore) {
+          best = current;
+          bestScore = score;
+        }
+      }
+      return best;
     };
     const targetInteractive = nearestInteractive(el);
     const pointInteractive = nearestInteractive(pointElement);
@@ -3726,7 +3875,8 @@ var activateElementFallback = async (element, point = null, options = {}) => {
     innerPoint: point,
     innerOptions: options || {},
     interactiveSelector: INTERACTIVE_SELECTOR,
-    editableSelector: EDITABLE_SELECTOR
+    editableSelector: EDITABLE_SELECTOR,
+    interactiveHintPattern: INTERACTIVE_HINT_PATTERN
   });
 };
 var getScrollableRect = async (element) => {
@@ -3830,6 +3980,47 @@ var scrollAwayFromObstruction = async (element, status) => {
     };
   }, status);
 };
+var getElementViewportSnapshot = async (element) => {
+  return element.evaluate((el) => {
+    const rect = el.getBoundingClientRect();
+    return {
+      top: rect.top,
+      bottom: rect.bottom,
+      left: rect.left,
+      right: rect.right,
+      width: rect.width,
+      height: rect.height,
+      scrollX: window.scrollX,
+      scrollY: window.scrollY
+    };
+  });
+};
+var isTargetImmobileAfterScroll = (before, after) => {
+  if (!before || !after) return false;
+  const rectDeltaY = Number(after.top || 0) - Number(before.top || 0);
+  const rectDeltaX = Number(after.left || 0) - Number(before.left || 0);
+  const scrollDeltaY = Number(after.scrollY || 0) - Number(before.scrollY || 0);
+  const scrollDeltaX = Number(after.scrollX || 0) - Number(before.scrollX || 0);
+  const rectMoved = Math.abs(rectDeltaY) > 3 || Math.abs(rectDeltaX) > 3;
+  const pageMoved = Math.abs(scrollDeltaY) > 3 || Math.abs(scrollDeltaX) > 3;
+  if (!rectMoved && !pageMoved) return true;
+  if (pageMoved && !rectMoved) return true;
+  if (Math.abs(scrollDeltaY) > 12 && Math.abs(rectDeltaY) < Math.min(12, Math.abs(scrollDeltaY) * 0.2)) {
+    return true;
+  }
+  return false;
+};
+var restoreWindowFromSnapshot = async (page, before, after) => {
+  if (!before || !after) return;
+  if (Math.abs(Number(after.scrollX || 0) - Number(before.scrollX || 0)) <= 2 && Math.abs(Number(after.scrollY || 0) - Number(before.scrollY || 0)) <= 2) {
+    return;
+  }
+  await page.evaluate(
+    (state) => window.scrollTo(state.x, state.y),
+    { x: Number(before.scrollX || 0), y: Number(before.scrollY || 0) }
+  ).catch(() => {
+  });
+};
 var dispatchTouchSwipe = async (page, deltaY, options = {}) => {
   const viewport = resolveViewport(page);
   const rawRect = options.rect || null;
@@ -4010,11 +4201,11 @@ var MobileHumanize = {
       const scrollRect = await getScrollableRect(element);
       if (!scrollRect && status.isFixed && status.code === "OUT_OF_VIEWPORT") {
         logger7.warn(`humanScroll | fixed/sticky \u76EE\u6807\u4E0D\u5728\u89C6\u53E3\u5185\uFF0C\u9875\u9762\u6EDA\u52A8\u65E0\u6CD5\u6539\u53D8\u5176\u4F4D\u7F6E (direction=${status.direction || "unknown"})`);
-        return { element, didScroll, restore: null };
+        return { element, didScroll, restore: null, unscrollable: true };
       }
       if (!scrollRect && status.isFixed && status.code === "OBSTRUCTED") {
         logger7.warn(`humanScroll | fixed/sticky \u76EE\u6807\u88AB\u906E\u6321\uFF0C\u6EDA\u52A8\u65E0\u6CD5\u89E3\u9664 (${status.obstruction?.tag || "unknown"})`);
-        return { element, didScroll, restore: null };
+        return { element, didScroll, restore: null, unscrollable: true };
       }
       if (scrollRect && status.code === "OBSTRUCTED" && status.obstruction?.isFixed) {
         const moved = await scrollAwayFromObstruction(element, status);
@@ -4045,6 +4236,7 @@ var MobileHumanize = {
         }
       }
       const beforeWindowState = scrollRect ? await page.evaluate(() => ({ x: window.scrollX, y: window.scrollY })) : null;
+      const beforeElementSnapshot = await getElementViewportSnapshot(element).catch(() => null);
       const beforeState = scrollRect ? await element.evaluate((el) => {
         const isScrollable = (node) => {
           const style = window.getComputedStyle(node);
@@ -4074,6 +4266,21 @@ var MobileHumanize = {
           logger7.debug(`humanScroll | \u7A97\u53E3\u6EDA\u52A8\u56DE\u6536 from=${Math.round(afterWindowState.y)} to=${Math.round(beforeWindowState.y)}`);
         }
       }
+      let afterElementSnapshot = null;
+      const readAfterElementSnapshot = async () => {
+        if (!afterElementSnapshot) {
+          afterElementSnapshot = await getElementViewportSnapshot(element).catch(() => null);
+        }
+        return afterElementSnapshot;
+      };
+      if (!scrollRect && beforeElementSnapshot) {
+        const afterSnapshot = await readAfterElementSnapshot();
+        if (isTargetImmobileAfterScroll(beforeElementSnapshot, afterSnapshot)) {
+          await restoreWindowFromSnapshot(page, beforeElementSnapshot, afterSnapshot);
+          logger7.warn(`humanScroll | \u76EE\u6807\u4E0D\u968F\u9875\u9762\u6EDA\u52A8\u79FB\u52A8\uFF0C\u9875\u9762\u6EDA\u52A8\u65E0\u6CD5\u6539\u53D8\u5176\u4F4D\u7F6E (status=${status.code}, direction=${status.direction || "unknown"})`);
+          return { element, didScroll, restore: null, unscrollable: true };
+        }
+      }
       if (scrollRect && beforeState) {
         const afterState = await element.evaluate((el) => {
           const isScrollable = (node) => {
@@ -4111,6 +4318,14 @@ var MobileHumanize = {
           }
         }
       }
+      if (scrollRect && beforeElementSnapshot) {
+        const afterSnapshot = await getElementViewportSnapshot(element).catch(() => null);
+        if (isTargetImmobileAfterScroll(beforeElementSnapshot, afterSnapshot)) {
+          await restoreWindowFromSnapshot(page, beforeElementSnapshot, afterSnapshot);
+          logger7.warn(`humanScroll | \u76EE\u6807\u4E0D\u968F\u6EDA\u52A8\u5BB9\u5668\u79FB\u52A8\uFF0C\u6EDA\u52A8\u65E0\u6CD5\u6539\u53D8\u5176\u4F4D\u7F6E (status=${status.code}, direction=${status.direction || "unknown"})`);
+          return { element, didScroll, restore: null, unscrollable: true };
+        }
+      }
       didScroll = true;
     }
     try {
@@ -4160,21 +4375,28 @@ var MobileHumanize = {
         logger7.warn(`humanClick: \u5143\u7D20\u4E0D\u5B58\u5728\uFF0C\u8DF3\u8FC7\u70B9\u51FB ${targetDesc}`);
         return false;
       }
-      if (scrollIfNeeded) {
-        await MobileHumanize.humanScroll(page, element, { throwOnMissing });
-      }
+      const scrollResult = scrollIfNeeded ? await MobileHumanize.humanScroll(page, element, { throwOnMissing }) : null;
       const status = await checkElementVisibility(element).catch(() => null);
       if (status && status.code !== "VISIBLE") {
-        if (fallbackDomClick && status.isFixed && status.code === "OUT_OF_VIEWPORT") {
-          const fallback = await withTimeout(
+        if (fallbackDomClick && (status.code === "OUT_OF_VIEWPORT" || status.code === "OBSTRUCTED") && (status.isFixed || scrollResult?.unscrollable)) {
+          let fallback = await withTimeout(
             () => activateElementFallback(element, null, {
               editableOnly: true
             }),
             activateFallbackTimeoutMs,
             "focus fallback"
           ).catch(() => null);
+          if (!fallback?.activated) {
+            fallback = await withTimeout(
+              () => activateElementFallback(element, null, {
+                editableOnly: false
+              }),
+              activateFallbackTimeoutMs,
+              "activation fallback"
+            ).catch(() => null);
+          }
           if (fallback?.activated) {
-            logger7.warn(`humanClick: fixed/sticky \u76EE\u6807\u4E0D\u5728\u89C6\u53E3\u5185\uFF0C\u5DF2\u7528 ${fallback.method} \u6FC0\u6D3B`);
+            logger7.warn(`humanClick: \u4E0D\u53EF\u6EDA\u52A8\u76EE\u6807\u4E0D\u53EF\u7269\u7406\u70B9\u51FB\uFF0C\u5DF2\u7528 ${fallback.method} \u6FC0\u6D3B`);
             return true;
           }
         }
@@ -4291,6 +4513,20 @@ var MobileHumanize = {
     const locator = page.locator(selector);
     await MobileHumanize.humanClick(page, locator, { scrollIfNeeded: true });
     await waitJitter(160, 0.4);
+    const readValue = async () => {
+      try {
+        return await locator.inputValue({ timeout: 600 });
+      } catch {
+        return await locator.evaluate((el) => "value" in el ? String(el.value || "") : String(el.textContent || "")).catch(() => "");
+      }
+    };
+    const currentValue = await readValue();
+    if (!currentValue) return;
+    await page.keyboard.press("ControlOrMeta+A");
+    await waitJitter(90, 0.35);
+    await page.keyboard.press("Backspace");
+    await waitJitter(120, 0.35);
+    if (!await readValue()) return;
     await locator.evaluate((el) => {
       if ("value" in el) {
         el.value = "";