do not send CDP commands too soon.

extension/src/background.ts

@@ -280,8 +280,18 @@ function onDebuggerEvent(source: chrome.debugger.DebuggerSession, method: string
   }
 
   if (method === 'Target.detachedFromTarget' && params?.sessionId) {
-    logger.debug('Child target detached:', params.sessionId)
-    childSessions.delete(params.sessionId)
+    const mainTab = getTabBySessionId(params.sessionId)
+    if (mainTab) {
+      logger.debug('Main tab detached via CDP event:', mainTab.tabId, 'sessionId:', params.sessionId)
+      store.setState((state) => {
+        const newTabs = new Map(state.tabs)
+        newTabs.delete(mainTab.tabId)
+        return { tabs: newTabs }
+      })
+    } else {
+      logger.debug('Child target detached:', params.sessionId)
+      childSessions.delete(params.sessionId)
+    }
   }
 
   sendMessage({
@@ -340,6 +350,8 @@ async function attachTab(tabId: number): Promise<Protocol.Target.TargetInfo> {
   await chrome.debugger.attach(debuggee, '1.3')
   logger.debug('Debugger attached successfully to tab:', tabId)
 
+  await new Promise((resolve) => setTimeout(resolve, 400))
+
   const result = (await chrome.debugger.sendCommand(
     debuggee,
     'Target.getTargetInfo',

playwriter/package.json

@@ -48,6 +48,7 @@
     "kill-port-process": "^3.2.1",
     "playwright-core": "^1.56.1",
     "string-dedent": "^3.0.2",
+    "strip-ansi": "^7.1.2",
     "user-agents": "^1.1.669",
     "ws": "^8.18.3",
     "zod": "^3"

playwriter/src/create-logger.ts

@@ -1,6 +1,7 @@
 import fs from 'node:fs'
 import path from 'node:path'
 import util from 'node:util'
+import stripAnsi from 'strip-ansi'
 import { LOG_FILE_PATH } from './utils.js'
 
 export type Logger = {
@@ -23,7 +24,7 @@ export function createFileLogger({ logFilePath }: { logFilePath?: string } = {})
     const message = args.map(arg =>
       typeof arg === 'string' ? arg : util.inspect(arg, { depth: null, colors: false })
     ).join(' ')
-    queue = queue.then(() => fs.promises.appendFile(resolvedLogFilePath, message + '\n'))
+    queue = queue.then(() => fs.promises.appendFile(resolvedLogFilePath, stripAnsi(message) + '\n'))
     return queue
   }
 

playwriter/src/mcp.ts

@@ -111,12 +111,12 @@ async function setDeviceScaleFactorForMacOS(context: BrowserContext): Promise<vo
     return
   }
   options.deviceScaleFactor = 2
-  for (const page of context.pages()) {
-    const delegate = (page as any)._delegate
-    if (delegate?.updateEmulatedViewportSize) {
-      await delegate.updateEmulatedViewportSize().catch(() => {})
-    }
-  }
+  // for (const page of context.pages()) {
+  //   const delegate = (page as any)._delegate
+  //   if (delegate?.updateEmulatedViewportSize) {
+  //     await delegate.updateEmulatedViewportSize().catch(() => {})
+  //   }
+  // }
 }
 
 async function preserveSystemColorScheme(context: BrowserContext): Promise<void> {
@@ -127,11 +127,11 @@ async function preserveSystemColorScheme(context: BrowserContext): Promise<void>
   options.colorScheme = 'no-override'
   options.reducedMotion = 'no-override'
   options.forcedColors = 'no-override'
-  await Promise.all(
-    context.pages().map((page) => {
-      return page.emulateMedia({ colorScheme: null, reducedMotion: null, forcedColors: null }).catch(() => {})
-    }),
-  )
+  // await Promise.all(
+  //   context.pages().map((page) => {
+  //     return page.emulateMedia({ colorScheme: null, reducedMotion: null, forcedColors: null }).catch(() => {})
+  //   }),
+  // )
 }
 
 function isRegExp(value: any): value is RegExp {

pnpm-lock.yaml

@@ -90,6 +90,9 @@ importers:
       string-dedent:
         specifier: ^3.0.2
         version: 3.0.2
+      strip-ansi:
+        specifier: ^7.1.2
+        version: 7.1.2
       user-agents:
         specifier: ^1.1.669
         version: 1.1.669