@glasshome/widget-cli 0.8.4 → 0.10.0

package/src/preview/nix-ld.ts

@@ -0,0 +1,49 @@
+import { execFileSync } from "node:child_process";
+import { existsSync } from "node:fs";
+
+/**
+ * The Playwright-downloaded Chromium ships a glibc dynamic linker
+ * (`/lib64/ld-linux-x86-64.so.2`) and expects system libs (glib, nss, X11, …)
+ * that do not exist on NixOS, so it dies with `libglib-2.0.so.0: cannot open
+ * shared object file`. NixOS's nix-ld provides the interpreter shim via
+ * `NIX_LD`; it just needs a library search path. This harvests that path from
+ * the installed nix Chromium's runtime closure — version-independent and
+ * offline — so the downloaded browser resolves every lib.
+ *
+ * Returns the `:`-joined path (existing `NIX_LD_LIBRARY_PATH` prepended), or
+ * null when not on NixOS or no nix Chromium is installed (caller should then
+ * launch normally).
+ */
+export function nixLdLibraryPath(): string | null {
+  if (!existsSync("/etc/NIXOS")) return null;
+
+  let chromePath: string;
+  try {
+    chromePath = execFileSync("bash", ["-lc", 'readlink -f "$(command -v chromium)"'], {
+      encoding: "utf-8",
+    }).trim();
+  } catch {
+    return null;
+  }
+  if (!chromePath || !existsSync(chromePath)) return null;
+
+  let closure: string[];
+  try {
+    closure = execFileSync("nix-store", ["-qR", chromePath], { encoding: "utf-8" })
+      .split("\n")
+      .filter(Boolean);
+  } catch {
+    return null;
+  }
+
+  const dirs: string[] = [];
+  for (const p of closure) {
+    for (const sub of [`${p}/lib`, `${p}/lib64`]) {
+      if (existsSync(sub)) dirs.push(sub);
+    }
+  }
+  if (dirs.length === 0) return null;
+
+  const existing = process.env.NIX_LD_LIBRARY_PATH;
+  return existing ? `${existing}:${dirs.join(":")}` : dirs.join(":");
+}

package/src/utils/resolution.ts

@@ -0,0 +1,22 @@
+import { homedir } from "node:os";
+import { join, resolve, sep } from "node:path";
+
+/**
+ * Whether a resolved module path is bun's global install cache rather than a
+ * real install.
+ *
+ * With a package absent, bun still resolves its bare name, from
+ * `~/.bun/install/cache/typescript@7.0.2@@@1/`. Tools that shell out to what
+ * they resolved would then run a version the project never installed.
+ *
+ * Testing for a `node_modules` segment instead looks equivalent and is not: in
+ * a workspace, `@glasshome/widget-sdk` resolves through a symlink to its real
+ * source directory, which has no such segment, so that test rejects the very
+ * install it should accept and the guard silently does nothing.
+ */
+export function isBunGlobalCache(modulePath: string): boolean {
+  const cacheDir =
+    process.env.BUN_INSTALL_CACHE_DIR ??
+    join(process.env.BUN_INSTALL ?? join(homedir(), ".bun"), "install", "cache");
+  return resolve(modulePath).startsWith(resolve(cacheDir) + sep);
+}

package/src/utils/sdk-version.test.ts

