@openparachute/hub 0.5.7 → 0.5.10-rc.10

package/src/__tests__/hub-settings.test.ts

@@ -0,0 +1,377 @@
+/**
+ * Tests for hub-local key/value settings (hub#268).
+ *
+ * Covers the bare KV API (get/set/delete) and the two domain helpers
+ * the wizard + oauth handlers consume: setup_expose_mode validation and
+ * the first-client auto-approve window (open + check + consume + clear).
+ */
+import { afterEach, beforeEach, describe, expect, test } from "bun:test";
+import { mkdtempSync, rmSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { hubDbPath, openHubDb } from "../hub-db.ts";
+import {
+  DEFAULT_MODULE_INSTALL_CHANNEL,
+  FIRST_CLIENT_AUTO_APPROVE_WINDOW_MS,
+  MODULE_INSTALL_CHANNELS,
+  PARACHUTE_MODULE_CHANNEL_ENV,
+  SETUP_EXPOSE_MODES,
+  consumeFirstClientAutoApproveWindow,
+  deleteSetting,
+  getModuleInstallChannel,
+  getSetting,
+  isFirstClientAutoApproveWindowOpen,
+  isModuleInstallChannel,
+  isSetupExposeMode,
+  openFirstClientAutoApproveWindow,
+  setModuleInstallChannel,
+  setSetting,
+} from "../hub-settings.ts";
+
+describe("hub-settings — bare KV", () => {
+  let dir: string;
+  beforeEach(() => {
+    dir = mkdtempSync(join(tmpdir(), "hub-settings-"));
+  });
+  afterEach(() => rmSync(dir, { recursive: true, force: true }));
+
+  test("getSetting returns undefined for an absent key", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      expect(getSetting(db, "setup_expose_mode")).toBeUndefined();
+    } finally {
+      db.close();
+    }
+  });
+
+  test("setSetting writes a value getSetting reads back", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      setSetting(db, "setup_expose_mode", "tailnet");
+      expect(getSetting(db, "setup_expose_mode")).toBe("tailnet");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("setSetting overwrites an existing value (UPSERT)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      setSetting(db, "setup_expose_mode", "tailnet");
+      setSetting(db, "setup_expose_mode", "public");
+      expect(getSetting(db, "setup_expose_mode")).toBe("public");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("deleteSetting removes a row + idempotently no-ops on a missing key", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      setSetting(db, "setup_expose_mode", "localhost");
+      deleteSetting(db, "setup_expose_mode");
+      expect(getSetting(db, "setup_expose_mode")).toBeUndefined();
+      // Second delete is a no-op.
+      deleteSetting(db, "setup_expose_mode");
+      expect(getSetting(db, "setup_expose_mode")).toBeUndefined();
+    } finally {
+      db.close();
+    }
+  });
+
+  test("setSetting updates the updated_at column on every write", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const t1 = new Date("2026-05-19T00:00:00.000Z");
+      const t2 = new Date("2026-05-19T00:01:00.000Z");
+      setSetting(db, "setup_expose_mode", "localhost", () => t1);
+      setSetting(db, "setup_expose_mode", "localhost", () => t2);
+      // Re-write with the same value still bumps updated_at — useful
+      // for operational polling that wants to distinguish stale vs
+      // fresh state.
+      const row = db
+        .query<{ updated_at: string }, []>(
+          "SELECT updated_at FROM hub_settings WHERE key = 'setup_expose_mode'",
+        )
+        .get();
+      expect(row?.updated_at).toBe(t2.toISOString());
+    } finally {
+      db.close();
+    }
+  });
+});
+
+describe("hub-settings — isSetupExposeMode", () => {
+  test("accepts the three canonical values", () => {
+    for (const m of SETUP_EXPOSE_MODES) {
+      expect(isSetupExposeMode(m)).toBe(true);
+    }
+  });
+
+  test("rejects anything else (typos, empty, non-string)", () => {
+    expect(isSetupExposeMode("local")).toBe(false);
+    expect(isSetupExposeMode("LOCALHOST")).toBe(false);
+    expect(isSetupExposeMode("")).toBe(false);
+    expect(isSetupExposeMode(null)).toBe(false);
+    expect(isSetupExposeMode(undefined)).toBe(false);
+    expect(isSetupExposeMode(42)).toBe(false);
+  });
+});
+
+describe("hub-settings — first-client auto-approve window", () => {
+  let dir: string;
+  beforeEach(() => {
+    dir = mkdtempSync(join(tmpdir(), "hub-settings-"));
+  });
+  afterEach(() => rmSync(dir, { recursive: true, force: true }));
+
+  test("window is closed by default (no row)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      expect(isFirstClientAutoApproveWindowOpen(db)).toBe(false);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("openFirstClientAutoApproveWindow opens a window 60 minutes long", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const now = new Date("2026-05-19T00:00:00.000Z");
+      openFirstClientAutoApproveWindow(db, () => now);
+      const stored = getSetting(db, "pending_first_client_auto_approve_until");
+      expect(stored).toBeDefined();
+      const parsed = new Date(stored ?? "");
+      expect(parsed.getTime() - now.getTime()).toBe(FIRST_CLIENT_AUTO_APPROVE_WINDOW_MS);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("isFirstClientAutoApproveWindowOpen → true within window, false after expiry", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const t0 = new Date("2026-05-19T00:00:00.000Z");
+      openFirstClientAutoApproveWindow(db, () => t0);
+      // 30 minutes in → still open.
+      expect(
+        isFirstClientAutoApproveWindowOpen(db, () => new Date(t0.getTime() + 30 * 60 * 1000)),
+      ).toBe(true);
+      // 60 minutes + 1 ms in → closed.
+      expect(
+        isFirstClientAutoApproveWindowOpen(
+          db,
+          () => new Date(t0.getTime() + FIRST_CLIENT_AUTO_APPROVE_WINDOW_MS + 1),
+        ),
+      ).toBe(false);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("consumeFirstClientAutoApproveWindow consumes the window once, then returns false", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const now = new Date("2026-05-19T00:00:00.000Z");
+      openFirstClientAutoApproveWindow(db, () => now);
+      // First call consumes.
+      expect(consumeFirstClientAutoApproveWindow(db, () => now)).toBe(true);
+      // Second call sees no window.
+      expect(consumeFirstClientAutoApproveWindow(db, () => now)).toBe(false);
+      // The row is cleared.
+      expect(getSetting(db, "pending_first_client_auto_approve_until")).toBeUndefined();
+    } finally {
+      db.close();
+    }
+  });
+
+  test("consume returns false when the window has expired (and clears nothing)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const t0 = new Date("2026-05-19T00:00:00.000Z");
+      openFirstClientAutoApproveWindow(db, () => t0);
+      const past = new Date(t0.getTime() + FIRST_CLIENT_AUTO_APPROVE_WINDOW_MS + 1);
+      expect(consumeFirstClientAutoApproveWindow(db, () => past)).toBe(false);
+      // Row is still there (no implicit cleanup on expiry — the setting
+      // just stops being "open"). A future open() resets it.
+      expect(getSetting(db, "pending_first_client_auto_approve_until")).toBeDefined();
+    } finally {
+      db.close();
+    }
+  });
+
+  test("malformed timestamp string is treated as closed (not parseable → not open)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      setSetting(db, "pending_first_client_auto_approve_until", "not-a-date");
+      expect(isFirstClientAutoApproveWindowOpen(db)).toBe(false);
+      expect(consumeFirstClientAutoApproveWindow(db)).toBe(false);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("reopening the window after consume restarts the 60-minute clock", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const t0 = new Date("2026-05-19T00:00:00.000Z");
+      openFirstClientAutoApproveWindow(db, () => t0);
+      consumeFirstClientAutoApproveWindow(db, () => t0);
+      // Re-open at t0 + 90min.
+      const t1 = new Date(t0.getTime() + 90 * 60 * 1000);
+      openFirstClientAutoApproveWindow(db, () => t1);
+      // The new window's expiry is t1 + 60min, not t0 + 60min.
+      const stored = getSetting(db, "pending_first_client_auto_approve_until");
+      const parsed = new Date(stored ?? "");
+      expect(parsed.getTime()).toBe(t1.getTime() + FIRST_CLIENT_AUTO_APPROVE_WINDOW_MS);
+    } finally {
+      db.close();
+    }
+  });
+});
+
+describe("hub-settings — isModuleInstallChannel", () => {
+  test("accepts the two canonical values", () => {
+    for (const c of MODULE_INSTALL_CHANNELS) {
+      expect(isModuleInstallChannel(c)).toBe(true);
+    }
+    expect(isModuleInstallChannel("latest")).toBe(true);
+    expect(isModuleInstallChannel("rc")).toBe(true);
+  });
+
+  test("rejects anything else (typos, empty, non-string, case-mismatch)", () => {
+    expect(isModuleInstallChannel("LATEST")).toBe(false);
+    expect(isModuleInstallChannel("Latest")).toBe(false);
+    expect(isModuleInstallChannel("stable")).toBe(false);
+    expect(isModuleInstallChannel("beta")).toBe(false);
+    expect(isModuleInstallChannel("")).toBe(false);
+    expect(isModuleInstallChannel(null)).toBe(false);
+    expect(isModuleInstallChannel(undefined)).toBe(false);
+    expect(isModuleInstallChannel(42)).toBe(false);
+  });
+});
+
+describe("hub-settings — module install channel bootstrap", () => {
+  let dir: string;
+  beforeEach(() => {
+    dir = mkdtempSync(join(tmpdir(), "hub-settings-channel-"));
+  });
+  afterEach(() => rmSync(dir, { recursive: true, force: true }));
+
+  test("first read with no env + no row seeds + returns the default (latest)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      // Empty env — no PARACHUTE_MODULE_CHANNEL.
+      const channel = getModuleInstallChannel(db, { env: {} });
+      expect(channel).toBe(DEFAULT_MODULE_INSTALL_CHANNEL);
+      expect(channel).toBe("latest");
+      // The row is now seeded.
+      expect(getSetting(db, "module_install_channel")).toBe("latest");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("first read with PARACHUTE_MODULE_CHANNEL=rc seeds with rc", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const channel = getModuleInstallChannel(db, {
+        env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "rc" },
+      });
+      expect(channel).toBe("rc");
+      expect(getSetting(db, "module_install_channel")).toBe("rc");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("first read with PARACHUTE_MODULE_CHANNEL=latest seeds with latest", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const channel = getModuleInstallChannel(db, {
+        env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "latest" },
+      });
+      expect(channel).toBe("latest");
+      expect(getSetting(db, "module_install_channel")).toBe("latest");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("invalid PARACHUTE_MODULE_CHANNEL warns + falls back to latest", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const warns: string[] = [];
+      const channel = getModuleInstallChannel(db, {
+        env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "stable" },
+        warn: (msg) => warns.push(msg),
+      });
+      expect(channel).toBe("latest");
+      expect(getSetting(db, "module_install_channel")).toBe("latest");
+      expect(warns.length).toBe(1);
+      expect(warns[0]).toMatch(/PARACHUTE_MODULE_CHANNEL="stable"/);
+      expect(warns[0]).toMatch(/not a valid channel/);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("empty PARACHUTE_MODULE_CHANNEL is treated as unset (no warn)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      const warns: string[] = [];
+      const channel = getModuleInstallChannel(db, {
+        env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "" },
+        warn: (msg) => warns.push(msg),
+      });
+      expect(channel).toBe("latest");
+      expect(warns).toEqual([]);
+    } finally {
+      db.close();
+    }
+  });
+
+  test("once seeded, env var is ignored on subsequent reads", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      // First read seeds with rc.
+      getModuleInstallChannel(db, { env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "rc" } });
+      // Second read with a different env value still returns the seeded value.
+      const channel = getModuleInstallChannel(db, {
+        env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "latest" },
+      });
+      expect(channel).toBe("rc");
+      // And with no env at all.
+      expect(getModuleInstallChannel(db, { env: {} })).toBe("rc");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("setModuleInstallChannel persists the new value, subsequent reads return it", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      // Seed with rc via env.
+      getModuleInstallChannel(db, { env: { [PARACHUTE_MODULE_CHANNEL_ENV]: "rc" } });
+      // Admin toggles to latest.
+      setModuleInstallChannel(db, "latest");
+      expect(getModuleInstallChannel(db, { env: {} })).toBe("latest");
+      // And back to rc — no env needed.
+      setModuleInstallChannel(db, "rc");
+      expect(getModuleInstallChannel(db, { env: {} })).toBe("rc");
+    } finally {
+      db.close();
+    }
+  });
+
+  test("corrupted row falls back to latest silently (no throw)", () => {
+    const db = openHubDb(hubDbPath(dir));
+    try {
+      // Simulate a manual sqlite edit / schema drift / external write.
+      setSetting(db, "module_install_channel", "bogus");
+      expect(getModuleInstallChannel(db, { env: {} })).toBe("latest");
+    } finally {
+      db.close();
+    }
+  });
+});

