nicer icons. different port

extension-new/COMPARISON.md

@@ -44,7 +44,7 @@ class ExtensionConnection {
 
 ### New (Functional):**
 ```typescript
-export async function startRelayServer({ port = 9988 }) {
+export async function startRelayServer({ port = 19988 }) {
   const targetsRegistry = createTargetsRegistry()
   let playwrightWs: WSContext | null = null
   let extensionWs: WSContext | null = null
@@ -230,13 +230,13 @@ The new implementation is a drop-in replacement:
 
 **Old:**
 ```typescript
-const httpServer = await startHttpServer({ port: 9988 })
+const httpServer = await startHttpServer({ port: 19988 })
 const cdpRelayServer = new CDPRelayServer(httpServer)
 cdpRelayServer.stop()
 ```
 
 **New:**
 ```typescript
-const server = await startRelayServer({ port: 9988 })
+const server = await startRelayServer({ port: 19988 })
 server.close()
 ```

extension-new/MIGRATION.md

@@ -28,7 +28,7 @@ cdpRelayServer.stop()
 
 **After:**
 ```typescript
-const server = await startRelayServer({ port: 9988 })
+const server = await startRelayServer({ port: 19988 })
 // Simple object API
 server.close()
 ```

extension-new/README.md

@@ -49,12 +49,12 @@ Tab → chrome.debugger → Extension → /extension → /cdp → Playwright
 **Clean API:**
 
 ```typescript
-const server = await startRelayServer({ port: 9988 })
+const server = await startRelayServer({ port: 19988 })
 
 // Returns:
 // {
-//   cdpEndpoint: 'ws://localhost:9988/cdp',
-//   extensionEndpoint: 'ws://localhost:9988/extension',
+//   cdpEndpoint: 'ws://localhost:19988/cdp',
+//   extensionEndpoint: 'ws://localhost:19988/extension',
 //   close: () => void
 // }
 
@@ -67,7 +67,7 @@ server.close()
 ```typescript
 import { startRelayServer } from './relay-server.js'
 
-const server = await startRelayServer({ port: 9988 })
+const server = await startRelayServer({ port: 19988 })
 
 console.log('Extension endpoint:', server.extensionEndpoint)
 console.log('CDP endpoint:', server.cdpEndpoint)

extension-playwright/src/background.ts

@@ -2,7 +2,7 @@ import { RelayConnection, debugLog } from './relayConnection'
 import { create } from 'zustand'
 
 // Relay URL - fixed port for MCP bridge
-const RELAY_URL = 'ws://localhost:9988/extension'
+const RELAY_URL = 'ws://localhost:19988/extension'
 
 type ConnectionState = 'disconnected' | 'reconnecting' | 'connected' | 'error'
 
@@ -42,10 +42,10 @@ chrome.runtime.onInstalled.addListener((details) => {
 const icons = {
   connected: {
     path: {
-      '16': '/icons/icon-green-16.png',
-      '32': '/icons/icon-green-32.png',
-      '48': '/icons/icon-green-48.png',
-      '128': '/icons/icon-green-128.png',
+      '16': '/icons/icon-16.png',
+      '32': '/icons/icon-32.png',
+      '48': '/icons/icon-48.png',
+      '128': '/icons/icon-128.png',
     },
     title: 'Connected - Click to disconnect',
     badgeText: '',
@@ -122,12 +122,12 @@ async function ensureConnection(): Promise<void> {
   }
 
   debugLog('No existing connection, creating new relay connection')
-  debugLog('Waiting for server at http://localhost:9988...')
+  debugLog('Waiting for server at http://localhost:19988...')
 
   useExtensionStore.setState({ connectionState: 'reconnecting' })
   while (true) {
     try {
-      await fetch('http://localhost:9988', { method: 'HEAD' })
+      await fetch('http://localhost:19988', { method: 'HEAD' })
       debugLog('Server is available')
       break
     } catch (error: any) {

multiple-playwrights.md

@@ -23,9 +23,9 @@ The relay server acts as a bridge between:
 Each Playwright client must connect with a unique identifier in the connection path:
 
 ```
-ws://localhost:9988/cdp/client-123
-ws://localhost:9988/cdp/automation-bot-1  
-ws://localhost:9988/cdp/test-runner-42
+ws://localhost:19988/cdp/client-123
+ws://localhost:19988/cdp/automation-bot-1  
+ws://localhost:19988/cdp/test-runner-42
 ```
 
 If no client ID is provided in the path, the connection is rejected. This ensures every client can be uniquely identified and tracked.
@@ -110,4 +110,4 @@ Multiple developers can connect their own Playwright instances to debug differen
 
 - Each tab can only be controlled by one client at a time
 - Session ownership is "sticky" - once claimed, it remains until client disconnect
-- No built-in session sharing or handoff mechanism (by design, for safety)
+- No built-in session sharing or handoff mechanism (by design, for safety)

playwriter/scripts/extension-connect.ts

@@ -1,7 +1,7 @@
 import playwright from 'playwright-core'
 
 async function main() {
-    const cdpEndpoint = `ws://localhost:9988/cdp/${Date.now()}`
+    const cdpEndpoint = `ws://localhost:19988/cdp/${Date.now()}`
     const browser = await playwright.chromium.connectOverCDP(cdpEndpoint, {
 
     })

playwriter/scripts/extension-new-page.ts

@@ -1,7 +1,7 @@
 import playwright from 'playwright-core'
 
 async function main() {
-    const cdpEndpoint = `ws://localhost:9988/cdp/${Date.now()}`
+    const cdpEndpoint = `ws://localhost:19988/cdp/${Date.now()}`
     const browser = await playwright.chromium.connectOverCDP(cdpEndpoint)
 
     const contexts = browser.contexts()

playwriter/scripts/extension-server.ts

@@ -1,7 +1,7 @@
 import { startRelayServer } from '../src/extension/cdp-relay.js'
 
 async function main() {
-  const server = await startRelayServer({ port: 9988 })
+  const server = await startRelayServer({ port: 19988 })
 
   console.log('Server running. Press Ctrl+C to stop.')
 

playwriter/src/extension/cdp-relay.ts

@@ -20,7 +20,7 @@ type PlaywrightClient = {
   ws: WSContext
 }
 
-export async function startRelayServer({ port = 9988, logger = console }: { port?: number; logger?: { log(...args: any[]): void; error(...args: any[]): void } } = {}) {
+export async function startRelayServer({ port = 19988, logger = console }: { port?: number; logger?: { log(...args: any[]): void; error(...args: any[]): void } } = {}) {
   const connectedTargets = new Map<string, ConnectedTarget>()
 
   const playwrightClients = new Map<string, PlaywrightClient>()

playwriter/src/mcp.test.ts

@@ -31,7 +31,7 @@ describe('MCP Server Tests', () => {
     let cleanup: (() => Promise<void>) | null = null
 
     beforeAll(async () => {
-        await killProcessOnPort(9988)
+        await killProcessOnPort(19988)
         const result = await createMCPClient()
         client = result.client
         cleanup = result.cleanup

playwriter/src/mcp.ts

@@ -22,7 +22,7 @@ const state: ToolState = {
   browser: null,
 }
 
-const RELAY_PORT = 9988
+const RELAY_PORT = 19988
 
 async function isPortTaken(port: number): Promise<boolean> {
   try {

playwriter/src/start-relay-server.ts

@@ -9,7 +9,7 @@ const logFilePath = path.join(__dirname, '..', 'relay-server.log')
 fs.writeFileSync(logFilePath, '')
 
 const log = (...args: any[]) => {
-  const message = args.map(arg => 
+  const message = args.map(arg =>
     typeof arg === 'string' ? arg : JSON.stringify(arg)
   ).join(' ')
   fs.appendFileSync(logFilePath, message + '\n')
@@ -20,7 +20,7 @@ const logger = {
   error: log
 }
 
-export async function startServer({ port = 9988 }: { port?: number } = {}) {
+export async function startServer({ port = 19988 }: { port?: number } = {}) {
   const server = await startRelayServer({ port, logger })
 
   console.log('CDP Relay Server running. Press Ctrl+C to stop.')