feat: Consolidate extension console logs and capture in Playwright tests

packages/brow-2-brow/package.json

@@ -13,7 +13,7 @@
     "build:dev": "mkdir -p dist && ln -fs ../src/index.html dist/index.html",
     "build:docs": "typedoc",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/brow-2-brow",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/cli/package.json

@@ -18,7 +18,7 @@
     "build": "ts-bridge --project tsconfig.build.json --no-references --clean",
     "build:docs": "typedoc",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/cli",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/create-package/package.json

@@ -31,7 +31,7 @@
   "scripts": {
     "build:docs": "typedoc",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/create-package",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/extension/package.json

@@ -21,7 +21,7 @@
     "build:browser": "OPEN_BROWSER=true yarn build:dev --watch",
     "build:vite": "vite build --configLoader runner --config vite.config.ts",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/extension",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",
@@ -63,7 +63,7 @@
     "@ocap/cli": "workspace:^",
     "@ocap/kernel-test": "workspace:^",
     "@ocap/repo-tools": "workspace:^",
-    "@playwright/test": "^1.55.1",
+    "@playwright/test": "^1.57.0",
     "@testing-library/jest-dom": "^6.6.3",
     "@types/chrome": "^0.0.313",
     "@types/react": "^18.3.18",
@@ -83,7 +83,7 @@
     "eslint-plugin-prettier": "^5.2.6",
     "eslint-plugin-promise": "^7.2.1",
     "jsdom": "^27.4.0",
-    "playwright": "^1.55.1",
+    "playwright": "^1.57.0",
     "prettier": "^3.5.3",
     "rimraf": "^6.0.1",
     "tsx": "^4.20.6",

packages/extension/src/background.ts

@@ -4,6 +4,8 @@ import {
   makeCapTPNotification,
   isCapTPNotification,
   getCapTPMessage,
+  isConsoleForwardMessage,
+  handleConsoleForwardMessage,
 } from '@metamask/kernel-browser-runtime';
 import type { CapTPMessage } from '@metamask/kernel-browser-runtime';
 import defaultSubcluster from '@metamask/kernel-browser-runtime/default-cluster';
@@ -107,9 +109,11 @@ async function main(): Promise<void> {
   const kernelP = backgroundCapTP.getKernel();
   globalThis.kernel = kernelP;
 
-  // Handle incoming CapTP messages from the kernel
+  // Handle incoming messages from offscreen (CapTP and console-forward)
   const drainPromise = offscreenStream.drain((message) => {
-    if (isCapTPNotification(message)) {
+    if (isConsoleForwardMessage(message)) {
+      handleConsoleForwardMessage(message);
+    } else if (isCapTPNotification(message)) {
       const captpMessage = getCapTPMessage(message);
       backgroundCapTP.dispatch(captpMessage);
     } else {

packages/extension/src/offscreen.ts

@@ -2,6 +2,8 @@ import {
   makeIframeVatWorker,
   PlatformServicesServer,
   createRelayQueryString,
+  setupConsoleForwarding,
+  isConsoleForwardMessage,
 } from '@metamask/kernel-browser-runtime';
 import { delay, isJsonRpcMessage } from '@metamask/kernel-utils';
 import type { JsonRpcMessage } from '@metamask/kernel-utils';
@@ -31,6 +33,18 @@ async function main(): Promise<void> {
     JsonRpcMessage
   >(chrome.runtime, 'offscreen', 'background', isJsonRpcMessage);
 
+  // Set up console forwarding to background for Playwright capture
+  setupConsoleForwarding(backgroundStream, 'offscreen');
+
+  // Listen for console messages from vat iframes and forward to background
+  window.addEventListener('message', (event) => {
+    if (isConsoleForwardMessage(event.data)) {
+      backgroundStream.write(event.data).catch(() => {
+        // Ignore errors if stream isn't ready
+      });
+    }
+  });
+
   const kernelStream = await makeKernelWorker();
 
   // Handle messages from the background script / kernel

packages/extension/test/helpers.ts

@@ -11,7 +11,7 @@ const extensionPath = path.resolve(
 );
 
 export const loadExtension = async (contextId?: string) => {
-  return makeLoadExtension({
+  const result = await makeLoadExtension({
     contextId,
     extensionPath,
     onPageLoad: async (popupPage) => {
@@ -21,4 +21,13 @@ export const loadExtension = async (contextId?: string) => {
       ).toBeVisible();
     },
   });
+
+  // Wrap browserContext.close to auto-attach logs
+  const originalClose = result.browserContext.close.bind(result.browserContext);
+  result.browserContext.close = async () => {
+    await result.attachLogs();
+    return originalClose();
+  };
+
+  return result;
 };

packages/kernel-agents-repl/package.json

@@ -32,7 +32,7 @@
     "build": "ts-bridge --project tsconfig.build.json --no-references --clean",
     "build:docs": "typedoc",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/kernel-agents-repl",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/kernel-agents/package.json

@@ -132,7 +132,7 @@
     "build": "ts-bridge --project tsconfig.build.json --no-references --clean",
     "build:docs": "typedoc",
     "changelog:validate": "../../scripts/validate-changelog.sh @ocap/kernel-agents",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/kernel-browser-runtime/package.json

@@ -48,7 +48,7 @@
     "build:docs": "typedoc",
     "changelog:update": "../../scripts/update-changelog.sh @metamask/kernel-browser-runtime",
     "changelog:validate": "../../scripts/validate-changelog.sh @metamask/kernel-browser-runtime",
-    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo",
+    "clean": "rimraf --glob './*.tsbuildinfo' ./.eslintcache ./coverage ./dist ./.turbo ./logs",
     "lint": "yarn lint:eslint && yarn lint:misc --check && yarn constraints && yarn lint:dependencies",
     "lint:dependencies": "depcheck --quiet",
     "lint:eslint": "eslint . --cache",

packages/kernel-browser-runtime/src/index.test.ts

@@ -11,14 +11,19 @@ describe('index', () => {
       'createRelayQueryString',
       'getCapTPMessage',
       'getRelaysFromCurrentLocation',
+      'handleConsoleForwardMessage',
       'isCapTPNotification',
+      'isConsoleForwardMessage',
       'makeBackgroundCapTP',
       'makeCapTPNotification',
       'makeIframeVatWorker',
       'parseRelayQueryString',
       'receiveInternalConnections',
       'rpcHandlers',
       'rpcMethodSpecs',
+      'setupConsoleForwarding',
+      'setupPostMessageConsoleForwarding',
+      'stringifyConsoleArg',
     ]);
   });
 });

packages/kernel-browser-runtime/src/kernel-worker/kernel-worker.ts

@@ -17,6 +17,7 @@ import {
 import type { CapTPMessage } from '../background-captp.ts';
 import { receiveInternalConnections } from '../internal-comms/internal-connections.ts';
 import { PlatformServicesClient } from '../PlatformServicesClient.ts';
+import { setupConsoleForwarding } from '../utils/console-forwarding.ts';
 import { makeKernelCapTP } from './captp/index.ts';
 import { makeLoggingMiddleware } from './middleware/logging.ts';
 import { makePanelMessageMiddleware } from './middleware/panel-message.ts';
@@ -46,6 +47,9 @@ async function main(): Promise<void> {
       makeSQLKernelDatabase({ dbFilename: DB_FILENAME }),
     ]);
 
+  // Set up console forwarding - messages flow through offscreen to background
+  setupConsoleForwarding(messageStream, 'kernel-worker');
+
   const resetStorage =
     new URLSearchParams(globalThis.location.search).get('reset-storage') ===
     'true';