package/src/__tests__/hub.test.ts

@@ -13,10 +13,9 @@ describe("renderHub", () => {
     expect(html).toContain("<script>");
   });
 
-  test("fetches /.well-known/parachute.json and reads services[] + vaults[]", () => {
+  test("fetches /.well-known/parachute.json for the Use section", () => {
     expect(html).toContain("/.well-known/parachute.json");
     expect(html).toContain("doc.services");
-    expect(html).toContain("doc.vaults");
   });
 
   test("uses parachute.computer sage palette and serif/sans fonts", () => {
@@ -30,79 +29,150 @@ describe("renderHub", () => {
     expect(html).toContain("prefers-color-scheme: dark");
   });
 
-  test("falls back to a generic icon for module tiles", () => {
-    expect(html).toContain("fallbackIcon");
+  test("renders two sections: Services and Admin, each with its own heading + grid", () => {
+    expect(html).toContain('id="services-section"');
+    expect(html).toContain('id="admin-section"');
+    expect(html).toContain('id="services-grid"');
+    expect(html).toContain('id="admin-grid"');
+    expect(html).toContain("<h2>Services</h2>");
+    expect(html).toContain("<h2>Admin</h2>");
   });
 
-  test("renders one tile per module type, not per service instance", () => {
-    expect(html).toContain("aggregate(services, vaults)");
-    expect(html).toContain("renderTile");
-    expect(html).toContain("MODULE_ORDER");
+  test("Services section sub-text frames the section as service-owned surfaces", () => {
+    // Services-vs-Admin axis is OWNERSHIP (services own their UIs vs
+    // hub owns host admin), not function. The sub-text reflects that —
+    // earlier "Browse, transcribe, and run" framing put it on the
+    // function axis, which broke down once you noticed services have
+    // UIs that mix use / config / admin.
+    expect(html).toContain("Surfaces provided by services");
   });
 
-  test("known module display order is vault → scribe → notes → agent", () => {
-    expect(html).toContain("['vault', 'scribe', 'notes', 'agent']");
+  test("Services tiles are data-driven from each service's uiUrl + displayName", () => {
+    // Phase D consumer-side: SERVICE_LABELS / SERVICE_ORDER hardcoding
+    // retired. Each well-known services[] row carries displayName + uiUrl
+    // (sourced from module.json via hub-server's loadServiceUiMetadata);
+    // tiles render directly from those.
+    expect(html).toContain("svc.uiUrl");
+    expect(html).toContain("svc.displayName");
+    // No more hardcoded short→label map.
+    expect(html).not.toContain("'Notes', desc:");
+    expect(html).not.toContain("['notes', 'scribe', 'agent']");
   });
 
-  test("vault tile counts vaults[] (per instance) and links to /vault", () => {
-    // Vault count is the length of doc.vaults — one entry per /vault/<name>
-    // mount, so a single ServiceEntry with paths=[a,b,c] still shows "3
-    // registered". The manage link is the hub's vault SPA at /vault
-    // (renamed from /hub/vaults in the realignment), never an individual
-    // vault backend.
-    expect(html).toContain("vaults.length");
-    expect(html).toContain("'/vault'");
+  test("Services skip rule emerges from data, not name-checks (vault has no uiUrl)", () => {
+    // The previous `isVaultName` hardcoded skip is gone — vault doesn't
+    // declare uiUrl, so it naturally doesn't render. Other API-only
+    // modules (current or future) get the same treatment for free.
+    expect(html).toContain("if (!svc || !svc.uiUrl) continue;");
+    // The function definition is gone (the comment may still mention the
+    // name as historical context — we only care about the active code).
+    expect(html).not.toContain("function isVaultName");
   });
 
-  test("non-vault tiles take their manageUrl from the service's path", () => {
-    // shortName('parachute-scribe') = 'scribe' → tile links to svc.path,
-    // which is whatever the module declared (e.g. /scribe, /notes, /agent).
-    // Hardcoding the link would silently break on a custom mount.
-    expect(html).toContain("manageUrl: svc.path");
+  test("Services tiles sort alphabetically by displayName", () => {
+    // Per the module-json-extensibility pattern doc — default ordering
+    // until a `displayOrder` field surfaces. localeCompare keeps the
+    // ordering stable across locales for ASCII labels.
+    expect(html).toContain("a.title.localeCompare(b.title)");
   });
 
-  test("tiles for module types with zero instances are hidden", () => {
-    // Aggregate only inserts a group when the type has at least one entry;
-    // tilesInOrder iterates the map. No "0 registered" surface.
-    expect(html).not.toContain("0 registered");
-    expect(html).toContain("count === 1 ? '1 registered'");
+  test("Admin section is hardcoded (always visible) with three entries", () => {
+    expect(html).toContain("ADMIN_ENTRIES");
+    expect(html).toContain("/admin/vaults");
+    expect(html).toContain("/admin/permissions");
+    expect(html).toContain("/admin/tokens");
   });
 
-  test("module labels are humanized (Vault / Scribe / Notes / Agent)", () => {
-    expect(html).toContain("vault: 'Vault'");
-    expect(html).toContain("scribe: 'Scribe'");
-    expect(html).toContain("notes: 'Notes'");
-    expect(html).toContain("agent: 'Agent'");
+  test("Admin section renders synchronously (does not depend on the well-known fetch)", () => {
+    // Even if the fetch is slow or fails, the operator should see Admin
+    // surfaces — they may be the reason the operator landed on /.
+    expect(html).toContain("renderAdmin();");
+    expect(html).toContain("Admin section is static");
   });
 
-  test("vault-name detection covers parachute-vault and parachute-vault-<name>", () => {
-    // Phase-1 multi-vault keeps a single ServiceEntry with multiple paths
-    // (parachute-vault), but the door is open for per-instance entries
-    // (parachute-vault-techne). isVaultName has to accept both.
-    expect(html).toContain("isVaultName");
-    expect(html).toContain("'parachute-vault'");
-    expect(html).toContain("'parachute-vault-'");
+  test("Services section empty state guides operators to declare uiUrl", () => {
+    // Empty state under Phase D means "no installed service has declared
+    // uiUrl yet" — different shape from pre-D ("none installed at all").
+    // Hint points at the pattern doc since the fix is in module.json,
+    // not at install time.
+    expect(html).toContain("No services with a UI declared yet");
+    expect(html).toContain("module-json-extensibility");
   });
 
-  test("empty state when no modules are registered", () => {
-    expect(html).toContain("No modules installed yet");
-    expect(html).toContain("parachute install vault");
+  test("Use section error state surfaces the underlying message", () => {
+    expect(html).toContain("Could not load services");
   });
 
-  test("error state surfaces the underlying message", () => {
-    expect(html).toContain("Could not load modules");
+  test("discovery page fetches with cache: 'no-store' (hub#268 Item 1)", () => {
+    // Without `cache: 'no-store'` the browser's HTTP cache can return
+    // a stale services list when the operator clicks back to / after
+    // installing a module via /admin/modules. Server-side also sets
+    // cache-control: no-store on the well-known doc.
+    expect(html).toContain("cache: 'no-store'");
   });
 
-  test("does not retain the per-service interactive-card / config-form code", () => {
-    // The home page is now a directory of modules — per-instance config
-    // forms and detail panels live behind the Manage links (vault SPA at
-    // /vault, the running module's own UI elsewhere). Keeping the
-    // dead code around is a maintenance trap.
+  test("discovery page re-fetches on bfcache restore via pageshow (hub#268 Item 1)", () => {
+    // When the operator clicks back from /admin/modules to / the
+    // browser may restore the prior DOM without re-running the IIFE.
+    // The pageshow handler re-runs loadServices() when the page was
+    // restored from cache (`e.persisted === true`).
+    expect(html).toContain("addEventListener('pageshow'");
+    expect(html).toContain("e.persisted");
+  });
+
+  test("does not retain the old aggregate-by-module-type code", () => {
+    // The Vault collapse + per-module aggregation pattern is gone — Use
+    // entries are direct service-path → label lookups; Admin is hardcoded.
+    expect(html).not.toContain("aggregate(services, vaults)");
+    expect(html).not.toContain("MODULE_LABELS");
     expect(html).not.toContain("renderConfigField");
-    expect(html).not.toContain("fetchConfig");
     expect(html).not.toContain("kind-badge");
-    expect(html).not.toContain("info.mcpUrl");
-    expect(html).not.toContain("info.openInNotesUrl");
+  });
+
+  test("default render (no session) emits the 'Sign in' affordance", () => {
+    expect(html).toContain('class="auth-indicator"');
+    expect(html).toContain("Sign in");
+    expect(html).toContain('href="/login?next=/"');
+    // No POST form, no CSRF input — those only appear when signed in.
+    expect(html).not.toContain('action="/logout"');
+    expect(html).not.toContain("__csrf");
+  });
+});
+
+describe("renderHub — signed-in indicator (rc.13)", () => {
+  test("session user → 'Signed in as <name>' + inline POST form with CSRF", () => {
+    const html = renderHub({
+      session: { displayName: "aaron", csrfToken: "csrf-token-xyz" },
+    });
+    expect(html).toContain('class="auth-indicator"');
+    expect(html).toContain("Signed in as");
+    expect(html).toContain("aaron");
+    // Inline POST form for sign-out — CSRF token embedded as the
+    // existing `__csrf` field name (matches /logout's expectations).
+    expect(html).toContain('method="POST" action="/logout"');
+    expect(html).toContain('name="__csrf"');
+    expect(html).toContain('value="csrf-token-xyz"');
+    expect(html).toContain("Sign out");
+    // No "Sign in" affordance when signed in.
+    expect(html).not.toContain('href="/login?next=/"');
+  });
+
+  test("displayName with HTML special chars is escaped", () => {
+    // Username field allows alphanumerics historically, but the
+    // displayName field on the wire is forward-compatible with profile
+    // names that may contain &, <, >. Escape at render time.
+    const html = renderHub({
+      session: { displayName: "<aaron>&friends", csrfToken: "tok" },
+    });
+    expect(html).toContain("&lt;aaron&gt;&amp;friends");
+    expect(html).not.toContain("<aaron>&friends");
+  });
+
+  test("CSRF token with HTML special chars is escaped in the value attribute", () => {
+    const html = renderHub({
+      session: { displayName: "aaron", csrfToken: 'token"with"quotes' },
+    });
+    expect(html).toContain('value="token&quot;with&quot;quotes"');
   });
 });