@alloy-js/core 0.23.0-dev.12 → 0.23.0-dev.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alloy-js/core",
-  "version": "0.23.0-dev.12",
+  "version": "0.23.0-dev.13",
   "description": "",
   "repository": {
     "type": "git",
@@ -43,8 +43,12 @@
   "browser": {
     "./dist/src/host/alloy-host.js": "./dist/src/host/alloy-host.browser.js",
     "./src/host/alloy-host.ts": "./src/host/alloy-host.browser.ts",
+    "./dist/src/host/node-host.js": "./dist/src/host/node-host.browser.js",
+    "./src/host/node-host.ts": "./src/host/node-host.browser.ts",
     "./dist/src/inspect.js": "./dist/src/inspect.browser.js",
     "./src/inspect.ts": "./src/inspect.browser.ts",
+    "./dist/src/debug/source-map.js": "./dist/src/debug/source-map.browser.js",
+    "./src/debug/source-map.ts": "./src/debug/source-map.browser.ts",
     "./dist/src/devtools/devtools-server.js": "./dist/src/devtools/devtools-server.browser.js",
     "./src/devtools/devtools-server.ts": "./src/devtools/devtools-server.browser.ts"
   },

package/src/debug/cli.ts

@@ -1,6 +1,7 @@
 import Table from "cli-table3";
 import pc from "picocolors";
 import { contextsByKey } from "../context.js";
+import { stdoutWrite } from "../host/node-host.js";
 import { getContext, untrack } from "../reactivity.js";
 import { isReactiveTarget } from "./effects.js";
 
@@ -143,7 +144,7 @@ export function debugStack() {
         currentContext.componentOwner &&
         currentContext.componentOwner.component.name !== "Provider"
       ) {
-        process.stdout.write(
+        stdoutWrite(
           style.component.name(currentContext.componentOwner.component.name) +
             "\n",
         );
@@ -164,7 +165,7 @@ export function debugStack() {
           : pc.gray("(none)"),
         ]);
 
-        process.stdout.write(table.toString() + "\n\n");
+        stdoutWrite(table.toString() + "\n\n");
         foundContexts = [];
       }
 

package/src/debug/source-map.browser.ts

@@ -0,0 +1,30 @@
+/**
+ * Browser stub for source-map resolution.
+ *
+ * Source maps are not resolved in the browser — all functions pass through
+ * their inputs unchanged.
+ */
+
+import type { SourceLocation } from "../devtools/devtools-protocol.js";
+
+export function loadSourceMapSupport() {
+  // no-op in browser
+}
+
+export function getRealPath(fileName: string): string {
+  return fileName;
+}
+
+export function resolveSourceMap(
+  fileName: string,
+  line: number,
+  col: number,
+): { fileName: string; line: number; col: number } {
+  return { fileName, line, col };
+}
+
+export function resolveComponentSource(
+  source: SourceLocation | undefined,
+): SourceLocation | undefined {
+  return source;
+}

package/src/debug/trace.ts

@@ -3,6 +3,7 @@
  */
 import type { ServerToClientMessage } from "../devtools/devtools-protocol.js";
 import { isDevtoolsEnabled } from "../devtools/devtools-server.js";
+import { env, sourceMapsEnabled } from "../host/node-host.js";
 import { untrack } from "../reactivity.js";
 import { initTrace, isTraceEnabled } from "./trace-writer.js";
 
@@ -21,12 +22,12 @@ export function isDebugEnabled(): boolean {
 // Environment configuration
 // ─────────────────────────────────────────────────────────────────────────────
 
-const traceEnv = process.env.ALLOY_TRACE ?? "";
+const traceEnv = env("ALLOY_TRACE") ?? "";
 const tracePhases = new Set<string>(
   traceEnv === "" ? [] : traceEnv.split(",").map((t) => t.trim()),
 );
 
-const debuggerIdsEnv = process.env.ALLOY_BREAK_ON_DID ?? "";
+const debuggerIdsEnv = env("ALLOY_BREAK_ON_DID") ?? "";
 const debuggerIds = new Set<number>();
 debuggerIdsEnv.split(",").forEach((id) => {
   const num = parseInt(id, 10);
@@ -37,9 +38,9 @@ debuggerIdsEnv.split(",").forEach((id) => {
 
 /** Parse the ALLOY_BREAK_ON_DID environment variable into a set of IDs. */
 export function parseBreakOnIds(): Set<number> {
-  const env = process.env.ALLOY_BREAK_ON_DID ?? "";
+  const raw = env("ALLOY_BREAK_ON_DID") ?? "";
   const ids = new Set<number>();
-  env.split(",").forEach((id) => {
+  raw.split(",").forEach((id) => {
     const num = parseInt(id, 10);
     if (!isNaN(num)) {
       ids.add(num);
@@ -65,7 +66,7 @@ if (tracePhases.size > 0) {
 }
 
 // Initialize SQLite trace writer if ALLOY_DEBUG_TRACE is set
-const traceDbEnv = process.env.ALLOY_DEBUG_TRACE;
+const traceDbEnv = env("ALLOY_DEBUG_TRACE");
 if (traceDbEnv) {
   const traceDbPath =
     traceDbEnv === "1" || traceDbEnv === "true" ? "alloy-trace.db" : traceDbEnv;
@@ -82,7 +83,7 @@ if (traceDbEnv) {
 if (import.meta.url.includes("/dist/dev/")) {
   // eslint-disable-next-line no-console
   console.log("Alloy debug build loaded.");
-  if (process.sourceMapsEnabled) {
+  if (sourceMapsEnabled()) {
     // eslint-disable-next-line no-console
     console.log("  Source maps enabled.");
   } else {

package/src/host/node-host.browser.ts

@@ -0,0 +1,23 @@
+/**
+ * Browser stub for Node.js host APIs.
+ *
+ * Replaces `node-host.ts` in browser builds so that no Node.js globals
+ * (`process`, etc.) are referenced.
+ */
+
+export function env(_key: string): string | undefined {
+  return undefined;
+}
+
+export function cwd(): string {
+  return "";
+}
+
+export function stdoutWrite(text: string): void {
+  // eslint-disable-next-line no-console
+  console.log(text);
+}
+
+export function sourceMapsEnabled(): boolean {
+  return false;
+}

package/src/host/node-host.ts

@@ -0,0 +1,22 @@
+/**
+ * Node.js host APIs.
+ *
+ * Provides access to Node.js-specific process APIs. In browser builds this
+ * module is replaced by `node-host.browser.ts` which returns safe defaults.
+ */
+
+export function env(key: string): string | undefined {
+  return process.env[key];
+}
+
+export function cwd(): string {
+  return process.cwd();
+}
+
+export function stdoutWrite(text: string): void {
+  process.stdout.write(text);
+}
+
+export function sourceMapsEnabled(): boolean {
+  return !!(process as any).sourceMapsEnabled;
+}

package/src/render-stack.ts

@@ -2,6 +2,7 @@ import pc from "picocolors";
 import { contextsByKey } from "./context.js";
 import { SourceDirectoryContext } from "./context/source-directory.js";
 import { SourceFileContext } from "./context/source-file.js";
+import { cwd } from "./host/node-host.js";
 import { Context, getContext } from "./reactivity.js";
 import { Component, Props, SourceLocation } from "./runtime/component.js";
 
@@ -125,12 +126,12 @@ function formatValue(value: unknown): string {
 }
 
 function formatSourceLocation(source: SourceLocation): string {
-  const cwd = process.cwd();
+  const currentCwd = cwd();
   let filePath = source.fileName;
 
   // Convert to relative path if under cwd
-  if (filePath.startsWith(cwd)) {
-    filePath = filePath.slice(cwd.length + 1); // +1 to remove leading slash
+  if (currentCwd && filePath.startsWith(currentCwd)) {
+    filePath = filePath.slice(currentCwd.length + 1); // +1 to remove leading slash
   }
 
   return `${filePath}:${source.lineNumber}:${source.columnNumber}`;

package/src/write-output.ts

@@ -1,5 +1,6 @@
 import { dirname, relative, resolve } from "pathe";
 import { AlloyHost } from "./host/alloy-host.js";
+import { cwd } from "./host/node-host.js";
 import { OutputDirectory } from "./render.js";
 import { traverseOutput } from "./utils.js";
 /**
@@ -17,7 +18,7 @@ export async function writeOutput(
         return;
       }
       // eslint-disable-next-line no-console
-      console.log("create", relative(process.cwd(), path));
+      console.log("create", relative(cwd(), path));
       await AlloyHost.mkdir(path);
     },
     async visitFile(file) {
@@ -25,10 +26,10 @@ export async function writeOutput(
         const path = resolve(basePath, file.path);
         if (await AlloyHost.exists(path)) {
           // eslint-disable-next-line no-console
-          console.log("overwrite", relative(process.cwd(), path));
+          console.log("overwrite", relative(cwd(), path));
         } else {
           // eslint-disable-next-line no-console
-          console.log("create", relative(process.cwd(), path));
+          console.log("create", relative(cwd(), path));
         }
 
         await AlloyHost.write(path, file.contents);
@@ -38,10 +39,10 @@ export async function writeOutput(
         const target = resolve(basePath, file.path);
         if (await AlloyHost.exists(target)) {
           // eslint-disable-next-line no-console
-          console.log("copy over", relative(process.cwd(), target));
+          console.log("copy over", relative(cwd(), target));
         } else {
           // eslint-disable-next-line no-console
-          console.log("copy", relative(process.cwd(), target));
+          console.log("copy", relative(cwd(), target));
         }
         await AlloyHost.mkdir(dirname(target));
         await AlloyHost.write(target, AlloyHost.read(source).stream());

package/test/browser-build.test.ts

@@ -1,91 +1,84 @@
-import { execSync } from "child_process";
 import { existsSync, mkdirSync, rmSync, writeFileSync } from "fs";
 import { join } from "path";
+import { build, type Rolldown } from "vite";
 import { afterAll, beforeAll, describe, expect, it } from "vitest";
 
-const testDir = join(__dirname, ".temp", "vite-test-project");
+const tempDir = join(__dirname, ".temp", "browser-build-test");
+const entryFile = join(tempDir, "entry.js");
 
-describe("Browser Build Test", () => {
-  beforeAll(() => {
-    // Cleanup previous runs
-    if (existsSync(testDir)) {
-      rmSync(testDir, { recursive: true, force: true });
-    }
+/**
+ * Bundles `@alloy-js/core` for the browser using Vite and returns
+ * the concatenated output code.
+ *
+ * Uses the `browser` export condition from the package exports map,
+ * which resolves to the compiled browser entry. This requires the
+ * package to be built first (the CI pipeline and `pnpm build` handle
+ * this automatically).
+ */
+async function bundleForBrowser(): Promise<string> {
+  const result = await build({
+    configFile: false,
+    logLevel: "silent",
+    resolve: {
+      conditions: ["browser", "import"],
+    },
+    // Disable automatic process.env replacement so we can detect leaks
+    define: {},
+    build: {
+      write: false,
+      minify: false,
+      rollupOptions: {
+        input: entryFile,
+        output: { format: "es" },
+        // Disable tree-shaking so we catch process.* references in ANY
+        // code path, even if it would be removed in a production build.
+        treeshake: false,
+        external: (id) => {
+          // Bundle @alloy-js packages — these are what we're validating
+          if (id.startsWith("@alloy-js/")) return false;
+          // Bundle relative/absolute imports (intra-package)
+          if (id.startsWith(".") || id.startsWith("/")) return false;
+          // Externalize third-party deps (vue, pathe, picocolors, …)
+          return true;
+        },
+      },
+    },
+  });
 
-    // Create a temporary Vite project
-    mkdirSync(testDir, { recursive: true });
+  const output = (
+    Array.isArray(result) ?
+      result[0]
+    : result) as Rolldown.RolldownOutput;
+  const chunks = output.output.filter(
+    (o): o is Rolldown.OutputChunk => o.type === "chunk",
+  );
+  return chunks.map((c) => c.code).join("\n");
+}
 
-    execSync("npm init -y", { cwd: testDir });
-    execSync("npm install vite", { cwd: testDir });
-    execSync("npm install ../../..", { cwd: testDir });
+describe("browser build", () => {
+  beforeAll(() => {
+    if (existsSync(tempDir)) {
+      rmSync(tempDir, { recursive: true, force: true });
+    }
+    mkdirSync(tempDir, { recursive: true });
+    writeFileSync(entryFile, 'export * from "@alloy-js/core";\n');
+  });
 
-    // Create a minimal Vite app
-    writeFileSync(
-      join(testDir, "index.js"),
-      `
-        import { writeOutput } from "@alloy-js/core";
-        console.log("Alloy-js core imported successfully!", writeOutput);
-      `,
-    );
+  afterAll(() => {
+    if (existsSync(tempDir)) {
+      rmSync(tempDir, { recursive: true, force: true });
+    }
+  });
 
-    writeFileSync(
-      join(testDir, "vite.config.js"),
-      `
-        import { defineConfig } from "vite";
-    
-        export default defineConfig({
-          build: {
-            outDir: "dist",
-            target: "esnext",
-          }
-        });
-      `,
-    );
+  it("should bundle for browser without Node.js polyfills", async () => {
+    const code = await bundleForBrowser();
 
-    // Create an index.html file
-    writeFileSync(
-      join(testDir, "index.html"),
-      `
-      <!DOCTYPE html>
-      <html lang="en">
-      <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>Vite Test</title>
-      </head>
-      <body>
-        <script type="module" src="/index.js"></script>
-      </body>
-      </html>
-      `,
-    );
+    // The browser bundle must not reference the Node.js `process` global.
+    // If this fails, a file is using process.env / process.cwd / etc.
+    // without going through host/node-host.ts (or another browser-overridden module).
+    expect(code).not.toMatch(/\bprocess\./);
 
-    writeFileSync(
-      join(testDir, "package.json"),
-      JSON.stringify(
-        {
-          type: "module",
-          scripts: {
-            build: "vite build",
-          },
-        },
-        null,
-        2,
-      ),
-    );
+    // Should not contain static require("node:…") calls
+    expect(code).not.toMatch(/require\(\s*["']node:/);
   }, 30_000);
-
-  it("Vite should build successfully", () => {
-    // Run Vite build process and wait for completion
-    expect(() => {
-      execSync("npm run build", { cwd: testDir, stdio: "inherit" });
-    }).not.toThrow();
-  }, 10000);
-
-  afterAll(() => {
-    // Ensure testDir exists before attempting to remove it
-    if (existsSync(testDir)) {
-      rmSync(testDir, { recursive: true, force: true });
-    }
-  });
 });