@stablyai/playwright-base 0.1.8-next.2 → 0.1.9

package/dist/index.cjs

@@ -67,7 +67,7 @@ var isObject = (value) => {
 // src/ai/metadata.ts
 var SDK_METADATA_HEADERS = {
   "X-Client-Name": "stably-playwright-sdk-js",
-  "X-Client-Version": "0.1.8-next.2"
+  "X-Client-Version": "0.1.9"
 };
 
 // src/ai/extract.ts
@@ -167,6 +167,9 @@ function createExtract(pageOrLocator) {
 var createLocatorExtract = (locator) => createExtract(locator);
 var createPageExtract = (page) => createExtract(page);
 
+// src/playwright-augment/methods/agent.ts
+var import_internal_playwright_test = require("@stablyai/internal-playwright-test");
+
 // src/playwright-type-predicates.ts
 function isPage(candidate) {
   return typeof candidate === "object" && candidate !== null && typeof candidate.screenshot === "function" && typeof candidate.goto === "function";
@@ -493,165 +496,171 @@ function createAgentStub() {
       newPageOpenedMsg = `opened new tab ${alias} (${page.url()})`;
     };
     browserContext.on("page", onNewPage);
-    try {
-      for (let i = 0; i < maxCycles; i++) {
-        if (agentMessage.shouldTerminate) {
-          break;
-        }
-        const screenshot = await takeStableScreenshot(activePage);
-        const response = await fetch(AGENT_ENDPOINT, {
-          method: "POST",
-          headers: {
-            ...SDK_METADATA_HEADERS,
-            Authorization: `Bearer ${apiKey}`
-          },
-          body: constructAgentPayload({
-            sessionId,
-            message: agentMessage.message,
-            isError: agentMessage.isError,
-            screenshot,
-            tabManager,
-            activePage,
-            additionalContext: newPageOpenedMsg ? { newPageMessage: newPageOpenedMsg } : void 0
-          })
-        });
-        newPageOpenedMsg = void 0;
-        const responseJson = await response.json();
-        if (!response.ok) {
-          throw new Error(`Agent call failed: ${JSON.stringify(responseJson)}`);
-        }
-        const agentResponse = responseJson;
-        agentMessage = await (async () => {
-          try {
-            switch (agentResponse.action) {
-              case "key": {
-                const { text } = agentResponse;
-                if (text) {
-                  await activePage.keyboard.press(text);
-                  return { message: `pressed "${text}"` };
+    return await import_internal_playwright_test.test.step(prompt, async () => {
+      try {
+        for (let i = 0; i < maxCycles; i++) {
+          if (agentMessage.shouldTerminate) {
+            break;
+          }
+          const screenshot = await takeStableScreenshot(activePage);
+          const response = await fetch(AGENT_ENDPOINT, {
+            method: "POST",
+            headers: {
+              ...SDK_METADATA_HEADERS,
+              Authorization: `Bearer ${apiKey}`
+            },
+            body: constructAgentPayload({
+              sessionId,
+              message: agentMessage.message,
+              isError: agentMessage.isError,
+              screenshot,
+              tabManager,
+              activePage,
+              additionalContext: newPageOpenedMsg ? { newPageMessage: newPageOpenedMsg } : void 0
+            })
+          });
+          newPageOpenedMsg = void 0;
+          const responseJson = await response.json();
+          if (!response.ok) {
+            throw new Error(
+              `Agent call failed: ${JSON.stringify(responseJson)}`
+            );
+          }
+          const agentResponse = responseJson;
+          agentMessage = await (async () => {
+            try {
+              switch (agentResponse.action) {
+                case "key": {
+                  const { text } = agentResponse;
+                  if (text) {
+                    await activePage.keyboard.press(text);
+                    return { message: `pressed "${text}"` };
+                  }
+                  return { message: "pressed key" };
                 }
-                return { message: "pressed key" };
-              }
-              case "type": {
-                const { text } = agentResponse;
-                await activePage.keyboard.type(text);
-                return { message: `typed "${text}"` };
-              }
-              case "mouse_move": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.move(x, y);
-                return { message: `mouse moved to [${x}, ${y}]` };
-              }
-              case "left_click": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.click(x, y);
-                return { message: `left click at [${x}, ${y}]` };
-              }
-              case "right_click": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.click(x, y, { button: "right" });
-                return { message: `right click at [${x}, ${y}]` };
-              }
-              case "double_click": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.dblclick(x, y);
-                return { message: `double click at [${x}, ${y}]` };
-              }
-              case "triple_click": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.click(x, y, { clickCount: 3 });
-                return { message: `triple click at [${x}, ${y}]` };
-              }
-              case "left_click_drag": {
-                const [startX, startY] = agentResponse.start_coordinate;
-                const [endX, endY] = agentResponse.coordinate;
-                await activePage.mouse.move(startX, startY);
-                await activePage.mouse.down();
-                await activePage.mouse.move(endX, endY);
-                await activePage.mouse.up();
-                return {
-                  message: `dragged from [${startX}, ${startY}] to [${endX}, ${endY}]`
-                };
-              }
-              case "screenshot": {
-                await takeStableScreenshot(activePage);
-                return { message: "captured screenshot" };
-              }
-              case "wait": {
-                const waitMs = agentResponse.milliseconds ?? 3e3;
-                await activePage.waitForTimeout(waitMs);
-                return { message: `waited ${waitMs}ms` };
-              }
-              case "navigate_to_url": {
-                await activePage.goto(agentResponse.url);
-                return { message: `navigated to "${agentResponse.url}"` };
-              }
-              case "new_tab_url": {
-                const newPage = await browserContext.newPage();
-                await newPage.goto(agentResponse.url);
-                await newPage.waitForLoadState("domcontentloaded");
-                return { message: "opened new tab" };
-              }
-              case "switch_tab": {
-                const entry = Array.from(tabManager.entries()).find(
-                  ([, alias]) => alias === agentResponse.tab_alias
-                );
-                const page = entry?.[0];
-                if (!page) {
-                  throw new Error(
-                    `Tab with alias ${agentResponse.tab_alias} not found`
+                case "type": {
+                  const { text } = agentResponse;
+                  await activePage.keyboard.type(text);
+                  return { message: `typed "${text}"` };
+                }
+                case "mouse_move": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.move(x, y);
+                  return { message: `mouse moved to [${x}, ${y}]` };
+                }
+                case "left_click": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.click(x, y);
+                  return { message: `left click at [${x}, ${y}]` };
+                }
+                case "right_click": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.click(x, y, { button: "right" });
+                  return { message: `right click at [${x}, ${y}]` };
+                }
+                case "double_click": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.dblclick(x, y);
+                  return { message: `double click at [${x}, ${y}]` };
+                }
+                case "triple_click": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.click(x, y, { clickCount: 3 });
+                  return { message: `triple click at [${x}, ${y}]` };
+                }
+                case "left_click_drag": {
+                  const [startX, startY] = agentResponse.start_coordinate;
+                  const [endX, endY] = agentResponse.coordinate;
+                  await activePage.mouse.move(startX, startY);
+                  await activePage.mouse.down();
+                  await activePage.mouse.move(endX, endY);
+                  await activePage.mouse.up();
+                  return {
+                    message: `dragged from [${startX}, ${startY}] to [${endX}, ${endY}]`
+                  };
+                }
+                case "screenshot": {
+                  await takeStableScreenshot(activePage);
+                  return { message: "captured screenshot" };
+                }
+                case "wait": {
+                  const waitMs = agentResponse.milliseconds ?? 3e3;
+                  await activePage.waitForTimeout(waitMs);
+                  return { message: `waited ${waitMs}ms` };
+                }
+                case "navigate_to_url": {
+                  await activePage.goto(agentResponse.url);
+                  return { message: `navigated to "${agentResponse.url}"` };
+                }
+                case "new_tab_url": {
+                  const newPage = await browserContext.newPage();
+                  await newPage.goto(agentResponse.url);
+                  await newPage.waitForLoadState("domcontentloaded");
+                  return { message: "opened new tab" };
+                }
+                case "switch_tab": {
+                  const entry = Array.from(tabManager.entries()).find(
+                    ([, alias]) => alias === agentResponse.tab_alias
                   );
+                  const page = entry?.[0];
+                  if (!page) {
+                    throw new Error(
+                      `Tab with alias ${agentResponse.tab_alias} not found`
+                    );
+                  }
+                  await page.bringToFront();
+                  activePage = page;
+                  return {
+                    message: `switched to "${agentResponse.tab_alias}"`
+                  };
                 }
-                await page.bringToFront();
-                activePage = page;
-                return { message: `switched to "${agentResponse.tab_alias}"` };
-              }
-              case "scroll": {
-                const [x, y] = agentResponse.coordinate;
-                await activePage.mouse.move(x, y);
-                let deltaX = 0;
-                let deltaY = 0;
-                switch (agentResponse.scroll_direction) {
-                  case "up":
-                    deltaY = -agentResponse.scroll_amount;
-                    break;
-                  case "down":
-                    deltaY = agentResponse.scroll_amount;
-                    break;
-                  case "left":
-                    deltaX = -agentResponse.scroll_amount;
-                    break;
-                  case "right":
-                    deltaX = agentResponse.scroll_amount;
-                    break;
+                case "scroll": {
+                  const [x, y] = agentResponse.coordinate;
+                  await activePage.mouse.move(x, y);
+                  let deltaX = 0;
+                  let deltaY = 0;
+                  switch (agentResponse.scroll_direction) {
+                    case "up":
+                      deltaY = -agentResponse.scroll_amount;
+                      break;
+                    case "down":
+                      deltaY = agentResponse.scroll_amount;
+                      break;
+                    case "left":
+                      deltaX = -agentResponse.scroll_amount;
+                      break;
+                    case "right":
+                      deltaX = agentResponse.scroll_amount;
+                      break;
+                  }
+                  await activePage.mouse.wheel(deltaX, deltaY);
+                  return {
+                    message: `scrolled ${agentResponse.scroll_direction}`
+                  };
+                }
+                case "navigate_back": {
+                  const res = await activePage.goBack();
+                  if (!res)
+                    throw new Error("navigate_back failed: no history entry");
+                  return { message: "navigated back" };
+                }
+                case "terminate_test": {
+                  const { success, reason } = agentResponse;
+                  finalSuccess = success;
+                  return { message: reason, shouldTerminate: true };
                 }
-                await activePage.mouse.wheel(deltaX, deltaY);
-                return {
-                  message: `scrolled ${agentResponse.scroll_direction}`
-                };
-              }
-              case "navigate_back": {
-                const res = await activePage.goBack();
-                if (!res)
-                  throw new Error("navigate_back failed: no history entry");
-                return { message: "navigated back" };
-              }
-              case "terminate_test": {
-                const { success, reason } = agentResponse;
-                finalSuccess = success;
-                return { message: reason, shouldTerminate: true };
               }
+            } catch (error) {
+              const message = error instanceof Error ? error.message : String(error);
+              return { message, isError: true };
             }
-          } catch (error) {
-            const message = error instanceof Error ? error.message : String(error);
-            return { message, isError: true };
-          }
-        })();
+          })();
+        }
+      } finally {
+        browserContext.off("page", onNewPage);
       }
-    } finally {
-      browserContext.off("page", onNewPage);
-    }
-    return { success: finalSuccess ?? false };
+      return { success: finalSuccess ?? false };
+    });
   };
 }
 
