Merge branch 'main' into streamable-http

Author: Skn0tt

.github/workflows/ci.yml

@@ -58,4 +58,4 @@ jobs:
       run: npx playwright install --with-deps
 
     - name: Run tests
-      run: npm test
+      run: npm test -- --forbid-only

.gitignore

@@ -2,3 +2,6 @@ lib/
 node_modules/
 test-results/
 .vscode/mcp.json
+
+.idea
+.DS_Store

README.md

@@ -74,6 +74,7 @@ The Playwright MCP server supports the following command-line options:
 - `--executable-path <path>`: Path to the browser executable
 - `--headless`: Run browser in headless mode (headed by default)
 - `--port <port>`: Port to listen on for SSE transport
+- `--host <host>`: Host to bind server to. Default is localhost. Use 0.0.0.0 to bind to all interfaces.
 - `--user-data-dir <path>`: Path to the user data directory
 - `--vision`: Run server that uses screenshots (Aria snapshots are used by default)
 
@@ -89,8 +90,7 @@ Playwright MCP will launch the browser with the new profile, located at
 
 All the logged in information will be stored in that profile, you can delete it between sessions if you'd like to clear the offline state.
 
-
-### Running headless browser (Browser without GUI).
+### Running headless browser (Browser without GUI)
 
 This mode is useful for background or batch operations.
 
