@bractjs/bractjs 0.1.27 → 0.1.28

package/src/__tests__/csp.test.ts

@@ -54,6 +54,16 @@ describe("csp middleware", () => {
     expect(res.headers.get("Content-Security-Policy")).not.toContain("object-src");
   });
 
+  test("default style-src allows 'unsafe-inline'; strict drops it", async () => {
+    const def = await runCsp(csp(), () => Promise.resolve(new Response("ok")));
+    expect(def.res.headers.get("Content-Security-Policy")).toContain("style-src 'self' 'unsafe-inline'");
+
+    const strict = await runCsp(csp({ strict: true }), () => Promise.resolve(new Response("ok")));
+    const policy = strict.res.headers.get("Content-Security-Policy")!;
+    expect(policy).toContain("style-src 'self'");
+    expect(policy).not.toContain("'unsafe-inline'");
+  });
+
   test("reportOnly emits the report-only header instead", async () => {
     const { res } = await runCsp(csp({ reportOnly: true }), () => Promise.resolve(new Response("ok")));
     expect(res.headers.get("Content-Security-Policy-Report-Only")).toBeTruthy();

package/src/__tests__/define-actions.test.ts

@@ -0,0 +1,69 @@
+import { test, expect, describe, afterEach } from "bun:test";
+import { defineActions } from "../shared/define-actions.ts";
+import type { ActionArgs } from "../shared/route-types.ts";
+
+function argsWith(intent?: string, extra: Record<string, string> = {}): ActionArgs {
+  const fd = new FormData();
+  if (intent !== undefined) fd.set("intent", intent);
+  for (const [k, v] of Object.entries(extra)) fd.set(k, v);
+  return {
+    request: new Request("http://localhost/"),
+    params: {},
+    context: {},
+    search: {},
+    formData: fd,
+  };
+}
+
+const ORIGINAL_ENV = Bun.env.NODE_ENV;
+afterEach(() => {
+  if (ORIGINAL_ENV === undefined) delete Bun.env.NODE_ENV;
+  else Bun.env.NODE_ENV = ORIGINAL_ENV;
+});
+
+describe("defineActions", () => {
+  test("dispatches to the matching handler with full args", async () => {
+    let seen: ActionArgs | null = null;
+    const action = defineActions({
+      add: (args) => { seen = args; return { ok: true, who: "add" }; },
+      remove: () => ({ ok: true, who: "remove" }),
+    });
+    const result = await action(argsWith("add", { title: "x" }));
+    expect(result).toEqual({ ok: true, who: "add" });
+    expect(seen!.formData.get("title")).toBe("x");
+  });
+
+  test("unknown intent → 400 listing known intents in dev", async () => {
+    Bun.env.NODE_ENV = "development";
+    const action = defineActions({ add: () => ({}), remove: () => ({}) });
+    const res = await action(argsWith("nope"));
+    expect(res).toBeInstanceOf(Response);
+    expect((res as Response).status).toBe(400);
+    const body = await (res as Response).json() as { error: string };
+    expect(body.error).toContain("add");
+    expect(body.error).toContain("remove");
+    expect(body.error).toContain("nope");
+  });
+
+  test("unknown intent → terse 400 in production", async () => {
+    Bun.env.NODE_ENV = "production";
+    const action = defineActions({ add: () => ({}) });
+    const res = await action(argsWith("nope")) as Response;
+    expect(res.status).toBe(400);
+    const body = await res.json() as { error: string };
+    expect(body.error).toBe("Unknown action intent.");
+  });
+
+  test("missing intent → 400", async () => {
+    const action = defineActions({ add: () => ({}) });
+    const res = await action(argsWith(undefined)) as Response;
+    expect(res.status).toBe(400);
+  });
+
+  test("awaits async handlers", async () => {
+    const action = defineActions({
+      slow: async () => { await Promise.resolve(); return { done: true }; },
+    });
+    expect(await action(argsWith("slow"))).toEqual({ done: true });
+  });
+});

package/src/__tests__/env.test.ts

@@ -45,6 +45,24 @@ describe("safeStringify", () => {
     expect(parsed.self).toBe("[Circular]");
   });
 
+  // Regression: a SHARED (non-cyclic) reference must serialize normally. The
+  // old WeakSet-of-everything approach flagged the second occurrence as
+  // circular — which corrupted __BRACTJS_DATA__ whenever a loader echoed
+  // `args.search` (also present at the payload's top level).
+  test("shared references are not flagged as circular", () => {
+    const shared = { page: 5 };
+    const out = safeStringify({ a: shared, b: { inner: shared } });
+    expect(JSON.parse(out)).toEqual({ a: { page: 5 }, b: { inner: { page: 5 } } });
+  });
+
+  test("deep cycles through arrays are still caught", () => {
+    const arr: unknown[] = [];
+    const obj = { arr };
+    arr.push(obj);
+    const parsed = JSON.parse(safeStringify(obj)) as { arr: string[] };
+    expect(parsed.arr[0]).toBe("[Circular]");
+  });
+
   test("handles nested objects", () => {
     const out = safeStringify({ a: { b: { c: 42 } } });
     expect(JSON.parse(out)).toEqual({ a: { b: { c: 42 } } });

package/src/__tests__/fetcher-store.test.ts

@@ -0,0 +1,67 @@
+import { test, expect, describe } from "bun:test";
+import { fetcherStore, EMPTY_FETCHERS } from "../client/fetcher-store.ts";
+
+// The store is a module-level singleton — use unique keys per test so cases
+// stay independent.
+
+describe("fetcherStore", () => {
+  test("update creates an entry with idle defaults merged", () => {
+    fetcherStore.update("t1", { state: "submitting", formMethod: "POST" });
+    const entry = fetcherStore.get("t1");
+    expect(entry).toEqual({
+      key: "t1",
+      state: "submitting",
+      data: undefined,
+      formMethod: "POST",
+    });
+    fetcherStore.remove("t1");
+  });
+
+  test("partial updates preserve other fields", () => {
+    fetcherStore.update("t2", { state: "submitting", formMethod: "DELETE" });
+    fetcherStore.update("t2", { data: { ok: true } });
+    const entry = fetcherStore.get("t2")!;
+    expect(entry.state).toBe("submitting");
+    expect(entry.formMethod).toBe("DELETE");
+    expect(entry.data).toEqual({ ok: true });
+    fetcherStore.remove("t2");
+  });
+
+  test("subscribe fires on update and remove; unsubscribe stops it", () => {
+    let calls = 0;
+    const unsub = fetcherStore.subscribe(() => calls++);
+    fetcherStore.update("t3", { state: "loading" });
+    expect(calls).toBe(1);
+    fetcherStore.remove("t3");
+    expect(calls).toBe(2);
+    unsub();
+    fetcherStore.update("t3b", { state: "loading" });
+    expect(calls).toBe(2);
+    fetcherStore.remove("t3b");
+  });
+
+  test("removing a missing key does not notify", () => {
+    let calls = 0;
+    const unsub = fetcherStore.subscribe(() => calls++);
+    fetcherStore.remove("never-existed");
+    expect(calls).toBe(0);
+    unsub();
+  });
+
+  test("snapshot is referentially stable between updates (useSyncExternalStore contract)", () => {
+    fetcherStore.update("t4", { state: "idle" });
+    const a = fetcherStore.getSnapshot();
+    const b = fetcherStore.getSnapshot();
+    expect(a).toBe(b);
+    fetcherStore.update("t4", { state: "loading" });
+    const c = fetcherStore.getSnapshot();
+    expect(c).not.toBe(a);
+    expect(c.find((e) => e.key === "t4")?.state).toBe("loading");
+    fetcherStore.remove("t4");
+  });
+
+  test("EMPTY_FETCHERS is a stable empty server snapshot", () => {
+    expect(EMPTY_FETCHERS).toEqual([]);
+    expect(EMPTY_FETCHERS).toBe(EMPTY_FETCHERS);
+  });
+});

package/src/__tests__/fixtures/app/root.tsx

@@ -1,9 +1,14 @@
-// Minimal root component for integration tests.
+// Minimal root component for integration tests. Renders the matched route
+// through <Outlet/> so body-level SSR assertions (components, Fallbacks) work.
+import { Outlet } from "../../../client/components/Outlet.tsx";
+
 export default function Root() {
   return (
     <html>
       <head></head>
-      <body></body>
+      <body>
+        <Outlet />
+      </body>
     </html>
   );
 }

package/src/__tests__/fixtures/app/routes/boom.tsx

@@ -0,0 +1,9 @@
+// A route whose loader throws a plain Error — for asserting that the failure is
+// reported with the route file's location (in dev) rather than anonymously.
+export function loader() {
+  throw new Error("kaboom from loader");
+}
+
+export default function Boom() {
+  return <p>unreachable — loader throws</p>;
+}

package/src/__tests__/fixtures/app/routes/client-only.tsx

@@ -0,0 +1,16 @@
+// Selective SSR: `ssr: false` — the loader must NOT run during document SSR
+// and the Fallback must render in the component's place. The client completes
+// the render via /_data after hydration.
+export const ssr = false;
+
+export function loader() {
+  return { secret: "CLIENT-ONLY-LOADER-DATA" };
+}
+
+export function Fallback() {
+  return <p>client-only fallback</p>;
+}
+
+export default function ClientOnlyPage() {
+  return <p>client-only component</p>;
+}

package/src/__tests__/fixtures/app/routes/counter.tsx

@@ -0,0 +1,16 @@
+// Module-level mutable state so tests can prove the submit → revalidate
+// contract: a mutation changes what the loader returns on the next /_data.
+let count = 0;
+
+export function loader() {
+  return { count };
+}
+
+export async function action() {
+  count++;
+  return { ok: true, count };
+}
+
+export default function CounterPage() {
+  return <p>counter</p>;
+}

package/src/__tests__/fixtures/app/routes/data-only.tsx

@@ -0,0 +1,16 @@
+// Selective SSR: `ssr: "data-only"` — loaders DO run during document SSR (the
+// data ships in the bootstrap payload), but the component renders only on the
+// client; the Fallback SSRs in its place.
+export const ssr = "data-only";
+
+export function loader() {
+  return { payload: "DATA-ONLY-LOADER-DATA" };
+}
+
+export function Fallback() {
+  return <p>data-only fallback</p>;
+}
+
+export default function DataOnlyPage() {
+  return <p>data-only component</p>;
+}

package/src/__tests__/fixtures/app/routes/intent-demo.tsx

@@ -0,0 +1,46 @@
+// Exercises defineActions + <Form intent> + safeValidate end to end.
+import { defineActions, safeValidate, formText } from "../../../../index.ts";
+import { Form } from "../../../../client/components/Form.tsx";
+import type { Schema } from "../../../../server/validate.ts";
+
+const TitleSchema: Schema<{ title: string }> = {
+  safeParse(input: unknown) {
+    const t = typeof (input as { title?: unknown })?.title === "string"
+      ? ((input as { title: string }).title).trim()
+      : "";
+    return t
+      ? { success: true, data: { title: t } }
+      : { success: false, error: { issues: [{ path: ["title"], message: "Title required" }] } };
+  },
+};
+
+let count = 0;
+
+export function loader() {
+  return { count };
+}
+
+export const action = defineActions({
+  add: async ({ formData }) => {
+    const r = await safeValidate(TitleSchema, formData);
+    if (!r.ok) return { error: r.firstError };
+    count++;
+    return { ok: true, title: r.data.title, count };
+  },
+  remove: ({ formData }) => {
+    formText(formData, "id"); // exercise the helper
+    if (count > 0) count--;
+    return { ok: true, count };
+  },
+});
+
+export default function IntentDemo() {
+  return (
+    <main>
+      <Form intent="add">
+        <input name="title" />
+        <button type="submit">Add</button>
+      </Form>
+    </main>
+  );
+}

package/src/__tests__/fixtures/app/routes/protected-client-only.tsx

@@ -0,0 +1,15 @@
+// Security invariant: `ssr: false` must NOT skip beforeLoad — it is the auth
+// gate, and it runs for document GETs and /_data alike regardless of SSR mode.
+export const ssr = false;
+
+export function beforeLoad() {
+  return new Response("Forbidden", { status: 403 });
+}
+
+export function loader() {
+  return { secret: "GATED-CLIENT-ONLY-DATA" };
+}
+
+export default function ProtectedClientOnlyPage() {
+  return <p>protected client-only</p>;
+}

package/src/__tests__/fixtures/app/routes/search-demo.tsx

@@ -0,0 +1,39 @@
+import type { LoaderArgs } from "../../../../shared/route-types.ts";
+
+// Hand-rolled Zod-compatible schema (the repo has no zod dependency): coerces
+// `page` to a positive integer defaulting to 1; passes `tag` through as an
+// array. Mirrors what `z.object({ page: z.coerce.number().int().positive()
+// .default(1), tag: z.array(z.string()).optional() })` would do.
+export const searchSchema = {
+  safeParse(input: unknown) {
+    const obj = (input ?? {}) as Record<string, unknown>;
+    const issues: Array<{ path: (string | number)[]; message: string }> = [];
+
+    let page = 1;
+    if (obj.page !== undefined) {
+      const n = Number(obj.page);
+      if (!Number.isInteger(n) || n < 1) {
+        issues.push({ path: ["page"], message: "page must be a positive integer" });
+      } else {
+        page = n;
+      }
+    }
+
+    if (issues.length > 0) return { success: false, error: { issues } };
+
+    const data: Record<string, unknown> = { page };
+    if (typeof obj.tag === "string") data.tag = [obj.tag];
+    else if (Array.isArray(obj.tag)) data.tag = obj.tag;
+    return { success: true, data };
+  },
+};
+
+// Echo the validated search object so tests can assert loaders receive the
+// coerced shape, not raw strings.
+export function loader({ search }: LoaderArgs) {
+  return { receivedSearch: search };
+}
+
+export default function SearchDemoPage() {
+  return <p>search demo</p>;
+}

package/src/__tests__/form-data-helpers.test.ts

@@ -0,0 +1,43 @@
+import { test, expect, describe } from "bun:test";
+import { formText, formValues } from "../shared/form-data.ts";
+
+describe("formText", () => {
+  test("returns the string value", () => {
+    const fd = new FormData();
+    fd.set("id", "42");
+    expect(formText(fd, "id")).toBe("42");
+  });
+
+  test('returns "" for a missing key', () => {
+    expect(formText(new FormData(), "nope")).toBe("");
+  });
+
+  test('returns "" for a File value', () => {
+    const fd = new FormData();
+    fd.set("upload", new File(["x"], "a.txt"));
+    expect(formText(fd, "upload")).toBe("");
+  });
+});
+
+describe("formValues", () => {
+  test("collects all string entries (skips files)", () => {
+    const fd = new FormData();
+    fd.set("a", "1");
+    fd.set("b", "2");
+    fd.set("file", new File(["x"], "a.txt"));
+    expect(formValues(fd)).toEqual({ a: "1", b: "2" });
+  });
+
+  test("first occurrence wins for repeated keys", () => {
+    const fd = new FormData();
+    fd.append("tag", "one");
+    fd.append("tag", "two");
+    expect(formValues(fd)).toEqual({ tag: "one" });
+  });
+
+  test("named subset defaults missing keys to ''", () => {
+    const fd = new FormData();
+    fd.set("title", "Hello");
+    expect(formValues(fd, ["title", "body"])).toEqual({ title: "Hello", body: "" });
+  });
+});

package/src/__tests__/integration.test.ts

@@ -34,6 +34,16 @@ test("GET /_data?path=/ returns JSON with route key", async () => {
   expect(data).toHaveProperty("params");
 });
 
+// Regression: soft navigation reads `meta` from the /_data payload to update
+// the document head — when the payload omitted it, every soft-nav wiped the
+// title/description back to nothing.
+test("GET /_data?path=/ includes the route's merged meta", async () => {
+  const res = await fetch(`${BASE}/_data?path=/`);
+  const data = (await res.json()) as { meta?: Array<Record<string, string>> };
+  expect(Array.isArray(data.meta)).toBe(true);
+  expect(data.meta).toContainEqual({ title: "BractJS Test Home" });
+});
+
 test("POST / runs action and returns 200 HTML", async () => {
   const form = new FormData();
   form.set("name", "bract");
@@ -72,6 +82,52 @@ test("GET /nonexistent returns 404", async () => {
   expect(res.status).toBe(404);
 });
 
+// defineActions: dispatch on the form's `intent` field through one route action.
+test("defineActions dispatches POST intent=add to the right handler", async () => {
+  const form = new FormData();
+  form.set("intent", "add");
+  form.set("title", "Buy milk");
+  const res = await fetch(`${BASE}/intent-demo`, {
+    method: "POST",
+    body: form,
+    headers: { Origin: BASE, "X-BractJS-Action": "1" },
+  });
+  expect(res.status).toBe(200);
+  const data = (await res.json()) as { ok?: boolean; title?: string };
+  expect(data.ok).toBe(true);
+  expect(data.title).toBe("Buy milk");
+});
+
+test("defineActions returns 400 for an unknown intent", async () => {
+  const form = new FormData();
+  form.set("intent", "bogus");
+  const res = await fetch(`${BASE}/intent-demo`, {
+    method: "POST",
+    body: form,
+    headers: { Origin: BASE, "X-BractJS-Action": "1" },
+  });
+  expect(res.status).toBe(400);
+});
+
+// <Form intent="add"> renders the hidden input server-side (no DOM harness:
+// assert on the SSR HTML directly).
+test("<Form intent> renders the hidden intent input in SSR HTML", async () => {
+  const res = await fetch(`${BASE}/intent-demo`);
+  const html = await res.text();
+  expect(html).toContain('name="intent"');
+  expect(html).toContain('value="add"');
+});
+
+// A loader that throws is isolated into the route's __error slot (not a 500),
+// so layout/root still render. (The dev-only `routeFile` field is covered as a
+// unit in loader.test.ts; this server runs in prod mode.)
+test("a throwing loader is captured in the route slot's __error", async () => {
+  const res = await fetch(`${BASE}/_data?path=/boom`);
+  expect(res.status).toBe(200);
+  const data = (await res.json()) as { route: { __error?: { message: string } } };
+  expect(data.route.__error).toBeDefined();
+});
+
 test("HTML includes window.__BRACTJS_DATA__", async () => {
   const res = await fetch(`${BASE}/`);
   const html = await res.text();

package/src/__tests__/loader.test.ts

@@ -1,4 +1,4 @@
-import { test, expect, describe } from "bun:test";
+import { test, expect, describe, spyOn } from "bun:test";
 import { safeRun, runLoaders, buildLoaderArgs } from "../server/loader.ts";
 import { HttpError } from "../shared/errors.ts";
 import type { LoaderArgs } from "../shared/route-types.ts";
@@ -9,6 +9,7 @@ const stubArgs: LoaderArgs = {
   request: new Request("http://localhost/"),
   params: {},
   context: {},
+  search: {},
 };
 
 const emptyModule: RouteModule = {};
@@ -41,6 +42,36 @@ describe("safeRun", () => {
     const fn = async () => { throw new Response(null, { status: 302, headers: { Location: "/" } }); };
     await expect(safeRun(fn, stubArgs)).rejects.toBeInstanceOf(Response);
   });
+
+  test("includes the `where` location in the error log", async () => {
+    const spy = spyOn(console, "error").mockImplementation(() => {});
+    try {
+      await safeRun(async () => { throw new Error("boom"); }, stubArgs, undefined, "routes/x.tsx");
+      const logged = spy.mock.calls.map((c) => String(c[0])).join("\n");
+      expect(logged).toContain("loader error in routes/x.tsx");
+    } finally {
+      spy.mockRestore();
+    }
+  });
+
+  test("dev __error carries the routeFile; prod stays generic", async () => {
+    const original = Bun.env.NODE_ENV;
+    const spy = spyOn(console, "error").mockImplementation(() => {});
+    try {
+      Bun.env.NODE_ENV = "development";
+      const dev = await safeRun(async () => { throw new Error("boom"); }, stubArgs, undefined, "routes/x.tsx");
+      expect(dev).toMatchObject({ __error: { routeFile: "routes/x.tsx" } });
+
+      Bun.env.NODE_ENV = "production";
+      const prod = await safeRun(async () => { throw new Error("boom"); }, stubArgs, undefined, "routes/x.tsx") as { __error: Record<string, unknown> };
+      expect(prod.__error.routeFile).toBeUndefined();
+      expect(prod.__error.message).toBe("Internal Server Error");
+    } finally {
+      if (original === undefined) delete Bun.env.NODE_ENV;
+      else Bun.env.NODE_ENV = original;
+      spy.mockRestore();
+    }
+  });
 });
 
 describe("runLoaders", () => {

package/src/__tests__/nav-utils.test.ts

@@ -0,0 +1,46 @@
+import { test, expect, describe } from "bun:test";
+import { parseTo, createLocationKey } from "../client/nav-utils.ts";
+
+describe("parseTo", () => {
+  test("plain pathname", () => {
+    expect(parseTo("/posts")).toEqual({ pathname: "/posts", search: "", hash: "" });
+  });
+
+  test("pathname + search", () => {
+    expect(parseTo("/posts?page=2")).toEqual({ pathname: "/posts", search: "?page=2", hash: "" });
+  });
+
+  test("pathname + hash", () => {
+    expect(parseTo("/docs#install")).toEqual({ pathname: "/docs", search: "", hash: "#install" });
+  });
+
+  test("pathname + search + hash", () => {
+    expect(parseTo("/docs?v=2#install")).toEqual({ pathname: "/docs", search: "?v=2", hash: "#install" });
+  });
+
+  test("hash containing a question mark stays in the hash", () => {
+    expect(parseTo("/docs#frag?notsearch")).toEqual({ pathname: "/docs", search: "", hash: "#frag?notsearch" });
+  });
+
+  test("empty string falls back to root", () => {
+    expect(parseTo("")).toEqual({ pathname: "/", search: "", hash: "" });
+  });
+
+  test("bare query string keeps root pathname", () => {
+    expect(parseTo("?page=2")).toEqual({ pathname: "/", search: "?page=2", hash: "" });
+  });
+
+  test("root with everything", () => {
+    expect(parseTo("/?a=1&b=2#top")).toEqual({ pathname: "/", search: "?a=1&b=2", hash: "#top" });
+  });
+});
+
+describe("createLocationKey", () => {
+  test("returns a short non-empty string and varies between calls", () => {
+    const a = createLocationKey();
+    const b = createLocationKey();
+    expect(a.length).toBeGreaterThanOrEqual(6);
+    expect(a.length).toBeLessThanOrEqual(10);
+    expect(a).not.toBe(b);
+  });
+});