codex-webapp 0.1.6 → 0.1.8

package/src/browserPreload.js

@@ -0,0 +1,176 @@
+(function () {
+  const APP_SESSION_ID = "codex-webapp-browser-session";
+  const REQUEST_TIMEOUT_MS = 10_000;
+  const sharedObjects = new Map([
+    ["host_config", { id: "local", display_name: "Local", kind: "local" }],
+    ["remote_connections", []],
+    ["remote_control_connections", []],
+  ]);
+  const pending = new Map();
+  const queue = [];
+  let nextId = 1;
+  let socket = null;
+  let socketOpen = false;
+  const nativeFetch = window.fetch?.bind(window);
+
+  if (nativeFetch) {
+    window.fetch = function codexWebappFetch(input, init) {
+      const url = typeof input === "string" ? input : input?.url;
+      if (String(url || "").startsWith("sentry-ipc://")) {
+        return Promise.resolve(new Response("{}", {
+          status: 200,
+          headers: { "content-type": "application/json" },
+        }));
+      }
+      return nativeFetch(input, init);
+    };
+  }
+
+  function connect() {
+    if (socket) return;
+    const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
+    socket = new WebSocket(`${protocol}//${window.location.host}/__backend/ipc`);
+    socket.addEventListener("open", () => {
+      socketOpen = true;
+      while (queue.length > 0) socket.send(queue.shift());
+    });
+    socket.addEventListener("message", (event) => {
+      let message;
+      try {
+        message = JSON.parse(String(event.data));
+      } catch {
+        return;
+      }
+      if (message && message.id && pending.has(message.id)) {
+        const deferred = pending.get(message.id);
+        pending.delete(message.id);
+        clearTimeout(deferred.timer);
+        if (message.ok === false) {
+          deferred.reject(new Error(message.error || "Codex WebApp IPC request failed"));
+          return;
+        }
+        deferred.resolve(message.result);
+        return;
+      }
+      if (message && message.type === "event") {
+        receiveFromHost(message.payload);
+      }
+    });
+    socket.addEventListener("close", () => {
+      socketOpen = false;
+      socket = null;
+    });
+  }
+
+  function request(kind, payload) {
+    connect();
+    const id = String(nextId++);
+    const frame = JSON.stringify({ id, kind, payload });
+    if (socketOpen && socket?.readyState === WebSocket.OPEN) {
+      socket.send(frame);
+    } else {
+      queue.push(frame);
+    }
+    return new Promise((resolve, reject) => {
+      const timer = setTimeout(() => {
+        pending.delete(id);
+        reject(new Error(`Codex WebApp IPC timed out: ${kind}`));
+      }, REQUEST_TIMEOUT_MS);
+      pending.set(id, { resolve, reject, timer });
+    });
+  }
+
+  function receiveFromHost(payload) {
+    if (!payload || typeof payload !== "object") return;
+    if (payload.type === "shared-object-updated" && payload.key) {
+      sharedObjects.set(payload.key, payload.value);
+    }
+    window.dispatchEvent(new MessageEvent("message", {
+      data: payload,
+      origin: window.location.origin,
+      source: window,
+    }));
+  }
+
+  function sendMessageFromView(message) {
+    if (message?.type === "shared-object-set" && message.key) {
+      sharedObjects.set(message.key, message.value);
+      receiveFromHost({ type: "shared-object-updated", key: message.key, value: message.value });
+    }
+    return request("view-message", message).catch(() => undefined);
+  }
+
+  function sendWorkerMessageFromView(workerId, message) {
+    return request("worker-message", { workerId, message }).catch(() => undefined);
+  }
+
+  function subscribeToWorkerMessages(workerId, callback) {
+    const handler = (event) => {
+      const message = event.data;
+      if (message?.type === `codex_desktop:worker:${workerId}:for-view`) {
+        callback(message.payload);
+      }
+    };
+    window.addEventListener("message", handler);
+    return () => window.removeEventListener("message", handler);
+  }
+
+  function getSystemThemeVariant() {
+    return window.matchMedia?.("(prefers-color-scheme: dark)")?.matches ? "dark" : "light";
+  }
+
+  function subscribeToSystemThemeVariant(callback) {
+    const query = window.matchMedia?.("(prefers-color-scheme: dark)");
+    if (!query) return () => {};
+    const listener = () => callback(getSystemThemeVariant());
+    query.addEventListener?.("change", listener);
+    return () => query.removeEventListener?.("change", listener);
+  }
+
+  window.codexWindowType = "electron";
+  window.electronBridge = {
+    windowType: "electron",
+    sendMessageFromView,
+    getPathForFile(file) {
+      return file?.path || file?.name || "";
+    },
+    sendWorkerMessageFromView,
+    subscribeToWorkerMessages,
+    showContextMenu(options) {
+      return request("show-context-menu", options).catch(() => null);
+    },
+    showApplicationMenu(options) {
+      return request("show-application-menu", options).catch(() => null);
+    },
+    getFastModeRolloutMetrics() {
+      return Promise.resolve(null);
+    },
+    getSharedObjectSnapshotValue(key) {
+      return sharedObjects.get(key);
+    },
+    getSystemThemeVariant,
+    subscribeToSystemThemeVariant,
+    triggerSentryTestError() {
+      throw new Error("Codex WebApp browser Sentry test");
+    },
+    getSentryInitOptions() {
+      return {
+        appVersion: "0.0.0",
+        buildFlavor: "prod",
+        buildNumber: "0",
+        dsn: null,
+        environment: "browser",
+        codexAppSessionId: APP_SESSION_ID,
+        release: null,
+      };
+    },
+    getAppSessionId() {
+      return APP_SESSION_ID;
+    },
+    getBuildFlavor() {
+      return "prod";
+    },
+  };
+
+  connect();
+})();

