serve-sim 0.1.22 → 0.1.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "serve-sim",
-  "version": "0.1.22",
+  "version": "0.1.24",
   "type": "module",
   "author": {
     "name": "Evan Bacon",
@@ -27,11 +27,18 @@
     "dist/serve-sim.js",
     "dist/middleware.js",
     "dist/middleware.cjs",
+    "dist/simcam/libSimCameraInjector.dylib",
+    "dist/simcam/serve-sim-camera-helper",
     "src/ax-shared.ts",
     "src/ax.ts",
     "src/middleware.ts",
     "src/state.ts",
-    "bin/serve-sim-bin"
+    "bin/serve-sim-bin",
+    "Sources/SimCameraInjector/SimCameraInjector.m",
+    "Sources/SimCameraInjector/include/SimCamShared.h",
+    "Sources/SimCameraInjector/build.sh",
+    "Sources/SimCameraHelper/main.m",
+    "Sources/SimCameraHelper/build.sh"
   ],
   "exports": {
     "./middleware": {
@@ -51,10 +58,14 @@
   },
   "devDependencies": {
     "@types/bun": "latest",
-    "serve-sim-client": "workspace:*",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "bun-plugin-tailwind": "^0.1.2",
     "preact": "^10.29.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "serve-sim-client": "workspace:*",
+    "tailwindcss": "^4.1.7",
     "typescript": "^5.7.0"
   },
   "dependencies": {

package/src/ax.ts

@@ -62,12 +62,12 @@ function normalizeAxTree(roots: RawAxeNode[]): AxSnapshot {
     }
 
     for (let index = 0; index < node.children.length && elements.length < MAX_ELEMENTS; index++) {
-      visit(node.children[index], `${path}.${index}`);
+      visit(node.children[index]!, `${path}.${index}`);
     }
   };
 
   for (let index = 0; index < roots.length && elements.length < MAX_ELEMENTS; index++) {
-    visit(roots[index], String(index));
+    visit(roots[index]!, String(index));
   }
 
   return {

package/src/middleware.ts

@@ -1,10 +1,15 @@
 import { readdirSync, readFileSync, existsSync, unlinkSync } from "fs";
-import { execSync, spawn, exec, execFile, type ChildProcess } from "child_process";
+import { execSync, spawn, exec, execFile, type ChildProcess, type ExecException } from "child_process";
 import { tmpdir } from "os";
 import { join } from "path";
 import { createServer as createNetServer } from "net";
+import type { IncomingMessage, ServerResponse } from "http";
 import { createAxStreamerCache } from "./ax";
 
+type SimReq = IncomingMessage;
+type SimRes = ServerResponse;
+type SimNext = (err?: unknown) => void;
+
 // Injected at build time as a base64-encoded string via `define`
 declare const __PREVIEW_HTML_B64__: string;
 const STATE_DIR = join(tmpdir(), "serve-sim");
@@ -31,6 +36,41 @@ type WebKitBridge = {
   releaseHighlight?(targetId?: string): void;
 };
 
+type InspectWebKitBridgeTarget = {
+  targetId: string;
+  title?: string;
+  appName?: string;
+  url?: string;
+  type?: string;
+  bundleId?: string;
+  inUseByOtherInspector?: boolean;
+  source?: { kind?: string; id?: string };
+};
+
+type CdpHttpListEntry = {
+  id: string;
+  title: string;
+  url: string;
+  type: string;
+  description?: string;
+};
+
+type CdpHttpVersion = { Browser?: string };
+
+type SimctlBootedList = {
+  devices: Record<string, Array<{ udid: string; state: string }>>;
+};
+
+type SimctlAllList = {
+  devices: Record<string, Array<Omit<SimctlDevice, "runtime">>>;
+};
+
+type ShutdownRequestBody = { udid?: string };
+type StartRequestBody = { udid?: string };
+type ReleaseRequestBody = { targetId?: string };
+type HighlightRequestBody = { targetId?: string; on?: boolean };
+type ExecRequestBody = { command?: string };
+
 export interface ServeSimState {
   pid: number;
   port: number;
@@ -123,53 +163,6 @@ export function matchInstalledAppByDisplayName(
   return null;
 }
 
-function shellQuote(value: string): string {
-  return "'" + value.replace(/'/g, "'\\''") + "'";
-}
-
-function installedAppsForDevice(udid: string): Promise<Record<string, InstalledApp>> {
-  return new Promise((resolve) => {
-    exec(
-      `xcrun simctl listapps ${shellQuote(udid)} | plutil -convert json -o - -`,
-      { timeout: 3_000 },
-      (err, stdout) => {
-        if (err || !stdout) return resolve({});
-        try {
-          resolve(JSON.parse(stdout) as Record<string, InstalledApp>);
-        } catch {
-          resolve({});
-        }
-      },
-    );
-  });
-}
-
-async function detectCurrentForegroundApp(
-  udid: string,
-  stateUrl: string,
-): Promise<{ bundleId: string; isReactNative: boolean } | null> {
-  const controller = new AbortController();
-  const timer = setTimeout(() => controller.abort(), 2_000);
-  try {
-    const res = await fetch(`${stateUrl}/ax`, { signal: controller.signal });
-    if (!res.ok) return null;
-    const tree = await res.json() as Array<{ AXLabel?: unknown }>;
-    const displayName = tree?.[0]?.AXLabel;
-    if (typeof displayName !== "string") return null;
-
-    const bundleId = matchInstalledAppByDisplayName(
-      await installedAppsForDevice(udid),
-      displayName,
-    );
-    if (!bundleId || !isUserFacingBundle(bundleId)) return null;
-    return { bundleId, isReactNative: await detectReactNative(udid, bundleId) };
-  } catch {
-    return null;
-  } finally {
-    clearTimeout(timer);
-  }
-}
-
 // Cache simctl's booted-device set briefly so per-request cost stays bounded.
 // The middleware runs inside the user's dev server (Metro etc.) and
 // readServeSimStates() is called on every /api and every page load.
@@ -185,9 +178,7 @@ function getBootedUdids(): Set<string> | null {
       stdio: ["ignore", "pipe", "pipe"],
       timeout: 3_000,
     });
-    const data = JSON.parse(output) as {
-      devices: Record<string, Array<{ udid: string; state: string }>>;
-    };
+    const data = JSON.parse(output) as SimctlBootedList;
     const booted = new Set<string>();
     for (const runtime of Object.values(data.devices)) {
       for (const device of runtime) {
@@ -272,7 +263,7 @@ async function existingInspectWebKitBridge(port: number): Promise<WebKitBridge |
   try {
     const versionRes = await fetch(`${cdpUrl}/json/version`);
     if (!versionRes.ok) return null;
-    const version = await versionRes.json() as { Browser?: string };
+    const version = await versionRes.json() as CdpHttpVersion;
     if (version.Browser !== "Safari/inspect-webkit") return null;
     return {
       port,
@@ -283,13 +274,7 @@ async function existingInspectWebKitBridge(port: number): Promise<WebKitBridge |
         // shape `sim:<udid>:<appId>:<pageId>` and the description string
         // `<deviceLabel> (<bundleId>)` are all we have here.
         const listRes = await fetch(`${cdpUrl}/json/list`);
-        const targets = await listRes.json() as Array<{
-          id: string;
-          title: string;
-          url: string;
-          type: string;
-          description?: string;
-        }>;
+        const targets = await listRes.json() as CdpHttpListEntry[];
         return targets
           .filter((target) => target.id.startsWith("sim:"))
           .map((target) => {
@@ -335,29 +320,35 @@ async function ensureInspectWebKitBridge(): Promise<WebKitBridge> {
         // (and what the DevTools frontend CSP whitelists). `localhost` resolves
         // to ::1 first on some setups, which would leave the iframe's
         // ws://127.0.0.1:9222 connection refused.
-        const server = await startCdpServer({ host: "127.0.0.1", port });
+        const server = await startCdpServer({ host: "127.0.0.1", port }) as Awaited<ReturnType<typeof startCdpServer>> & {
+          highlightTarget?(targetId: string, on: boolean): Promise<void>;
+          releaseHighlight?(targetId?: string): void;
+        };
         return {
           port,
           cdpUrl: `http://127.0.0.1:${port}`,
           async listTargets() {
-            return server.getTargets()
-              .filter((target: any) => target.source?.kind === "simulator")
-              .map((target: any) => ({
-                id: target.targetId,
-                title: target.title || target.appName || target.url || "Untitled",
-                url: /^https?:/i.test(target.url) ? target.url : "about:blank",
-                type: target.type || "page",
-                appName: target.appName,
-                bundleId: target.bundleId,
-                udid: target.source?.id,
-                inUseByOtherInspector: !!target.inUseByOtherInspector,
-              }));
+            return (server.getTargets() as InspectWebKitBridgeTarget[])
+              .filter((target) => target.source?.kind === "simulator")
+              .map((target) => {
+                const url = target.url ?? "";
+                return {
+                  id: target.targetId,
+                  title: target.title || target.appName || url || "Untitled",
+                  url: /^https?:/i.test(url) ? url : "about:blank",
+                  type: target.type || "page",
+                  appName: target.appName,
+                  bundleId: target.bundleId,
+                  udid: target.source?.id,
+                  inUseByOtherInspector: !!target.inUseByOtherInspector,
+                };
+              });
           },
           highlightTarget: server.highlightTarget?.bind(server),
           releaseHighlight: server.releaseHighlight?.bind(server),
         };
-      } catch (err: any) {
-        if (err?.code === "EADDRINUSE") {
+      } catch (err) {
+        if ((err as NodeJS.ErrnoException)?.code === "EADDRINUSE") {
           const existing = await existingInspectWebKitBridge(port);
           if (existing) return existing;
           continue;
@@ -392,6 +383,19 @@ function bridgeWsHost(_reqHost: string | undefined, bridgePort: number): string
 }
 
 let _html: string | null = null;
+/**
+ * Best-effort absolute path to the running serve-sim entry script. Used so
+ * the in-page Camera tool can `node <path> camera ...` regardless of PATH.
+ * Falls back to the literal `serve-sim` if we can't determine a usable path.
+ */
+function serveSimBinPath(): string {
+  try {
+    const argv = process.argv;
+    if (argv[1] && existsSync(argv[1])) return argv[1];
+  } catch {}
+  return "serve-sim";
+}
+
 function loadHtml(): string {
   if (!_html) {
     _html = Buffer.from(__PREVIEW_HTML_B64__, "base64").toString("utf-8");
@@ -414,9 +418,7 @@ function listAllSimulators(): SimctlDevice[] {
       stdio: ["ignore", "pipe", "ignore"],
       timeout: 3_000,
     });
-    const data = JSON.parse(output) as {
-      devices: Record<string, Array<Omit<SimctlDevice, "runtime">>>;
-    };
+    const data = JSON.parse(output) as SimctlAllList;
     const out: SimctlDevice[] = [];
     for (const [runtime, devices] of Object.entries(data.devices)) {
       // Only iOS (skip watchOS / tvOS / visionOS for the grid MVP — the helper
@@ -433,10 +435,6 @@ function listAllSimulators(): SimctlDevice[] {
   }
 }
 
-function deviceNameFor(udid: string): string | null {
-  return listAllSimulators().find((d) => d.udid === udid)?.name ?? null;
-}
-
 // Default per-simulator footprint when we have no running sim to measure
 // from — a fresh booted iOS sim with one app launched typically sits in
 // the 1.2–1.8 GB range. Used as a fallback only.
@@ -513,7 +511,7 @@ function readSimulatorMemoryUsage(): { perUdid: Record<string, number>; totalByt
       const rssKb = Number(line.split(/\s+/, 1)[0]);
       if (!Number.isFinite(rssKb)) continue;
       const bytes = rssKb * 1024;
-      const udid = m[1].toUpperCase();
+      const udid = m[1]!.toUpperCase();
       perUdid[udid] = (perUdid[udid] ?? 0) + bytes;
       totalBytes += bytes;
     }
@@ -598,7 +596,7 @@ export interface SimMiddlewareOptions {
 export function simMiddleware(options?: SimMiddlewareOptions) {
   const base = (options?.basePath ?? "/.sim").replace(/\/+$/, "");
 
-  return (req: any, res: any, next?: () => void) => {
+  return (req: SimReq, res: SimRes, next?: SimNext) => {
     const rawUrl: string = req.url ?? "";
     const qIndex = rawUrl.indexOf("?");
     const url = qIndex === -1 ? rawUrl : rawUrl.slice(0, qIndex);
@@ -657,6 +655,10 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
           appStateEndpoint: endpoint(base, "/appstate", state.device),
           axEndpoint: endpoint(base, "/ax", state.device),
           devtoolsEndpoint: endpoint(base, "/devtools", state.device),
+          // Forward the absolute path of the running serve-sim entry script
+          // so the in-page Camera tool can shell out via `node <bin> camera`
+          // without depending on `serve-sim` being on PATH.
+          serveSimBin: serveSimBinPath(),
           gridApiEndpoint: gridApiBase,
           gridStartEndpoint: gridApiBase + "/start",
           gridShutdownEndpoint: gridApiBase + "/shutdown",
@@ -743,7 +745,7 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
       });
       req.on("end", () => {
         let udid = "";
-        try { udid = JSON.parse(body).udid ?? ""; } catch {}
+        try { udid = (JSON.parse(body) as ShutdownRequestBody).udid ?? ""; } catch {}
         if (!/^[0-9A-F]{8}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{12}$/i.test(udid)) {
           res.writeHead(400, { "Content-Type": "application/json" });
           res.end(JSON.stringify({ ok: false, error: "Invalid or missing udid" }));
@@ -776,7 +778,7 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
       });
       req.on("end", () => {
         let udid = "";
-        try { udid = JSON.parse(body).udid ?? ""; } catch {}
+        try { udid = (JSON.parse(body) as StartRequestBody).udid ?? ""; } catch {}
         if (!/^[0-9A-F]{8}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{4}-[0-9A-F]{12}$/i.test(udid)) {
           res.writeHead(400, { "Content-Type": "application/json" });
           res.end(JSON.stringify({ ok: false, error: "Invalid or missing udid" }));
@@ -875,10 +877,10 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
     // Optional body { targetId } releases just one; empty body releases all.
     if (url === base + "/devtools/release" && req.method === "POST") {
       let body = "";
-      req.on("data", (chunk) => (body += chunk));
+      req.on("data", (chunk: Buffer) => (body += chunk));
       req.on("end", async () => {
         try {
-          const parsed = body ? JSON.parse(body) as { targetId?: string } : {};
+          const parsed: ReleaseRequestBody = body ? JSON.parse(body) : {};
           const bridge = await ensureInspectWebKitBridge();
           bridge.releaseHighlight?.(parsed.targetId);
           res.writeHead(200, { "Content-Type": "application/json" });
@@ -898,10 +900,10 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
     // { targetId: string, on: boolean }.
     if (url === base + "/devtools/highlight" && req.method === "POST") {
       let body = "";
-      req.on("data", (chunk) => (body += chunk));
+      req.on("data", (chunk: Buffer) => (body += chunk));
       req.on("end", async () => {
         try {
-          const { targetId, on } = JSON.parse(body || "{}") as { targetId?: string; on?: boolean };
+          const { targetId, on } = JSON.parse(body || "{}") as HighlightRequestBody;
           if (!targetId) {
             res.writeHead(400, { "Content-Type": "application/json" });
             res.end(JSON.stringify({ error: "Missing targetId" }));
@@ -971,7 +973,7 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
       req.on("end", () => {
         let command = "";
         try {
-          command = JSON.parse(body).command ?? "";
+          command = (JSON.parse(body) as ExecRequestBody).command ?? "";
         } catch {}
         if (!command) {
           res.writeHead(400, { "Content-Type": "application/json" });
@@ -983,7 +985,7 @@ export function simMiddleware(options?: SimMiddlewareOptions) {
           res.end(JSON.stringify({
             stdout: stdout.toString(),
             stderr: stderr.toString(),
-            exitCode: err ? (err as any).code ?? 1 : 0,
+            exitCode: err ? (err as ExecException).code ?? 1 : 0,
           }));
         });
       });