@@ -129,9 +129,28 @@ And then in MCP client config, set the `url` to the SSE endpoint:
 }
 ```
 
+When running in a remote server, you can use the `--host` flag to bind the server to `0.0.0.0` to make it accessible from outside.
+
+```bash
+npx @playwright/mcp@latest --port 8931 --host 0.0.0.0
+```
+
+In MCP client config, `$server-ip` is the IP address of the server:
+
+```js
+{
+  "mcpServers": {
+    "playwright": {
+      "url": "http://{$server-ip}:8931/sse"
+    }
+  }
+}
+```
+
 ### Docker
 
 **NOTE:** The Docker implementation only supports headless chromium at the moment.
+
 ```js
 {
   "mcpServers": {
@@ -172,6 +191,7 @@ X Y coordinate space, based on the provided screenshot.
 ### Build with Docker
 
 You can build the Docker image yourself.
+
 ```
 docker build -t mcp/playwright .
 ```

eslint.config.mjs

@@ -33,6 +33,7 @@ const plugins = {
 };
 
 export const baseRules = {
+  "@typescript-eslint/no-floating-promises": "error",
   "@typescript-eslint/no-unused-vars": [
     2,
     { args: "none", caughtErrors: "none" },
@@ -184,6 +185,9 @@ const languageOptions = {
   parser: tsParser,
   ecmaVersion: 9,
   sourceType: "module",
+  parserOptions: {
+    project: path.join(fileURLToPath(import.meta.url), "..", "tsconfig.all.json"),
+  }
 };
 
 export default [

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@playwright/mcp",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "description": "Playwright Tools for MCP",
   "repository": {
     "type": "git",
@@ -36,14 +36,14 @@
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.10.1",
     "commander": "^13.1.0",
-    "playwright": "^1.52.0-alpha-1743163434000",
+    "playwright": "1.53.0-alpha-1745357020000",
     "yaml": "^2.7.1",
     "zod-to-json-schema": "^3.24.4"
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3.2.0",
     "@eslint/js": "^9.19.0",
-    "@playwright/test": "^1.52.0-alpha-1743163434000",
+    "@playwright/test": "1.53.0-alpha-1745357020000",
     "@stylistic/eslint-plugin": "^3.0.1",
     "@types/node": "^22.13.10",
     "@typescript-eslint/eslint-plugin": "^8.26.1",

package.json

@@ -124,7 +124,7 @@ export class Context {
 
   async run(tool: Tool, params: Record<string, unknown> | undefined) {
     // Tab management is done outside of the action() call.
-    const toolResult = await tool.handle(this, params);
+    const toolResult = await tool.handle(this, tool.schema.inputSchema.parse(params));
     const { code, action, waitForNetwork, captureSnapshot, resultOverride } = toolResult;
     const racingAction = action ? () => this._raceAgainstModalDialogs(action) : undefined;
 
@@ -317,6 +317,7 @@ export class Tab {
   readonly context: Context;
   readonly page: playwright.Page;
   private _console: playwright.ConsoleMessage[] = [];
+  private _requests: Map<playwright.Request, playwright.Response | null> = new Map();
   private _snapshot: PageSnapshot | undefined;
   private _onPageClose: (tab: Tab) => void;
 
@@ -325,9 +326,11 @@ export class Tab {
     this.page = page;
     this._onPageClose = onPageClose;
     page.on('console', event => this._console.push(event));
+    page.on('request', request => this._requests.set(request, null));
+    page.on('response', response => this._requests.set(response.request(), response));
     page.on('framenavigated', frame => {
       if (!frame.parentFrame())
-        this._console.length = 0;
+        this._clearCollectedArtifacts();
     });
     page.on('close', () => this._onClose());
     page.on('filechooser', chooser => {
@@ -342,8 +345,13 @@ export class Tab {
     page.setDefaultTimeout(5000);
   }
 
-  private _onClose() {
+  private _clearCollectedArtifacts() {
     this._console.length = 0;
+    this._requests.clear();
+  }
+
+  private _onClose() {
+    this._clearCollectedArtifacts();
     this._onPageClose(this);
   }
 
@@ -363,10 +371,14 @@ export class Tab {
     return this._snapshot;
   }
 
-  async console(): Promise<playwright.ConsoleMessage[]> {
+  console(): playwright.ConsoleMessage[] {
     return this._console;
   }
 
+  requests(): Map<playwright.Request, playwright.Response | null> {
+    return this._requests;
+  }
+
   async captureSnapshot() {
     this._snapshot = await PageSnapshot.create(this.page);
   }
@@ -401,7 +413,7 @@ class PageSnapshot {
 
   private async _snapshotFrame(frame: playwright.Page | playwright.FrameLocator) {
     const frameIndex = this._frameLocators.push(frame) - 1;
-    const snapshotString = await frame.locator('body').ariaSnapshot({ ref: true });
+    const snapshotString = await frame.locator('body').ariaSnapshot({ ref: true, emitGeneric: true });
     const snapshot = yaml.parseDocument(snapshotString);
 
     const visit = async (node: any): Promise<unknown> => {

src/context.ts

@@ -26,6 +26,7 @@ import files from './tools/files';
 import install from './tools/install';
 import keyboard from './tools/keyboard';
 import navigate from './tools/navigate';
+import network from './tools/network';
 import pdf from './tools/pdf';
 import snapshot from './tools/snapshot';
 import tabs from './tools/tabs';
@@ -35,27 +36,29 @@ import type { Tool, ToolCapability } from './tools/tool';
 import type { Server } from '@modelcontextprotocol/sdk/server/index.js';
 import type { LaunchOptions } from 'playwright';
 
-const snapshotTools: Tool[] = [
+const snapshotTools: Tool<any>[] = [
   ...common(true),
   ...console,
   ...dialogs(true),
   ...files(true),
   ...install,
   ...keyboard(true),
   ...navigate(true),
+  ...network,
   ...pdf,
   ...snapshot,
   ...tabs(true),
 ];
 
-const screenshotTools: Tool[] = [
+const screenshotTools: Tool<any>[] = [
   ...common(false),
   ...console,
   ...dialogs(false),
   ...files(false),
   ...install,
   ...keyboard(false),
   ...navigate(false),
+  ...network,
   ...pdf,
   ...screen,
   ...tabs(false),

src/index.ts

@@ -33,6 +33,7 @@ program
     .option('--executable-path <path>', 'Path to the browser executable.')
     .option('--headless', 'Run browser in headless mode, headed by default')
     .option('--port <port>', 'Port to listen on for SSE transport.')
+    .option('--host <host>', 'Host to bind server to. Default is localhost. Use 0.0.0.0 to bind to all interfaces.')
     .option('--user-data-dir <path>', 'Path to the user data directory')
     .option('--vision', 'Run server that uses screenshots (Aria snapshots are used by default)')
     .action(async options => {
@@ -48,7 +49,7 @@ program
       setupExitWatchdog(serverList);
 
       if (options.port)
-        await startHttpTransport(+options.port, serverList);
+        await startHttpTransport(+options.port, options.host, serverList);
       else
         await startStdioTransport(serverList);
     });

src/program.ts

@@ -16,6 +16,7 @@
 
 import { Server } from '@modelcontextprotocol/sdk/server/index.js';
 import { CallToolRequestSchema, ListResourcesRequestSchema, ListToolsRequestSchema, ReadResourceRequestSchema } from '@modelcontextprotocol/sdk/types.js';
+import { zodToJsonSchema } from 'zod-to-json-schema';
 
 import { Context } from './context';
 
@@ -41,7 +42,13 @@ export function createServerWithTools(options: Options): Server {
   });
 
   server.setRequestHandler(ListToolsRequestSchema, async () => {
-    return { tools: tools.map(tool => tool.schema) };
+    return {
+      tools: tools.map(tool => ({
+        name: tool.schema.name,
+        description: tool.schema.description,
+        inputSchema: zodToJsonSchema(tool.schema.inputSchema)
+      })),
+    };
   });
 
   server.setRequestHandler(ListResourcesRequestSchema, async () => {