package/src/browserSmoke.js

@@ -1,7 +1,7 @@
 import { createRequire } from "node:module";
 import { resolve } from "node:path";
 
-const DEFAULT_TEXT = "What should we";
+const DEFAULT_TEXT = "Codex";
 const DEFAULT_MAX_RESPONSE_MS = 5_000;
 
 export function parseSmokeArgs(args = []) {
@@ -66,7 +66,7 @@ async function runBrowserSmokeWithOptions(options) {
       waitUntil: "networkidle",
       timeout: options.timeoutMs,
     });
-    await page.getByText(options.text, { exact: false }).waitFor({
+    await page.waitForFunction((needle) => document.body?.innerText.includes(needle), options.text, {
       timeout: options.timeoutMs,
     });
     if (options.screenshot) {

package/src/codexAppRenderer.js

@@ -0,0 +1,12 @@
+export {
+  BROWSER_PRELOAD_ROUTE,
+  DEFAULT_CODEX_APP_ASAR,
+  DEFAULT_CODEX_APP_PATH,
+  DEFAULT_RENDERER_CACHE_ROOT,
+  createStaticRendererAssetSource as createStaticRenderer,
+  headersForAsset,
+  isUnsafeRendererPath,
+  matchRendererAsset,
+  prepareRendererAssetSource as prepareCodexAppRenderer,
+  streamAsset,
+} from "./rendererAssetSource.js";

package/src/codexWeb.js

@@ -1,6 +1,3 @@
-export const CODEX_WEB_UPSTREAM = "github:0xcaff/codex-web";
-export const CODEX_WEB_COMMIT = "585613f5a3a355af5aefc388ca4e31b07a472cda";
-export const CODEX_WEB_REFERENCE = `${CODEX_WEB_UPSTREAM}#${CODEX_WEB_COMMIT}`;
 export const DEFAULT_WEB_HOST = "127.0.0.1";
 export const DEFAULT_WEB_PORT = 8214;
 
@@ -21,21 +18,17 @@ export function buildWebUrl({ host = DEFAULT_WEB_HOST, port = DEFAULT_WEB_PORT }
 export function assertSafeHost(host, { allowNonLoopback = false } = {}) {
   if (allowNonLoopback || isLoopbackHost(host)) return;
   throw new Error(
-    "Refusing to bind codex-web to a non-loopback host without --allow-non-loopback. Put Tailscale, Cloudflare Access, WireGuard, SSH tunneling, or an equivalent trusted boundary in front before remote access.",
+    "Refusing to bind Codex WebApp to a non-loopback host without --allow-non-loopback. Put Tailscale, Cloudflare Access, WireGuard, SSH tunneling, or an equivalent trusted boundary in front before remote access.",
   );
 }
 
-export function buildCodexWebNpxArgs({ host = DEFAULT_WEB_HOST, port = DEFAULT_WEB_PORT } = {}) {
-  return [
-    "--yes",
-    "--package",
-    CODEX_WEB_REFERENCE,
-    "codex-web",
-    "--host",
+export function buildLocalServerSummary({ host = DEFAULT_WEB_HOST, port = DEFAULT_WEB_PORT } = {}) {
+  return {
     host,
-    "--port",
-    String(port),
-  ];
+    port,
+    url: buildWebUrl({ host, port }),
+    runtime: "package-owned Codex App renderer bridge",
+  };
 }
 
 export function isLoopbackHost(host) {

package/src/commands.js

@@ -1,4 +1,4 @@
-import { spawn, spawnSync } from "node:child_process";
+import { spawnSync } from "node:child_process";
 import { createServer } from "node:net";
 import { createInterface } from "node:readline/promises";
 import { stdin as input, stdout as output } from "node:process";
@@ -9,10 +9,10 @@ import {
   MIN_CODEX_VERSION,
 } from "./version.js";
 import { runSmoke } from "./browserSmoke.js";
+import { startLocalServer } from "./localServer.js";
 import {
-  CODEX_WEB_REFERENCE,
   assertSafeHost,
-  buildCodexWebNpxArgs,
+  buildLocalServerSummary,
   buildWebUrl,
   parseStartArgs,
 } from "./codexWeb.js";
@@ -60,8 +60,9 @@ export function main(argv = process.argv) {
 }
 
 export function doctor() {
-  const codex = spawnSync("codex", ["--version"], { encoding: "utf8" });
   const codexPath = resolveCodexPath();
+  const codexCommand = codexPath || "codex";
+  const codex = spawnSync(codexCommand, ["--version"], { encoding: "utf8" });
   if (codex.error || codex.status !== 0) {
     fail([
       "Codex CLI was not found.",
@@ -89,7 +90,7 @@ export function doctor() {
     ]);
   }
 
-  const helpResult = spawnSync("codex", ["remote-control", "--help"], {
+  const helpResult = spawnSync(codexCommand, ["remote-control", "--help"], {
     encoding: "utf8",
   });
   if (helpResult.status !== 0) {
@@ -102,12 +103,25 @@ export function doctor() {
     ]);
   }
 
+  const appServerResult = spawnSync(codexCommand, ["app-server", "--help"], {
+    encoding: "utf8",
+  });
+  if (appServerResult.status !== 0) {
+    fail([
+      "`codex app-server --help` did not run successfully.",
+      "",
+      "Codex is installed, but the local app-server substrate is unavailable.",
+      "Update Codex and try again:",
+      "  npm install -g @openai/codex@latest",
+    ]);
+  }
+
   ok([
     BANNER,
     `Codex CLI is ready: ${versionText}`,
     `Codex executable: ${codexPath || "unknown"}`,
     "`codex remote-control` is available.",
-    `codex-web reference: ${CODEX_WEB_REFERENCE}`,
+    "`codex app-server` is available.",
     "Next:",
     "  npx -y codex-webapp start",
     "",
@@ -117,20 +131,16 @@ export function doctor() {
 
 export async function start(args = []) {
   const options = parseStartArgs(args);
-  const check = spawnSync("codex", ["remote-control", "--help"], {
+  const codexPath = resolveCodexPath();
+  const codexCommand = codexPath || process.env.CODEX_CLI_PATH || "codex";
+  const check = spawnSync(codexCommand, ["app-server", "--help"], {
     encoding: "utf8",
   });
-  if (check.status !== 0) {
-    fail([
-      "Cannot start because `codex remote-control` is unavailable.",
-      "Run:",
-      "  npx codex-webapp doctor",
-    ]);
-  }
+  const appServerReady = check.status === 0;
 
   assertSafeHost(options.host, { allowNonLoopback: options.allowNonLoopback });
   const plannedWebUrl = buildWebUrl({ host: options.host, port: options.port });
-  const npxArgs = buildCodexWebNpxArgs({
+  const localServer = buildLocalServerSummary({
     host: options.host,
     port: options.port,
   });
@@ -139,12 +149,10 @@ export async function start(args = []) {
     ok([
       BANNER,
       "Dry run passed.",
-      `Would start codex-web: ${plannedWebUrl}`,
+      `Would start Codex WebApp: ${plannedWebUrl}`,
+      `Runtime: ${localServer.runtime}`,
       "",
       ...codexAppFlowLines(plannedWebUrl),
-      "",
-      "Would start:",
-      `  npx ${npxArgs.join(" ")}`,
     ]);
     return;
   }
@@ -153,7 +161,7 @@ export async function start(args = []) {
 
   if (!options.yes) {
     console.log(BANNER);
-    console.log(`About to start codex-web: ${plannedWebUrl}`);
+    console.log(`About to start Codex WebApp: ${plannedWebUrl}`);
     console.log("Default expectation: keep it on localhost or behind Tailscale, Cloudflare Access, or an equivalent trusted boundary.");
     console.log("Anyone who can reach this URL can operate Codex on this host.");
     const rl = createInterface({ input, output });
@@ -165,22 +173,21 @@ export async function start(args = []) {
     }
   }
 
-  console.log(`Starting codex-web from ${CODEX_WEB_REFERENCE}...`);
+  console.log("Starting Codex WebApp local server...");
+  if (!appServerReady) {
+    console.log("Warning: `codex app-server --help` did not pass. The UI will still open, but health will show the Codex substrate issue.");
+    console.log("Run `npx codex-webapp doctor` in another terminal for the exact fix.");
+  }
   console.log(`Open: ${plannedWebUrl}`);
   console.log("");
   for (const line of codexAppFlowLines(plannedWebUrl)) console.log(line);
   console.log("");
   console.log("Keep this terminal open. Expose it only through a trusted local, Tailscale, Cloudflare Access, or equivalent boundary.");
-  const codexPath = resolveCodexPath();
-  const child = spawn("npx", npxArgs, {
-    stdio: "inherit",
-    env: {
-      ...process.env,
-      CODEX_CLI_PATH: codexPath || process.env.CODEX_CLI_PATH || "codex",
-    },
-  });
-  child.on("exit", (code) => {
-    process.exit(code ?? 0);
+  await startLocalServer({
+    host: options.host,
+    port: options.port,
+    codexPath: codexCommand,
+    cwd: process.cwd(),
   });
 }
 
@@ -206,7 +213,7 @@ export function help() {
 
 Commands:
   codex-webapp doctor       Check Codex CLI >= ${MIN_CODEX_VERSION}
-  codex-webapp start        Confirm, then start codex-web
+  codex-webapp start        Confirm, then start Codex WebApp
   codex-webapp start --dry-run
   codex-webapp start --yes  Start without the confirmation prompt
   codex-webapp start --port 8214
@@ -239,7 +246,7 @@ function fail(lines) {
 }
 
 export function resolveCodexPath() {
-  const result = spawnSync("bash", ["-lc", "command -v codex"], {
+  const result = spawnSync("bash", ["-l", "-c", "which codex"], {
     encoding: "utf8",
   });
   if (result.status !== 0) return "";