playwriter 0.0.33 → 0.0.37

package/src/mcp.ts

@@ -15,11 +15,15 @@ import { createPatch } from 'diff'
 import { getCdpUrl, LOG_FILE_PATH, VERSION, sleep } from './utils.js'
 import { killPortProcess } from 'kill-port-process'
 import { waitForPageLoad, WaitForPageLoadOptions, WaitForPageLoadResult } from './wait-for-page-load.js'
-import { getCDPSessionForPage, CDPSession } from './cdp-session.js'
+import { getCDPSessionForPage, CDPSession, ICDPSession } from './cdp-session.js'
 import { Debugger } from './debugger.js'
 import { Editor } from './editor.js'
 import { getStylesForLocator, formatStylesAsText, type StylesResult } from './styles.js'
 import { getReactSource, type ReactSourceLocation } from './react-source.js'
+import { ScopedFS } from './scoped-fs.js'
+import { showAriaRefLabels, hideAriaRefLabels } from './aria-snapshot.js'
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
 
 class CodeExecutionTimeoutError extends Error {
   constructor(timeout: number) {
@@ -77,11 +81,13 @@ interface VMContext {
   clearAllLogs: () => void
   waitForPageLoad: (options: WaitForPageLoadOptions) => Promise<WaitForPageLoadResult>
   getCDPSession: (options: { page: Page }) => Promise<CDPSession>
-  createDebugger: (options: { cdp: CDPSession }) => Debugger
-  createEditor: (options: { cdp: CDPSession }) => Editor
+  createDebugger: (options: { cdp: ICDPSession }) => Debugger
+  createEditor: (options: { cdp: ICDPSession }) => Editor
   getStylesForLocator: (options: { locator: any }) => Promise<StylesResult>
   formatStylesAsText: (styles: StylesResult) => string
   getReactSource: (options: { locator: any }) => Promise<ReactSourceLocation | null>
+  showAriaRefLabels: (options: { page: Page; interactiveOnly?: boolean }) => Promise<{ snapshot: string; labelCount: number }>
+  hideAriaRefLabels: (options: { page: Page }) => Promise<void>
   require: NodeRequire
   import: (specifier: string) => Promise<any>
 }
@@ -112,6 +118,102 @@ const cdpSessionCache: WeakMap<Page, CDPSession> = new WeakMap()
 const RELAY_PORT = Number(process.env.PLAYWRITER_PORT) || 19988
 const NO_TABS_ERROR = `No browser tabs are connected. Please install and enable the Playwriter extension on at least one tab: https://chromewebstore.google.com/detail/playwriter-mcp/jfeammnjpkecdekppnclgkkffahnhfhe`
 
+// Create a scoped fs instance that allows access to cwd, /tmp, and os.tmpdir()
+const scopedFs = new ScopedFS()
+
+/**
+ * Allowlist of Node.js built-in modules that are safe to use in the sandbox.
+ * Dangerous modules like child_process, cluster, worker_threads, vm, net are blocked.
+ */
+const ALLOWED_MODULES = new Set([
+  // Safe utility modules
+  'path',
+  'node:path',
+  'url',
+  'node:url',
+  'querystring',
+  'node:querystring',
+  'punycode',
+  'node:punycode',
+
+  // Crypto and encoding
+  'crypto',
+  'node:crypto',
+  'buffer',
+  'node:buffer',
+  'string_decoder',
+  'node:string_decoder',
+
+  // Utilities
+  'util',
+  'node:util',
+  'assert',
+  'node:assert',
+  'events',
+  'node:events',
+  'timers',
+  'node:timers',
+
+  // Streams and compression
+  'stream',
+  'node:stream',
+  'zlib',
+  'node:zlib',
+
+  // HTTP (fetch is already available, these are consistent)
+  'http',
+  'node:http',
+  'https',
+  'node:https',
+  'http2',
+  'node:http2',
+
+  // System info (read-only, useful for debugging)
+  'os',
+  'node:os',
+
+  // fs is allowed but returns sandboxed version
+  'fs',
+  'node:fs',
+])
+
+/**
+ * Create a sandboxed require function that:
+ * 1. Returns scoped fs for 'fs' and 'node:fs'
+ * 2. Only allows modules in the ALLOWED_MODULES allowlist
+ * 3. Blocks all other modules (child_process, net, vm, third-party packages, etc.)
+ */
+function createSandboxedRequire(originalRequire: NodeRequire): NodeRequire {
+  const sandboxedRequire = ((id: string) => {
+    // Check allowlist first
+    if (!ALLOWED_MODULES.has(id)) {
+      const error = new Error(
+        `Module "${id}" is not allowed in the sandbox. ` +
+          `Only safe Node.js built-ins are permitted: ${[...ALLOWED_MODULES].filter((m) => !m.startsWith('node:')).join(', ')}`,
+      )
+      error.name = 'ModuleNotAllowedError'
+      throw error
+    }
+
+    // Return sandboxed fs
+    if (id === 'fs' || id === 'node:fs') {
+      return scopedFs
+    }
+
+    return originalRequire(id)
+  }) as NodeRequire
+
+  // Copy over require properties
+  sandboxedRequire.resolve = originalRequire.resolve
+  sandboxedRequire.cache = originalRequire.cache
+  sandboxedRequire.extensions = originalRequire.extensions
+  sandboxedRequire.main = originalRequire.main
+
+  return sandboxedRequire
+}
+
+const sandboxedRequire = createSandboxedRequire(require)
+
 interface RemoteConfig {
   host: string
   port: number
@@ -189,6 +291,15 @@ async function sendLogToRelayServer(level: string, ...args: any[]) {
   }
 }
 
+/**
+ * Log to both console.error (for early startup) and relay server log file.
+ * Fire-and-forget to avoid blocking.
+ */
+function mcpLog(...args: any[]) {
+  console.error(...args)
+  sendLogToRelayServer('log', ...args)
+}
+
 async function getServerVersion(port: number): Promise<string | null> {
   try {
     const response = await fetch(`http://127.0.0.1:${port}/version`, {
@@ -211,6 +322,27 @@ async function killRelayServer(port: number): Promise<void> {
   } catch {}
 }
 
+/**
+ * Compare two semver versions. Returns:
+ * - negative if v1 < v2
+ * - 0 if v1 === v2
+ * - positive if v1 > v2
+ */
+function compareVersions(v1: string, v2: string): number {
+  const parts1 = v1.split('.').map(Number)
+  const parts2 = v2.split('.').map(Number)
+  const len = Math.max(parts1.length, parts2.length)
+
+  for (let i = 0; i < len; i++) {
+    const p1 = parts1[i] || 0
+    const p2 = parts2[i] || 0
+    if (p1 !== p2) {
+      return p1 - p2
+    }
+  }
+  return 0
+}
+
 async function ensureRelayServer(): Promise<void> {
   const serverVersion = await getServerVersion(RELAY_PORT)
 
@@ -218,18 +350,30 @@ async function ensureRelayServer(): Promise<void> {
     return
   }
 
+  // Don't restart if server version is higher than MCP version.
+  // This prevents older MCPs from killing a newer server.
+  if (serverVersion !== null && compareVersions(serverVersion, VERSION) > 0) {
+    return
+  }
+
   if (serverVersion !== null) {
-    console.error(`CDP relay server version mismatch (server: ${serverVersion}, mcp: ${VERSION}), restarting...`)
+    mcpLog(`CDP relay server version mismatch (server: ${serverVersion}, mcp: ${VERSION}), restarting...`)
     await killRelayServer(RELAY_PORT)
   } else {
-    console.error('CDP relay server not running, starting it...')
+    mcpLog('CDP relay server not running, starting it...')
   }
 
-  const scriptPath = require.resolve('../dist/start-relay-server.js')
+  const dev = process.env.PLAYWRITER_NODE_ENV === 'development'
+  const scriptPath = dev
+    ? path.resolve(__dirname, '../src/start-relay-server.ts')
+    : require.resolve('../dist/start-relay-server.js')
 
-  const serverProcess = spawn(process.execPath, [scriptPath], {
+  const serverProcess = spawn(dev ? 'tsx' : process.execPath, [scriptPath], {
     detached: true,
     stdio: 'ignore',
+    env: {
+      ...process.env,
+    },
   })
 
   serverProcess.unref()
@@ -238,7 +382,7 @@ async function ensureRelayServer(): Promise<void> {
     await sleep(500)
     const newVersion = await getServerVersion(RELAY_PORT)
     if (newVersion === VERSION) {
-      console.error('CDP relay server started successfully, waiting for extension to connect...')
+      mcpLog('CDP relay server started successfully, waiting for extension to connect...')
       await sleep(1000)
       return
     }
@@ -260,6 +404,12 @@ async function ensureConnection(): Promise<{ browser: Browser; page: Page }> {
   const cdpEndpoint = getCdpUrl(remote || { port: RELAY_PORT })
   const browser = await chromium.connectOverCDP(cdpEndpoint)
 
+  // Clear connection state when browser disconnects (e.g., extension reconnects, relay server restarts)
+  browser.on('disconnected', () => {
+    mcpLog('Browser disconnected, clearing connection state')
+    clearConnectionState()
+  })
+
   const contexts = browser.contexts()
   const context = contexts.length > 0 ? contexts[0] : await browser.newContext()
 
@@ -343,7 +493,7 @@ function setupPageConsoleListener(page: Page) {
         pageLogs.shift()
       }
     } catch (e) {
-      console.error('[MCP] Failed to get console message text:', e)
+      mcpLog('[MCP] Failed to get console message text:', e)
       return
     }
   })
@@ -375,7 +525,7 @@ async function resetConnection(): Promise<{ browser: Browser; page: Page; contex
     try {
       await state.browser.close()
     } catch (e) {
-      console.error('Error closing browser:', e)
+      mcpLog('Error closing browser:', e)
     }
   }
 
@@ -393,6 +543,12 @@ async function resetConnection(): Promise<{ browser: Browser; page: Page; contex
   const cdpEndpoint = getCdpUrl(remote || { port: RELAY_PORT })
   const browser = await chromium.connectOverCDP(cdpEndpoint)
 
+  // Clear connection state when browser disconnects (e.g., extension reconnects, relay server restarts)
+  browser.on('disconnected', () => {
+    mcpLog('Browser disconnected, clearing connection state')
+    clearConnectionState()
+  })
+
   const contexts = browser.contexts()
   const context = contexts.length > 0 ? contexts[0] : await browser.newContext()
 
@@ -431,53 +587,68 @@ const promptContent =
   fs.readFileSync(path.join(path.dirname(fileURLToPath(import.meta.url)), '..', 'src', 'prompt.md'), 'utf-8') +
   `\n\nfor debugging internal playwriter errors, check playwriter relay server logs at: ${LOG_FILE_PATH}`
 
-server.resource('debugger-api', 'https://playwriter.dev/resources/debugger-api.md', { mimeType: 'text/plain' }, async () => {
-  const packageJsonPath = require.resolve('playwriter/package.json')
-  const packageDir = path.dirname(packageJsonPath)
-  const content = fs.readFileSync(path.join(packageDir, 'dist', 'debugger-api.md'), 'utf-8')
-
-  return {
-    contents: [
-      {
-        uri: 'https://playwriter.dev/resources/debugger-api.md',
-        text: content,
-        mimeType: 'text/plain',
-      },
-    ],
-  }
-})
-
-server.resource('editor-api', 'https://playwriter.dev/resources/editor-api.md', { mimeType: 'text/plain' }, async () => {
-  const packageJsonPath = require.resolve('playwriter/package.json')
-  const packageDir = path.dirname(packageJsonPath)
-  const content = fs.readFileSync(path.join(packageDir, 'dist', 'editor-api.md'), 'utf-8')
-
-  return {
-    contents: [
-      {
-        uri: 'https://playwriter.dev/resources/editor-api.md',
-        text: content,
-        mimeType: 'text/plain',
-      },
-    ],
-  }
-})
+server.resource(
+  'debugger-api',
+  'https://playwriter.dev/resources/debugger-api.md',
+  { mimeType: 'text/plain' },
+  async () => {
+    const packageJsonPath = require.resolve('playwriter/package.json')
+    const packageDir = path.dirname(packageJsonPath)
+    const content = fs.readFileSync(path.join(packageDir, 'dist', 'debugger-api.md'), 'utf-8')
+
+    return {
+      contents: [
+        {
+          uri: 'https://playwriter.dev/resources/debugger-api.md',
+          text: content,
+          mimeType: 'text/plain',
+        },
+      ],
+    }
+  },
+)
 
-server.resource('styles-api', 'https://playwriter.dev/resources/styles-api.md', { mimeType: 'text/plain' }, async () => {
-  const packageJsonPath = require.resolve('playwriter/package.json')
-  const packageDir = path.dirname(packageJsonPath)
-  const content = fs.readFileSync(path.join(packageDir, 'dist', 'styles-api.md'), 'utf-8')
+server.resource(
+  'editor-api',
+  'https://playwriter.dev/resources/editor-api.md',
+  { mimeType: 'text/plain' },
+  async () => {
+    const packageJsonPath = require.resolve('playwriter/package.json')
+    const packageDir = path.dirname(packageJsonPath)
+    const content = fs.readFileSync(path.join(packageDir, 'dist', 'editor-api.md'), 'utf-8')
+
+    return {
+      contents: [
+        {
+          uri: 'https://playwriter.dev/resources/editor-api.md',
+          text: content,
+          mimeType: 'text/plain',
+        },
+      ],
+    }
+  },
+)
 
-  return {
-    contents: [
-      {
-        uri: 'https://playwriter.dev/resources/styles-api.md',
-        text: content,
-        mimeType: 'text/plain',
-      },
-    ],
-  }
-})
+server.resource(
+  'styles-api',
+  'https://playwriter.dev/resources/styles-api.md',
+  { mimeType: 'text/plain' },
+  async () => {
+    const packageJsonPath = require.resolve('playwriter/package.json')
+    const packageDir = path.dirname(packageJsonPath)
+    const content = fs.readFileSync(path.join(packageDir, 'dist', 'styles-api.md'), 'utf-8')
+
+    return {
+      contents: [
+        {
+          uri: 'https://playwriter.dev/resources/styles-api.md',
+          text: content,
+          mimeType: 'text/plain',
+        },
+      ],
+    }
+  },
+)
 
 server.tool(
   'execute',
@@ -520,7 +691,7 @@ server.tool(
       const page = await getCurrentPage(timeout)
       const context = state.context || page.context()
 
-      console.error('Executing code:', code)
+      mcpLog('Executing code:', code)
 
       const customConsole = {
         log: (...args: any[]) => {
@@ -675,11 +846,11 @@ server.tool(
         return session
       }
 
-      const createDebugger = (options: { cdp: CDPSession }) => {
+      const createDebugger = (options: { cdp: ICDPSession }) => {
         return new Debugger(options)
       }
 
-      const createEditor = (options: { cdp: CDPSession }) => {
+      const createEditor = (options: { cdp: ICDPSession }) => {
         return new Editor(options)
       }
 
@@ -709,6 +880,8 @@ server.tool(
         getStylesForLocator: getStylesForLocatorFn,
         formatStylesAsText,
         getReactSource: getReactSourceFn,
+        showAriaRefLabels,
+        hideAriaRefLabels,
         resetPlaywright: async () => {
           const { page: newPage, context: newContext } = await resetConnection()
 
@@ -728,8 +901,10 @@ server.tool(
             getStylesForLocator: getStylesForLocatorFn,
             formatStylesAsText,
             getReactSource: getReactSourceFn,
+            showAriaRefLabels,
+            hideAriaRefLabels,
             resetPlaywright: vmContextObj.resetPlaywright,
-            require,
+            require: sandboxedRequire,
             // TODO --experimental-vm-modules is needed to make import work in vm
             import: vmContextObj.import,
             ...usefulGlobals,
@@ -738,7 +913,7 @@ server.tool(
           Object.assign(vmContextObj, resetObj)
           return { page: newPage, context: newContext }
         },
-        require,
+        require: sandboxedRequire,
         import: (specifier: string) => import(specifier),
         ...usefulGlobals,
       }
@@ -786,15 +961,16 @@ server.tool(
       }
     } catch (error: any) {
       const errorStack = error.stack || error.message
-      console.error('Error in execute tool:', errorStack)
-
-      const logsText = formatConsoleLogs(consoleLogs, 'Console output (before error)')
-
       const isTimeoutError = error instanceof CodeExecutionTimeoutError || error.name === 'TimeoutError'
+
+      // Always log to stderr, but only send non-timeout errors to relay server
+      console.error('Error in execute tool:', errorStack)
       if (!isTimeoutError) {
-        sendLogToRelayServer('error', '[MCP] Error:', errorStack)
+        sendLogToRelayServer('error', 'Error in execute tool:', errorStack)
       }
 
+      const logsText = formatConsoleLogs(consoleLogs, 'Console output (before error)')
+
       const resetHint = isTimeoutError
         ? ''
         : '\n\n[HINT: If this is an internal Playwright error, page/browser closed, or connection issue, call the `reset` tool to reconnect. Do NOT reset for other non-connection non-internal errors.]'
@@ -881,7 +1057,7 @@ export async function startMcp(options: { host?: string; token?: string } = {})
   if (!remote) {
     await ensureRelayServer()
   } else {
-    console.error(`Using remote CDP relay server: ${remote.host}:${remote.port}`)
+    mcpLog(`Using remote CDP relay server: ${remote.host}:${remote.port}`)
     await checkRemoteServer(remote)
   }
   const transport = new StdioServerTransport()