@@ -0,0 +1,85 @@
+import { afterAll, describe, expect, test } from "bun:test";
+import { mkdirSync, mkdtempSync, rmSync, symlinkSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { isBunGlobalCache } from "./resolution";
+import { bareVersion, defaultSdkRange, getInstalledSdkVersion } from "./sdk-version";
+
+const tmpDir = mkdtempSync(join(tmpdir(), "glasshome-sdk-version-"));
+
+afterAll(() => {
+  rmSync(tmpDir, { recursive: true, force: true });
+});
+
+let fixtureCount = 0;
+
+/** A fake installed SDK, either under node_modules or as a workspace symlink
+    to a source tree, which is how a monorepo actually resolves it. */
+function project(opts: { version?: string; asWorkspaceLink?: boolean }): string {
+  const dir = join(tmpDir, `project-${fixtureCount++}`);
+  mkdirSync(dir, { recursive: true });
+  writeFileSync(join(dir, "package.json"), JSON.stringify({ name: "fixture" }));
+
+  if (opts.version) {
+    const target = opts.asWorkspaceLink
+      ? join(dir, "packages", "widget-sdk")
+      : join(dir, "node_modules", "@glasshome", "widget-sdk");
+    mkdirSync(target, { recursive: true });
+    writeFileSync(
+      join(target, "package.json"),
+      JSON.stringify({ name: "@glasshome/widget-sdk", version: opts.version }),
+    );
+    if (opts.asWorkspaceLink) {
+      mkdirSync(join(dir, "node_modules", "@glasshome"), { recursive: true });
+      symlinkSync(target, join(dir, "node_modules", "@glasshome", "widget-sdk"), "dir");
+    }
+  }
+  return dir;
+}
+
+describe("getInstalledSdkVersion", () => {
+  test("reads the version from a normal install", () => {
+    expect(getInstalledSdkVersion(project({ version: "1.8.1" }))).toBe("1.8.1");
+  });
+
+  test("reads it through a workspace symlink to a source tree", () => {
+    // Regression: an earlier version required a `node_modules` segment in the
+    // resolved path. A workspace symlink resolves to the SDK's real source
+    // directory, which has none, so the check returned null and every guard
+    // built on it silently did nothing in the monorepo.
+    expect(getInstalledSdkVersion(project({ version: "1.7.0", asWorkspaceLink: true }))).toBe(
+      "1.7.0",
+    );
+  });
+
+  test("returns null when no SDK is installed", () => {
+    // Must not fall back to bun's global cache copy.
+    expect(getInstalledSdkVersion(project({}))).toBeNull();
+  });
+});
+
+describe("defaultSdkRange", () => {
+  test("carets the installed version", () => {
+    expect(defaultSdkRange(project({ version: "1.8.1" }))).toBe("^1.8.1");
+  });
+
+  test("falls back to the SDK this CLI ships against", () => {
+    // No project SDK, so it must still produce a 1.x range rather than nothing:
+    // a pre-1.0 range would excuse the widget from declaring capabilities.
+    const range = defaultSdkRange(project({}));
+    expect(range).toMatch(/^\^\d+\.\d+\.\d+/);
+    expect(bareVersion(range as string).startsWith("0.")).toBe(false);
+  });
+});
+
+describe("isBunGlobalCache", () => {
+  test("recognises the cache directory", () => {
+    const cache = join(tmpDir, "cache");
+    process.env.BUN_INSTALL_CACHE_DIR = cache;
+    expect(isBunGlobalCache(join(cache, "typescript@7.0.2@@@1", "package.json"))).toBe(true);
+    expect(isBunGlobalCache(join(tmpDir, "node_modules", "typescript", "package.json"))).toBe(
+      false,
+    );
+    delete process.env.BUN_INSTALL_CACHE_DIR;
+  });
+});

package/src/utils/sdk-version.ts

@@ -0,0 +1,76 @@
+import { existsSync, readFileSync } from "node:fs";
+import { createRequire } from "node:module";
+import { join, resolve } from "node:path";
+import { isBunGlobalCache } from "./resolution";
+
+/**
+ * The SDK a widget actually builds against.
+ *
+ * `@glasshome/widget-sdk` is host-provided (`HOST_PROVIDED_MODULES`), so the
+ * build externalizes it and the published bundle runs against whatever SDK the
+ * host serves. That is why `manifest.sdkVersion` exists: it is the range the
+ * host checks before mounting. It must be derived from, and checked against,
+ * the SDK really resolved here — comparing it to the range declared in
+ * package.json only ever compares a claim with itself.
+ */
+
+const SDK_PKG = "@glasshome/widget-sdk";
+
+/**
+ * Last resort when neither the project nor this CLI can be read. Deliberately a
+ * 1.x range: anything below 1.0.0 excuses a widget from declaring capabilities,
+ * so a wrong-but-modern default fails loudly instead of silently opting out of
+ * the security contract.
+ */
+export const FALLBACK_SDK_RANGE = "^1.0.0";
+
+/**
+ * Version of the installed SDK, or null when none is installed.
+ *
+ * An ancestor's `node_modules` is fine and expected (hoisted installs put it
+ * there), as is a workspace symlink resolving to the SDK's own source tree.
+ * Bun's global install cache is not: with nothing installed it still resolves
+ * the bare name, and that is not what the build would use.
+ */
+export function getInstalledSdkVersion(cwd: string): string | null {
+  try {
+    const require = createRequire(join(cwd, "package.json"));
+    const pkgPath = resolve(require.resolve(`${SDK_PKG}/package.json`));
+    if (isBunGlobalCache(pkgPath)) return null;
+    const version = JSON.parse(readFileSync(pkgPath, "utf-8")).version;
+    return typeof version === "string" ? version : null;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * The SDK this CLI itself was built against, used when scaffolding a project
+ * that has nothing installed yet.
+ */
+export function getCliSdkVersion(): string | null {
+  try {
+    const pkgPath = resolve(import.meta.dir, "../../package.json");
+    if (!existsSync(pkgPath)) return null;
+    const pkg = JSON.parse(readFileSync(pkgPath, "utf-8"));
+    const range = pkg.dependencies?.[SDK_PKG] ?? pkg.peerDependencies?.[SDK_PKG];
+    return typeof range === "string" ? range.replace(/^[\^~]/, "") : null;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * The `^x.y.z` range to write when scaffolding: what the project has installed,
+ * else what this CLI ships against. A caret, so patch and minor SDK releases do
+ * not invalidate every published widget.
+ */
+export function defaultSdkRange(cwd?: string): string | null {
+  const version = (cwd ? getInstalledSdkVersion(cwd) : null) ?? getCliSdkVersion();
+  return version ? `^${version}` : null;
+}
+
+/** Strip a leading caret/tilde so a range can be compared as a version. */
+export function bareVersion(range: string): string {
+  return range.replace(/^[\^~]/, "");
+}

package/src/utils/typecheck.test.ts

@@ -0,0 +1,128 @@
+import { afterAll, describe, expect, test } from "bun:test";
+import { cpSync, mkdirSync, mkdtempSync, rmSync, symlinkSync, writeFileSync } from "node:fs";
+import { createRequire } from "node:module";
+import { tmpdir } from "node:os";
+import { dirname, join, sep } from "node:path";
+import { runTypecheck } from "./typecheck";
+
+// Inside the package so fixtures can resolve typescript from its node_modules,
+// which is what a hoisted or workspace install looks like.
+const tmpDir = mkdtempSync(join(import.meta.dir, ".typecheck-test-"));
+// Outside it, for the one case that must find no typescript anywhere above it.
+const isolatedDir = mkdtempSync(join(tmpdir(), "glasshome-typecheck-"));
+
+afterAll(() => {
+  rmSync(tmpDir, { recursive: true, force: true });
+  rmSync(isolatedDir, { recursive: true, force: true });
+});
+
+/**
+ * A real installed typescript to link into fixtures, or null.
+ *
+ * Resolved lazily and allowed to be absent: this package does not declare
+ * typescript, so in the monorepo it comes from the root's node_modules and in a
+ * standalone checkout there may be none at all. A hard resolve at module load
+ * would take the whole file down there. The `node_modules` check keeps bun's
+ * global-cache fallback out, which would not be a real install.
+ */
+function findTypescript(): string | null {
+  try {
+    const pkg = createRequire(import.meta.url).resolve("typescript/package.json");
+    return pkg.split(sep).includes("node_modules") ? dirname(pkg) : null;
+  } catch {
+    return null;
+  }
+}
+
+const typescriptDir = findTypescript();
+const noTypescript = typescriptDir === null;
+
+let fixtureCount = 0;
+
+interface ProjectOptions {
+  source?: string;
+  tsconfig?: boolean;
+  typescript?: boolean;
+  /** Somewhere with no node_modules above it, so nothing can be inherited. */
+  isolated?: boolean;
+}
+
+function project({
+  source,
+  tsconfig = true,
+  typescript = true,
+  isolated = false,
+}: ProjectOptions): string {
+  const dir = join(isolated ? isolatedDir : tmpDir, `project-${fixtureCount++}`);
+  mkdirSync(join(dir, "src"), { recursive: true });
+  writeFileSync(join(dir, "package.json"), JSON.stringify({ name: "fixture", type: "module" }));
+  if (tsconfig) {
+    writeFileSync(
+      join(dir, "tsconfig.json"),
+      JSON.stringify({
+        compilerOptions: {
+          strict: true,
+          noEmit: true,
+          module: "ESNext",
+          target: "ESNext",
+          moduleResolution: "bundler",
+          // Hermetic: without this tsc auto-loads every @types package it finds
+          // walking up to the monorepo root, which is both irrelevant to what
+          // is under test and slow enough to blow the test timeout.
+          types: [],
+        },
+        include: ["src"],
+      }),
+    );
+  }
+  if (typescript && typescriptDir) {
+    mkdirSync(join(dir, "node_modules"), { recursive: true });
+    symlinkSync(typescriptDir, join(dir, "node_modules", "typescript"), "dir");
+  }
+  writeFileSync(join(dir, "src", "index.ts"), source ?? "export const n: number = 1;\n");
+  return dir;
+}
+
+describe("runTypecheck", () => {
+  test.skipIf(noTypescript)("passes a project whose types are sound", () => {
+    expect(runTypecheck(project({})).status).toBe("ok");
+  });
+
+  test.skipIf(noTypescript)("fails on a type error and reports the file and message", () => {
+    const result = runTypecheck(project({ source: `export const n: number = "nope";\n` }));
+    expect(result.status).toBe("failed");
+    if (result.status !== "failed") return;
+    expect(result.output).toContain("src/index.ts");
+    expect(result.output).toContain("TS2322");
+  });
+
+  test("skips a project with no tsconfig rather than failing it", () => {
+    // A JS-only or custom-setup project is not broken, it is just not ours to check.
+    const result = runTypecheck(project({ tsconfig: false }));
+    expect(result.status).toBe("skipped");
+    if (result.status !== "skipped") return;
+    expect(result.reason).toContain("tsconfig");
+  });
+
+  test("skips when typescript is not installed in the project", () => {
+    // Load-bearing: with nothing installed, bun still resolves a bare
+    // "typescript" from its global install cache, so without the node_modules
+    // check this would silently check against whatever major is cached there.
+    const result = runTypecheck(project({ typescript: false, isolated: true }));
+    expect(result.status).toBe("skipped");
+    if (result.status !== "skipped") return;
+    expect(result.reason).toContain("not installed");
+  });
+
+  test.skipIf(noTypescript)("uses an ancestor's typescript, as hoisted and workspace installs give", () => {
+    // Requiring a copy inside the project itself would skip every monorepo.
+    const parent = project({ typescript: true });
+    const child = join(parent, "nested");
+    mkdirSync(join(child, "src"), { recursive: true });
+    cpSync(join(parent, "package.json"), join(child, "package.json"));
+    cpSync(join(parent, "tsconfig.json"), join(child, "tsconfig.json"));
+    writeFileSync(join(child, "src", "index.ts"), `export const n: number = "nope";\n`);
+
+    expect(runTypecheck(child).status).toBe("failed");
+  });
+});

package/src/utils/typecheck.ts

@@ -0,0 +1,84 @@
+import { existsSync } from "node:fs";
+import { createRequire } from "node:module";
+import { dirname, join, resolve } from "node:path";
+import { log } from "@clack/prompts";
+import { isBunGlobalCache } from "./resolution";
+
+/**
+ * Typecheck a widget project before building it.
+ *
+ * Scaffolded projects build with a bare `vite build`, which strips types without
+ * checking them, so a widget could bundle and publish with its config type and
+ * its `configSchema` disagreeing — including `examples` whose config the widget
+ * would never accept. tsc is the only thing that catches that at authoring time.
+ *
+ * Skips (loudly) rather than failing when the project has no tsconfig or no
+ * local typescript: a guard that cannot run has to say so.
+ */
+
+export type TypecheckResult =
+  | { status: "ok" }
+  | { status: "failed"; output: string }
+  | { status: "skipped"; reason: string };
+
+/**
+ * An installed typescript, never bun's global cache.
+ *
+ * Load-bearing: when a project has no typescript installed, bun still resolves
+ * the bare name, from `~/.bun/install/cache/typescript@7.0.2@@@1/`, so the CLI
+ * would silently check against whatever major happens to be cached there.
+ * Resolving to an *ancestor's* `node_modules` is fine and deliberate: hoisted
+ * and workspace installs put it there, so requiring a copy inside the project
+ * would skip every monorepo.
+ */
+function resolveTsc(cwd: string): string | null {
+  try {
+    const require = createRequire(join(cwd, "package.json"));
+    const pkg = resolve(require.resolve("typescript/package.json"));
+    if (isBunGlobalCache(pkg)) return null;
+    const bin = join(dirname(pkg), "bin", "tsc");
+    return existsSync(bin) ? bin : null;
+  } catch {
+    return null;
+  }
+}
+
+export function runTypecheck(cwd: string): TypecheckResult {
+  const tsconfig = join(cwd, "tsconfig.json");
+  if (!existsSync(tsconfig)) return { status: "skipped", reason: "no tsconfig.json" };
+
+  const tsc = resolveTsc(cwd);
+  if (!tsc) {
+    return { status: "skipped", reason: "typescript is not installed in this project" };
+  }
+
+  const proc = Bun.spawnSync([process.execPath, tsc, "--noEmit", "-p", tsconfig], {
+    cwd,
+    stdout: "pipe",
+    stderr: "pipe",
+  });
+  if (proc.exitCode === 0) return { status: "ok" };
+
+  const output = [proc.stdout.toString(), proc.stderr.toString()].join("").trim();
+  return { status: "failed", output: output || `tsc exited ${proc.exitCode}` };
+}
+
+/**
+ * Typecheck and report. Returns false when the build should stop.
+ *
+ * Blocking on purpose: a type error here means the bundle that reaches the Hub
+ * is built from code the author never checked.
+ */
+export function typecheckAndReport(cwd: string): boolean {
+  const result = runTypecheck(cwd);
+  if (result.status === "ok") return true;
+
+  if (result.status === "skipped") {
+    log.warn(`Types were NOT checked: ${result.reason}.`);
+    return true;
+  }
+
+  log.error("Typecheck failed:");
+  log.message(result.output);
+  return false;
+}

package/template/.gitignore.template

@@ -1,4 +1,6 @@
 node_modules/
 dist/
+preview/
+.glasshome-preview/
 .env
 *.local

package/template/README.md.template

@@ -18,7 +18,12 @@ bun install
 bun run build
 ```
 
-This produces `dist/{widget}.js` for each widget and generates `dist/registry.json`.
+This typechecks the project, produces `dist/{widget}.js` for each widget and
+generates `dist/registry.json`. To check types on their own:
+
+```bash
+bun run typecheck
+```
 
 ## Adding widgets
 

package/template/package.json.template

@@ -7,13 +7,14 @@
     "dist"
   ],
   "scripts": {
-    "build": "vite build",
+    "build": "tsc --noEmit && vite build",
+    "typecheck": "tsc --noEmit",
     "dev": "vite build --watch",
     "widget": "glasshome-widget"
   },
   "peerDependencies": {
     "solid-js": "^1.9.11",
-    "@glasshome/widget-sdk": "^0.2.0"
+    "@glasshome/widget-sdk": "SDK_RANGE"
   },
   "devDependencies": {
     "@glasshome/widget-cli": "CLI_VERSION",

package/template/src/index.tsx.template

@@ -31,7 +31,7 @@ export default defineWidget<WidgetConfig>({
     minSize: { w: 1, h: 1 },
     maxSize: { w: 4, h: 4 },
     defaultSize: { w: 2, h: 2 },
-    sdkVersion: "^0.2.0",
+    sdkVersion: "SDK_RANGE",
     schema: {
       type: "object",
       properties: {

package/src/commands/dev-registry.ts

@@ -1,86 +0,0 @@
-import { log, outro, spinner } from "@clack/prompts";
-import { trpcMutate, trpcQuery } from "../utils/api";
-
-interface DevStatusResponse {
-  devMode: boolean;
-  registries: Array<{ url: string; name: string; isDefault: boolean }>;
-}
-
-export async function runAddDevRegistry(options: {
-  registryUrl?: string;
-  apiUrl?: string;
-}): Promise<void> {
-  const registryUrl = options.registryUrl || "http://localhost:5173/__widgets/registry.json";
-  const apiUrl = options.apiUrl || "http://localhost:3333";
-
-  const s = spinner();
-
-  // Step 1: Check if dev mode is enabled
-  s.start("Checking dev mode status...");
-  let devEnabled = false;
-  try {
-    const status = await trpcQuery<DevStatusResponse>({
-      apiUrl,
-      path: "appConfig.get",
-    });
-    devEnabled = status.devMode;
-  } catch (err) {
-    s.stop("Failed to connect");
-    log.error(
-      `Could not reach dashboard API at ${apiUrl}: ${err instanceof Error ? err.message : String(err)}`,
-    );
-    log.info("Make sure the dashboard API server is running and the URL is correct.");
-    process.exit(1);
-  }
-
-  // Step 2: Enable dev mode if needed
-  if (!devEnabled) {
-    s.message("Enabling dev mode...");
-    try {
-      const result = await trpcMutate<{ devMode: boolean }>({
-        apiUrl,
-        path: "appConfig.toggleDevMode",
-        input: {},
-      });
-      if (!result.devMode) {
-        s.stop("Failed");
-        log.error("Could not enable dev mode");
-        process.exit(1);
-      }
-    } catch (err) {
-      s.stop("Failed");
-      log.error(`Failed to enable dev mode: ${err instanceof Error ? err.message : String(err)}`);
-      process.exit(1);
-    }
-  }
-  s.stop("Dev mode enabled");
-
-  // Step 3: Add the registry via /dev/registries endpoint
-  s.start("Adding dev registry...");
-  try {
-    const res = await fetch(`${apiUrl.replace(/\/$/, "")}/dev/registries`, {
-      method: "POST",
-      headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ url: registryUrl, name: "Local Dev Server" }),
-    });
-
-    if (res.status === 409) {
-      s.stop("Registry already registered");
-      log.info(`Registry ${registryUrl} is already configured`);
-    } else if (res.ok) {
-      s.stop("Registry added");
-      log.success(`Added registry: ${registryUrl}`);
-    } else {
-      const err = (await res.json()) as { error: string };
-      s.stop("Failed");
-      log.error(`Failed to add registry: ${err.error}`);
-      process.exit(1);
-    }
-  } catch (err) {
-    s.stop("Failed");
-    log.error(`Failed to add registry: ${err instanceof Error ? err.message : String(err)}`);
-    process.exit(1);
-  }
-
-  outro("Done! Refresh your dashboard to see dev widgets.");
-}