@one2x/playwright 1.57.0-alpha.16 → 1.57.0-alpha.18

package/lib/mcp/browser/tools/mouse.js

@@ -180,15 +180,47 @@ const inspectAtXY = (0, import_tool.defineTabTool)({
         }
         return true;
       });
+      const consolidatedElements = [];
+      const svgSet = /* @__PURE__ */ new Set();
+      for (const element of meaningfulElements) {
+        let current = element;
+        let parentSVG = null;
+        while (current) {
+          if (current.tagName === "svg") {
+            parentSVG = current;
+            break;
+          }
+          current = current.parentElement;
+        }
+        if (parentSVG) {
+          if (!svgSet.has(parentSVG)) {
+            svgSet.add(parentSVG);
+            consolidatedElements.push(parentSVG);
+          }
+        } else {
+          consolidatedElements.push(element);
+        }
+      }
       const sortedElements = [];
       const processed = /* @__PURE__ */ new Set();
-      const meaningfulSet = new Set(meaningfulElements);
+      const consolidatedSet = new Set(consolidatedElements);
       for (const point of points) {
         const elements = document.elementsFromPoint(point.x, point.y);
         for (const el of elements) {
-          if (meaningfulSet.has(el) && !processed.has(el)) {
-            sortedElements.push(el);
-            processed.add(el);
+          let elementToCheck = el;
+          if (el.tagName !== "svg") {
+            let current = el;
+            while (current) {
+              if (current.tagName === "svg") {
+                elementToCheck = current;
+                break;
+              }
+              current = current.parentElement;
+            }
+          }
+          if (consolidatedSet.has(elementToCheck) && !processed.has(elementToCheck)) {
+            sortedElements.push(elementToCheck);
+            processed.add(elementToCheck);
           }
         }
       }
@@ -294,6 +326,30 @@ const inspectAtXY = (0, import_tool.defineTabTool)({
         const distanceToCenter = Math.sqrt(
           Math.pow(elementCenterX - centerPoint.x, 2) + Math.pow(elementCenterY - centerPoint.y, 2)
         );
+        let svgColors = null;
+        if (element.tagName.toLowerCase() === "svg") {
+          const colorSet = /* @__PURE__ */ new Set();
+          const fillSet = /* @__PURE__ */ new Set();
+          const strokeSet = /* @__PURE__ */ new Set();
+          const allDescendants = element.querySelectorAll("*");
+          for (const descendant of Array.from(allDescendants)) {
+            const style = window.getComputedStyle(descendant);
+            const fill = descendant.getAttribute("fill") || style.fill;
+            if (fill && fill !== "none" && fill !== "transparent" && !fill.startsWith("url("))
+              fillSet.add(fill);
+            const stroke = descendant.getAttribute("stroke") || style.stroke;
+            if (stroke && stroke !== "none" && stroke !== "transparent" && !stroke.startsWith("url("))
+              strokeSet.add(stroke);
+            const color = style.color;
+            if (color && color !== "transparent")
+              colorSet.add(color);
+          }
+          svgColors = {
+            colors: Array.from(colorSet),
+            fills: Array.from(fillSet),
+            strokes: Array.from(strokeSet)
+          };
+        }
         return {
           ref: ariaRef?.ref || null,
           role: ariaRef?.role || null,
@@ -303,6 +359,7 @@ const inspectAtXY = (0, import_tool.defineTabTool)({
           bounds,
           containsCenterPoint,
           distanceToCenter,
+          svgColors,
           computedStyles: {
             display: computedStyle.display,
             visibility: computedStyle.visibility,
@@ -448,6 +505,29 @@ ${elementInfo.truncatedHTML}
       if (!elementInfo.containsCenterPoint)
         result += `- Distance to center: ${Math.round(elementInfo.distanceToCenter)}px
 `;
+      if (elementInfo.svgColors) {
+        result += `
+**SVG Colors (from descendants):**
+`;
+        if (elementInfo.svgColors.fills.length > 0)
+          result += `- Fill colors: ${elementInfo.svgColors.fills.join(", ")}
+`;
+        else
+          result += `- Fill colors: none
+`;
+        if (elementInfo.svgColors.strokes.length > 0)
+          result += `- Stroke colors: ${elementInfo.svgColors.strokes.join(", ")}
+`;
+        else
+          result += `- Stroke colors: none
+`;
+        if (elementInfo.svgColors.colors.length > 0)
+          result += `- Text colors: ${elementInfo.svgColors.colors.join(", ")}
+`;
+        else
+          result += `- Text colors: none
+`;
+      }
       result += `
 **Key Computed Styles:**
 `;

package/lib/mcp/browser/tools/snapshot.js

@@ -88,13 +88,11 @@ const click = (0, import_tool.defineTabTool)({
         options
       );
     });
-    if (!result)
-      return;
-    if (result.mode === "auto" && result.interceptorInfo) {
+    if (result?.mode === "auto" && result.interceptorInfo) {
       const actionName = params.doubleClick ? ".dblclick({ allowIntercept: true })" : ".click({ allowIntercept: true })";
       (0, import_utils.addInterceptorWarning)(response, resolved, actionName, result.interceptorInfo);
     }
-    const needsAllowIntercept = result.mode === "auto" && result.interceptorInfo || result.mode === "always";
+    const needsAllowIntercept = result?.mode === "auto" && result.interceptorInfo || result?.mode === "always";
     const finalOptions = needsAllowIntercept ? { ...options, allowIntercept: true } : options;
     const formatted = javascript.formatObject(finalOptions, " ", "oneline");
     const optionsAttr = formatted !== "{}" ? formatted : "";
@@ -132,11 +130,9 @@ const drag = (0, import_tool.defineTabTool)({
         {}
       );
     });
-    if (!result)
-      return;
-    if (result.mode === "auto" && result.interceptorInfo)
+    if (result?.mode === "auto" && result.interceptorInfo)
       (0, import_utils.addInterceptorWarning)(response, start.resolved, ".dragTo(target, { allowIntercept: true })", result.interceptorInfo);
-    const needsAllowIntercept = result.mode === "auto" && result.interceptorInfo || result.mode === "always";
+    const needsAllowIntercept = result?.mode === "auto" && result.interceptorInfo || result?.mode === "always";
     const optionsAttr = needsAllowIntercept ? ", { allowIntercept: true }" : "";
     response.addCode(`await page.${start.resolved}.dragTo(page.${end.resolved}${optionsAttr});`);
     response.setIncludeAutoScreenshot();
@@ -161,11 +157,9 @@ const hover = (0, import_tool.defineTabTool)({
         {}
       );
     });
-    if (!result)
-      return;
-    if (result.mode === "auto" && result.interceptorInfo)
+    if (result?.mode === "auto" && result.interceptorInfo)
       (0, import_utils.addInterceptorWarning)(response, resolved, ".hover({ allowIntercept: true })", result.interceptorInfo);
-    const needsAllowIntercept = result.mode === "auto" && result.interceptorInfo || result.mode === "always";
+    const needsAllowIntercept = result?.mode === "auto" && result.interceptorInfo || result?.mode === "always";
     const optionsAttr = needsAllowIntercept ? "{ allowIntercept: true }" : "";
     response.addCode(`await page.${resolved}.hover(${optionsAttr});`);
     response.setIncludeAutoScreenshot();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@one2x/playwright",
-  "version": "1.57.0-alpha.16",
+  "version": "1.57.0-alpha.18",
   "description": "A high-level API to automate web browsers",
   "repository": {
     "type": "git",
@@ -65,7 +65,7 @@
   "license": "Apache-2.0",
   "dependencies": {
     "content-type": "^1.0.5",
-    "playwright-core": "npm:@one2x/playwright-core@1.57.0-alpha.16",
+    "playwright-core": "npm:@one2x/playwright-core@1.57.0-alpha.18",
     "raw-body": "^2.5.2"
   },
   "optionalDependencies": {