@one2x/playwright 1.57.0-alpha.3 → 1.57.0-alpha.5

package/lib/mcp/browser/config.js

@@ -166,7 +166,8 @@ function configFromCLIOptions(cliOptions) {
       contextOptions,
       cdpEndpoint: cliOptions.cdpEndpoint,
       cdpHeaders: cliOptions.cdpHeader,
-      initScript: cliOptions.initScript
+      initScript: cliOptions.initScript,
+      autoScreenshot: cliOptions.autoScreenshot
     },
     server: {
       port: cliOptions.port,
@@ -197,6 +198,7 @@ function configFromEnv() {
   const options = {};
   options.allowedHosts = commaSeparatedList(process.env.PLAYWRIGHT_MCP_ALLOWED_HOSTNAMES);
   options.allowedOrigins = semicolonSeparatedList(process.env.PLAYWRIGHT_MCP_ALLOWED_ORIGINS);
+  options.autoScreenshot = envToBoolean(process.env.PLAYWRIGHT_MCP_AUTO_SCREENSHOT);
   options.blockedOrigins = semicolonSeparatedList(process.env.PLAYWRIGHT_MCP_BLOCKED_ORIGINS);
   options.blockServiceWorkers = envToBoolean(process.env.PLAYWRIGHT_MCP_BLOCK_SERVICE_WORKERS);
   options.browser = envToString(process.env.PLAYWRIGHT_MCP_BROWSER);
@@ -374,6 +376,7 @@ function configFromURLParams(url) {
   const getParam = (name) => url.searchParams.get(name) || void 0;
   const options = {};
   options.allowedOrigins = semicolonSeparatedList(getParam("allowed-origins"));
+  options.autoScreenshot = queryToBoolean(getParam("auto-screenshot"));
   options.blockedOrigins = semicolonSeparatedList(getParam("blocked-origins"));
   options.blockServiceWorkers = queryToBoolean(getParam("block-service-workers"));
   options.browser = getParam("browser");

package/lib/mcp/browser/response.js

@@ -25,6 +25,7 @@ __export(response_exports, {
 module.exports = __toCommonJS(response_exports);
 var import_utilsBundle = require("playwright-core/lib/utilsBundle");
 var import_tab = require("./tab");
+var import_screenshot = require("./tools/screenshot");
 const requestDebug = (0, import_utilsBundle.debug)("pw:mcp:request");
 class Response {
   constructor(context, toolName, toolArgs) {
@@ -33,6 +34,7 @@ class Response {
     this._images = [];
     this._includeSnapshot = "none";
     this._includeTabs = false;
+    this._includeAutoScreenshot = false;
     this._context = context;
     this.toolName = toolName;
     this.toolArgs = toolArgs;
@@ -65,6 +67,9 @@ class Response {
   setIncludeSnapshot(full) {
     this._includeSnapshot = full ?? "incremental";
   }
+  setIncludeAutoScreenshot() {
+    this._includeAutoScreenshot = true;
+  }
   setIncludeTabs() {
     this._includeTabs = true;
   }
@@ -73,6 +78,14 @@ class Response {
       this._tabSnapshot = await this._context.currentTabOrDie().captureSnapshot(this._includeSnapshot);
     for (const tab of this._context.tabs())
       await tab.updateTitle();
+    if (this._includeAutoScreenshot && this._context.config.browser?.autoScreenshot && this._context.config.imageResponses !== "omit" && this._context.currentTab()) {
+      const tab = this._context.currentTabOrDie();
+      await tab.page.waitForLoadState("networkidle", { timeout: 1e3 }).catch(() => {
+      });
+      const buffer = await tab.page.screenshot({ type: "jpeg", quality: 90, scale: "css" });
+      const scaledBuffer = (0, import_screenshot.scaleImageToFitMessage)(buffer, "jpeg");
+      this.addImage({ contentType: "image/jpeg", data: scaledBuffer });
+    }
   }
   tabSnapshot() {
     return this._tabSnapshot;

package/lib/mcp/browser/tab.js

@@ -147,7 +147,7 @@ class Tab extends import_events.EventEmitter {
     this._clearCollectedArtifacts();
     const downloadEvent = (0, import_utils2.callOnPageNoTrace)(this.page, (page) => page.waitForEvent("download").catch(import_log.logUnhandledError));
     try {
-      await this.page.goto(url, { waitUntil: "domcontentloaded" });
+      await this.page.goto(url, { waitUntil: this.context.config.browser?.autoScreenshot ? "load" : "domcontentloaded" });
     } catch (_e) {
       const e = _e;
       const mightBeDownload = e.message.includes("net::ERR_ABORTED") || e.message.includes("Download is starting");

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

@@ -27,9 +27,15 @@ async function retryWithAllowIntercept(action, options) {
     return { usedAllowIntercept: false };
   } catch (error) {
     if (error?.message?.includes("intercepts pointer events")) {
+      let interceptorInfo;
+      const errorMessage = error.message || "";
+      const interceptorMatch = errorMessage.match(/(.+?)\s+intercepts pointer events/);
+      if (interceptorMatch) {
+        interceptorInfo = interceptorMatch[1].trim().replace(/^\s*[\d\-:.]+\s*/, "");
+      }
       const optionsWithAllowIntercept = { ...options, allowIntercept: true };
       await action(optionsWithAllowIntercept);
-      return { usedAllowIntercept: true };
+      return { usedAllowIntercept: true, interceptorInfo };
     }
     throw error;
   }

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

@@ -62,6 +62,7 @@ const evaluate = (0, import_tool.defineTabTool)({
       const result = await receiver._evaluateFunction(params.function);
       response.addResult(JSON.stringify(result, null, 2) || "undefined");
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 var evaluate_default = [

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

@@ -65,6 +65,12 @@ const fillForm = (0, import_tool.defineTabTool)({
           async (opts) => await locator.setChecked(field.value === "true", opts),
           {}
         );
+        if (result.usedAllowIntercept) {
+          response.addResult(`\u26A0\uFE0F  Previous attempt failed: ${field.type} was intercepted`);
+          if (result.interceptorInfo)
+            response.addResult(`   Intercepting element: ${result.interceptorInfo}`);
+          response.addResult("\u2713  Retried with allowIntercept: true and succeeded");
+        }
         const optionsAttr = result.usedAllowIntercept ? ", { allowIntercept: true }" : "";
         response.addCode(`${locatorSource}.setChecked(${field.value}${optionsAttr});`);
       } else if (field.type === "combobox") {
@@ -72,6 +78,7 @@ const fillForm = (0, import_tool.defineTabTool)({
         response.addCode(`${locatorSource}.selectOption(${codegen.quote(field.value)});`);
       }
     }
+    response.setIncludeAutoScreenshot();
   }
 });
 var form_default = [

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

@@ -42,6 +42,7 @@ const pressKey = (0, import_tool.defineTabTool)({
     await tab.waitForCompletion(async () => {
       await tab.page.keyboard.press(params.key);
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 const typeSchema = import_snapshot.elementSchema.extend({
@@ -76,6 +77,7 @@ const type = (0, import_tool.defineTabTool)({
         await locator.press("Enter");
       }
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 var keyboard_default = [

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

@@ -69,6 +69,7 @@ const mouseClick = (0, import_tool.defineTabTool)({
       await tab.page.mouse.down();
       await tab.page.mouse.up();
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 const mouseDrag = (0, import_tool.defineTabTool)({
@@ -98,6 +99,7 @@ const mouseDrag = (0, import_tool.defineTabTool)({
       await tab.page.mouse.move(params.endX, params.endY);
       await tab.page.mouse.up();
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 var mouse_default = [

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

@@ -39,6 +39,7 @@ const navigate = (0, import_tool.defineTool)({
     await tab.navigate(params.url);
     response.setIncludeSnapshot();
     response.addCode(`await page.goto('${params.url}');`);
+    response.setIncludeAutoScreenshot();
   }
 });
 const goBack = (0, import_tool.defineTabTool)({
@@ -54,6 +55,7 @@ const goBack = (0, import_tool.defineTabTool)({
     await tab.page.goBack();
     response.setIncludeSnapshot();
     response.addCode(`await page.goBack();`);
+    response.setIncludeAutoScreenshot();
   }
 });
 var navigate_default = [

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

@@ -77,6 +77,7 @@ const click = (0, import_tool.defineTabTool)({
       modifiers: params.modifiers
     };
     let usedAllowIntercept = false;
+    let interceptorInfo;
     await tab.waitForCompletion(async () => {
       const result = await (0, import_actionRetry.retryWithAllowIntercept)(
         async (opts) => {
@@ -88,7 +89,14 @@ const click = (0, import_tool.defineTabTool)({
         options
       );
       usedAllowIntercept = result.usedAllowIntercept;
+      interceptorInfo = result.interceptorInfo;
     });
+    if (usedAllowIntercept) {
+      response.addResult("\u26A0\uFE0F  Previous attempt failed: element was intercepted");
+      if (interceptorInfo)
+        response.addResult(`   Intercepting element: ${interceptorInfo}`);
+      response.addResult("\u2713  Retried with allowIntercept: true and succeeded");
+    }
     const finalOptions = usedAllowIntercept ? { ...options, allowIntercept: true } : options;
     const formatted = javascript.formatObject(finalOptions, " ", "oneline");
     const optionsAttr = formatted !== "{}" ? formatted : "";
@@ -96,6 +104,7 @@ const click = (0, import_tool.defineTabTool)({
       response.addCode(`await page.${resolved}.dblclick(${optionsAttr});`);
     else
       response.addCode(`await page.${resolved}.click(${optionsAttr});`);
+    response.setIncludeAutoScreenshot();
   }
 });
 const drag = (0, import_tool.defineTabTool)({
@@ -119,15 +128,24 @@ const drag = (0, import_tool.defineTabTool)({
       { ref: params.endRef, element: params.endElement }
     ]);
     let usedAllowIntercept = false;
+    let interceptorInfo;
     await tab.waitForCompletion(async () => {
       const result = await (0, import_actionRetry.retryWithAllowIntercept)(
         async (opts) => await start.locator.dragTo(end.locator, opts),
         {}
       );
       usedAllowIntercept = result.usedAllowIntercept;
+      interceptorInfo = result.interceptorInfo;
     });
+    if (usedAllowIntercept) {
+      response.addResult("\u26A0\uFE0F  Previous attempt failed: element was intercepted");
+      if (interceptorInfo)
+        response.addResult(`   Intercepting element: ${interceptorInfo}`);
+      response.addResult("\u2713  Retried with allowIntercept: true and succeeded");
+    }
     const optionsAttr = usedAllowIntercept ? ", { allowIntercept: true }" : "";
     response.addCode(`await page.${start.resolved}.dragTo(page.${end.resolved}${optionsAttr});`);
+    response.setIncludeAutoScreenshot();
   }
 });
 const hover = (0, import_tool.defineTabTool)({
@@ -143,15 +161,24 @@ const hover = (0, import_tool.defineTabTool)({
     response.setIncludeSnapshot();
     const { locator, resolved } = await tab.refLocator(params);
     let usedAllowIntercept = false;
+    let interceptorInfo;
     await tab.waitForCompletion(async () => {
       const result = await (0, import_actionRetry.retryWithAllowIntercept)(
         async (opts) => await locator.hover(opts),
         {}
       );
       usedAllowIntercept = result.usedAllowIntercept;
+      interceptorInfo = result.interceptorInfo;
     });
+    if (usedAllowIntercept) {
+      response.addResult("\u26A0\uFE0F  Previous attempt failed: element was intercepted");
+      if (interceptorInfo)
+        response.addResult(`   Intercepting element: ${interceptorInfo}`);
+      response.addResult("\u2713  Retried with allowIntercept: true and succeeded");
+    }
     const optionsAttr = usedAllowIntercept ? "{ allowIntercept: true }" : "";
     response.addCode(`await page.${resolved}.hover(${optionsAttr});`);
+    response.setIncludeAutoScreenshot();
   }
 });
 const selectOptionSchema = elementSchema.extend({
@@ -173,6 +200,7 @@ const selectOption = (0, import_tool.defineTabTool)({
     await tab.waitForCompletion(async () => {
       await locator.selectOption(params.values);
     });
+    response.setIncludeAutoScreenshot();
   }
 });
 const pickLocator = (0, import_tool.defineTabTool)({

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

@@ -50,6 +50,7 @@ const browserTabs = (0, import_tool.defineTool)({
       case "close": {
         await context.closeTab(params.index);
         response.setIncludeSnapshot("full");
+        response.setIncludeAutoScreenshot();
         return;
       }
       case "select": {
@@ -57,6 +58,7 @@ const browserTabs = (0, import_tool.defineTool)({
           throw new Error("Tab index is required");
         await context.selectTab(params.index);
         response.setIncludeSnapshot("full");
+        response.setIncludeAutoScreenshot();
         return;
       }
     }

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

@@ -33,16 +33,12 @@ async function waitForCompletion(tab, callback) {
   const waitBarrier = new Promise((f) => {
     waitCallback = f;
   });
-  const responseListener = (request) => {
+  const requestListener = (request) => requests.add(request);
+  const requestFinishedListener = (request) => {
     requests.delete(request);
     if (!requests.size)
       waitCallback();
   };
-  const requestListener = (request) => {
-    requests.add(request);
-    void request.response().then(() => responseListener(request)).catch(() => {
-    });
-  };
   const frameNavigateListener = (frame) => {
     if (frame.parentFrame())
       return;
@@ -56,12 +52,12 @@ async function waitForCompletion(tab, callback) {
     waitCallback();
   };
   tab.page.on("request", requestListener);
-  tab.page.on("requestfailed", responseListener);
+  tab.page.on("requestfinished", requestFinishedListener);
   tab.page.on("framenavigated", frameNavigateListener);
   const timeout = setTimeout(onTimeout, 1e4);
   const dispose = () => {
     tab.page.off("request", requestListener);
-    tab.page.off("requestfailed", responseListener);
+    tab.page.off("requestfinished", requestFinishedListener);
     tab.page.off("framenavigated", frameNavigateListener);
     clearTimeout(timeout);
   };

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

@@ -56,6 +56,7 @@ const wait = (0, import_tool.defineTool)({
     }
     response.addResult(`Waited for ${params.text || params.textGone || params.time}`);
     response.setIncludeSnapshot();
+    response.setIncludeAutoScreenshot();
   }
 });
 var wait_default = [

package/lib/mcp/program.js

@@ -42,7 +42,7 @@ var import_proxyBackend = require("./sdk/proxyBackend");
 var import_browserServerBackend = require("./browser/browserServerBackend");
 var import_extensionContextFactory = require("./extension/extensionContextFactory");
 function decorateCommand(command, version) {
-  command.option("--allowed-hosts <hosts...>", "comma-separated list of hosts this server is allowed to serve from. Defaults to the host the server is bound to. Pass '*' to disable the host check.", import_config.commaSeparatedList).option("--allowed-origins <origins>", "semicolon-separated list of origins to allow the browser to request. Default is to allow all.", import_config.semicolonSeparatedList).option("--blocked-origins <origins>", "semicolon-separated list of origins to block the browser from requesting. Blocklist is evaluated before allowlist. If used without the allowlist, requests not matching the blocklist are still allowed.", import_config.semicolonSeparatedList).option("--block-service-workers", "block service workers").option("--browser <browser>", "browser or chrome channel to use, possible values: chrome, firefox, webkit, msedge.").option("--caps <caps>", "comma-separated list of additional capabilities to enable, possible values: vision, pdf.", import_config.commaSeparatedList).option("--cdp-endpoint <endpoint>", "CDP endpoint to connect to.").option("--cdp-header <headers...>", "CDP headers to send with the connect request, multiple can be specified.", import_config.headerParser).option("--config <path>", "path to the configuration file.").option("--device <device>", 'device to emulate, for example: "iPhone 15"').option("--executable-path <path>", "path to the browser executable.").option("--extension", 'Connect to a running browser instance (Edge/Chrome only). Requires the "Playwright MCP Bridge" browser extension to be installed.').option("--grant-permissions <permissions...>", 'List of permissions to grant to the browser context, for example "geolocation", "clipboard-read", "clipboard-write".', import_config.commaSeparatedList).option("--headless", "run browser in headless mode, headed by default").option("--host <host>", "host to bind server to. Default is localhost. Use 0.0.0.0 to bind to all interfaces.").option("--ignore-https-errors", "ignore https errors").option("--init-script <path...>", "path to JavaScript file to add as an initialization script. The script will be evaluated in every page before any of the page's scripts. Can be specified multiple times.").option("--isolated", "keep the browser profile in memory, do not save it to disk.").option("--image-responses <mode>", 'whether to send image responses to the client. Can be "allow" or "omit", Defaults to "allow".').option("--no-sandbox", "disable the sandbox for all process types that are normally sandboxed.").option("--output-dir <path>", "path to the directory for output files.").option("--port <port>", "port to listen on for SSE transport.").option("--proxy-bypass <bypass>", 'comma-separated domains to bypass proxy, for example ".com,chromium.org,.domain.com"').option("--proxy-server <proxy>", 'specify proxy server, for example "http://myproxy:3128" or "socks5://myproxy:8080"').option("--save-session", "Whether to save the Playwright MCP session into the output directory.").option("--save-trace", "Whether to save the Playwright Trace of the session into the output directory.").option("--save-video <size>", 'Whether to save the video of the session into the output directory. For example "--save-video=800x600"', import_config.resolutionParser.bind(null, "--save-video")).option("--secrets <path>", "path to a file containing secrets in the dotenv format", import_config.dotenvFileLoader).option("--shared-browser-context", "reuse the same browser context between all connected HTTP clients.").option("--storage-state <path>", "path to the storage state file for isolated sessions.").option("--test-id-attribute <attribute>", 'specify the attribute to use for test ids, defaults to "data-testid"').option("--timeout-action <timeout>", "specify action timeout in milliseconds, defaults to 5000ms", import_config.numberParser).option("--timeout-navigation <timeout>", "specify navigation timeout in milliseconds, defaults to 60000ms", import_config.numberParser).option("--user-agent <ua string>", "specify user agent string").option("--user-data-dir <path>", "path to the user data directory. If not specified, a temporary directory will be created.").option("--viewport-size <size>", 'specify browser viewport size in pixels, for example "1280x720"', import_config.resolutionParser.bind(null, "--viewport-size")).addOption(new import_utilsBundle.ProgramOption("--connect-tool", "Allow to switch between different browser connection methods.").hideHelp()).addOption(new import_utilsBundle.ProgramOption("--vision", "Legacy option, use --caps=vision instead").hideHelp()).action(async (options) => {
+  command.option("--allowed-hosts <hosts...>", "comma-separated list of hosts this server is allowed to serve from. Defaults to the host the server is bound to. Pass '*' to disable the host check.", import_config.commaSeparatedList).option("--allowed-origins <origins>", "semicolon-separated list of origins to allow the browser to request. Default is to allow all.", import_config.semicolonSeparatedList).option("--auto-screenshot", "automatically capture viewport screenshot after DOM changes").option("--blocked-origins <origins>", "semicolon-separated list of origins to block the browser from requesting. Blocklist is evaluated before allowlist. If used without the allowlist, requests not matching the blocklist are still allowed.", import_config.semicolonSeparatedList).option("--block-service-workers", "block service workers").option("--browser <browser>", "browser or chrome channel to use, possible values: chrome, firefox, webkit, msedge.").option("--caps <caps>", "comma-separated list of additional capabilities to enable, possible values: vision, pdf.", import_config.commaSeparatedList).option("--cdp-endpoint <endpoint>", "CDP endpoint to connect to.").option("--cdp-header <headers...>", "CDP headers to send with the connect request, multiple can be specified.", import_config.headerParser).option("--config <path>", "path to the configuration file.").option("--device <device>", 'device to emulate, for example: "iPhone 15"').option("--executable-path <path>", "path to the browser executable.").option("--extension", 'Connect to a running browser instance (Edge/Chrome only). Requires the "Playwright MCP Bridge" browser extension to be installed.').option("--grant-permissions <permissions...>", 'List of permissions to grant to the browser context, for example "geolocation", "clipboard-read", "clipboard-write".', import_config.commaSeparatedList).option("--headless", "run browser in headless mode, headed by default").option("--host <host>", "host to bind server to. Default is localhost. Use 0.0.0.0 to bind to all interfaces.").option("--ignore-https-errors", "ignore https errors").option("--init-script <path...>", "path to JavaScript file to add as an initialization script. The script will be evaluated in every page before any of the page's scripts. Can be specified multiple times.").option("--isolated", "keep the browser profile in memory, do not save it to disk.").option("--image-responses <mode>", 'whether to send image responses to the client. Can be "allow" or "omit", Defaults to "allow".').option("--no-sandbox", "disable the sandbox for all process types that are normally sandboxed.").option("--output-dir <path>", "path to the directory for output files.").option("--port <port>", "port to listen on for SSE transport.").option("--proxy-bypass <bypass>", 'comma-separated domains to bypass proxy, for example ".com,chromium.org,.domain.com"').option("--proxy-server <proxy>", 'specify proxy server, for example "http://myproxy:3128" or "socks5://myproxy:8080"').option("--save-session", "Whether to save the Playwright MCP session into the output directory.").option("--save-trace", "Whether to save the Playwright Trace of the session into the output directory.").option("--save-video <size>", 'Whether to save the video of the session into the output directory. For example "--save-video=800x600"', import_config.resolutionParser.bind(null, "--save-video")).option("--secrets <path>", "path to a file containing secrets in the dotenv format", import_config.dotenvFileLoader).option("--shared-browser-context", "reuse the same browser context between all connected HTTP clients.").option("--storage-state <path>", "path to the storage state file for isolated sessions.").option("--test-id-attribute <attribute>", 'specify the attribute to use for test ids, defaults to "data-testid"').option("--timeout-action <timeout>", "specify action timeout in milliseconds, defaults to 5000ms", import_config.numberParser).option("--timeout-navigation <timeout>", "specify navigation timeout in milliseconds, defaults to 60000ms", import_config.numberParser).option("--user-agent <ua string>", "specify user agent string").option("--user-data-dir <path>", "path to the user data directory. If not specified, a temporary directory will be created.").option("--viewport-size <size>", 'specify browser viewport size in pixels, for example "1280x720"', import_config.resolutionParser.bind(null, "--viewport-size")).addOption(new import_utilsBundle.ProgramOption("--connect-tool", "Allow to switch between different browser connection methods.").hideHelp()).addOption(new import_utilsBundle.ProgramOption("--vision", "Legacy option, use --caps=vision instead").hideHelp()).action(async (options) => {
     (0, import_watchdog.setupExitWatchdog)();
     if (options.vision) {
       console.error("The --vision option is deprecated, use --caps=vision instead");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@one2x/playwright",
-  "version": "1.57.0-alpha.3",
+  "version": "1.57.0-alpha.5",
   "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.3",
+    "playwright-core": "npm:@one2x/playwright-core@1.57.0-alpha.5",
     "raw-body": "^2.5.2"
   },
   "optionalDependencies": {