@@ -681,8 +690,7 @@ function augmentLocator(locator) {
   if (typeof locator.describe === "function" && !markerTarget[LOCATOR_DESCRIBE_WRAPPED]) {
     const originalDescribe = locator.describe.bind(locator);
     locator.describe = (description, options) => {
-      void options;
-      const result = originalDescribe(description);
+      const result = originalDescribe(description, options);
       return result ? augmentLocator(result) : result;
     };
     defineHiddenProperty(locator, LOCATOR_DESCRIBE_WRAPPED, true);
@@ -839,54 +847,8 @@ async function verifyPrompt({
   );
 }
 
-// src/expect/snapshotCache.ts
-var import_path = __toESM(require("path"));
-var import_promises = require("fs/promises");
-var import_path2 = require("path");
-var import_fs = require("fs");
-var import_internal_playwright_test = require("@stablyai/internal-playwright-test");
-async function getCacheEntryPath(snapshotKey) {
-  const testDir = import_path.default.dirname(import_internal_playwright_test.test.info().file);
-  return import_path.default.join(testDir, snapshotKey);
-}
-async function tryUseCachedSnapshot({
-  currentSnapshot,
-  cachedSnapshotKey,
-  snapshotSimilarityThreshold
-}) {
-  const cacheEntryPath = await getCacheEntryPath(cachedSnapshotKey);
-  try {
-    await (0, import_promises.access)(cacheEntryPath, import_fs.constants.F_OK);
-  } catch {
-    return { success: false, usedCachedSnapshot: false };
-  }
-  const cacheEntry = await (0, import_promises.readFile)(cacheEntryPath);
-  return {
-    success: imagesAreSimilar({
-      image1: cacheEntry,
-      image2: currentSnapshot,
-      threshold: snapshotSimilarityThreshold
-    }),
-    usedCachedSnapshot: true
-  };
-}
-async function updateCachedSnapshot({
-  snapshotKey,
-  snapshot
-}) {
-  const cacheEntryPath = await getCacheEntryPath(snapshotKey);
-  try {
-    await (0, import_promises.mkdir)((0, import_path2.dirname)(cacheEntryPath), { recursive: true });
-    await (0, import_promises.writeFile)(cacheEntryPath, snapshot);
-  } catch (err) {
-    console.error("Error writing snapshot", err);
-    throw err;
-  }
-}
-
-// src/expect/expect.ts
-var DEFAULT_SNAPSHOT_SIMILARITY_THRESHOLD = 0.02;
-function createResultMessage({
+// src/expect.ts
+function createFailureMessage({
   targetType,
   condition,
   didPass,
@@ -913,38 +875,14 @@ var stablyPlaywrightMatchers = {
     }
     const targetType = isPage(target) ? "page" : "locator";
     const screenshot = await takeStableScreenshot(target, options);
-    const useCachedSnapshotResult = options?.cache ? await tryUseCachedSnapshot({
-      currentSnapshot: screenshot,
-      cachedSnapshotKey: options.cache.snapshotKey,
-      snapshotSimilarityThreshold: options?.threshold ?? DEFAULT_SNAPSHOT_SIMILARITY_THRESHOLD
-    }) : void 0;
-    if (useCachedSnapshotResult?.success) {
-      return {
-        pass: true,
-        message: () => createResultMessage({
-          targetType,
-          condition,
-          didPass: true,
-          reason: "Used cached snapshot to verify condition",
-          isNot: this.isNot
-        })
-      };
-    }
     const verifyResult = await verifyPrompt({ prompt: condition, screenshot });
-    if (options?.cache && verifyResult.pass) {
-      await updateCachedSnapshot({
-        snapshotKey: options.cache.snapshotKey,
-        snapshot: screenshot
-      });
-    }
-    const snapshotUsageMessage = useCachedSnapshotResult ? `Attempted to use the cached snapshot to verify the condition, but ${useCachedSnapshotResult.usedCachedSnapshot ? "the snapshot did not match the current snapshot" : "no snapshot was found"}.` : void 0;
     return {
       pass: verifyResult.pass,
-      message: () => createResultMessage({
+      message: () => createFailureMessage({
         targetType,
         condition,
         didPass: verifyResult.pass,
-        reason: snapshotUsageMessage ? `${snapshotUsageMessage} ${verifyResult.reason}` : verifyResult.reason,
+        reason: verifyResult.reason,
         isNot: this.isNot
       })
     };