@sigil-dev/grimoire 0.7.6 → 0.8.0

package/test/scope.test.ts

@@ -6,17 +6,22 @@
  *   1. Effects created during a page mount stop running when the page is disposed.
  *   2. __nodes is reset to [] before each SPA navigation so the new page gets
  *      a fresh empty pool instead of recycling stale DOM nodes.
+ *
+ * await tick() must be called after all signal edits, given Bun's runner is
+ * synchronous and doesnt wait for our microtasks. In the browser the microtasks
+ * flush between event loop turns
  */
 import { describe, expect, test } from "bun:test";
 import {
 	createEffect,
 	createSignal,
 	withEffectScope as runtimeScope,
+	tick,
 } from "@sigil-dev/runtime";
 import { withEffectScope } from "../src/client/scope.ts";
 
 describe("grimoire withEffectScope", () => {
-	test("effects inside scope stop after dispose", () => {
+	test("effects inside scope stop after dispose", async () => {
 		const count = createSignal(0);
 		let runs = 0;
 		const dispose = withEffectScope(() => {
@@ -27,15 +32,16 @@ describe("grimoire withEffectScope", () => {
 		});
 
 		count.set(1);
-		expect(runs).toBe(2); // initial + one update
+		await tick(); // let microtask queue flush
+		expect(runs).toBe(2);
 
 		dispose();
-
 		count.set(2);
-		expect(runs).toBe(2); // stopped — dispose cut the subscription
+		await tick();
+		expect(runs).toBe(2);
 	});
 
-	test("simulates two page navigations — only latest page's effects run", () => {
+	test("simulates two page navigations — only latest page's effects run", async () => {
 		const count = createSignal(0);
 		let pageARuns = 0;
 		let pageBRuns = 0;
@@ -48,6 +54,7 @@ describe("grimoire withEffectScope", () => {
 			});
 		});
 		count.set(1);
+		await tick();
 		expect(pageARuns).toBe(2);
 		expect(pageBRuns).toBe(0);
 
@@ -61,17 +68,19 @@ describe("grimoire withEffectScope", () => {
 		});
 
 		count.set(2);
+		await tick();
 		expect(pageARuns).toBe(2); // A's effect is gone
 		expect(pageBRuns).toBe(2); // B initial + update
 
 		// Navigate away from B — dispose B
 		disposeCurrentPage();
 		count.set(3);
+		await tick();
 		expect(pageARuns).toBe(2);
 		expect(pageBRuns).toBe(2); // B's effect is gone too
 	});
 
-	test("three navigations: each page's effects are independent", () => {
+	test("three navigations: each page's effects are independent", async () => {
 		const signal = createSignal("a");
 		const log: string[] = [];
 
@@ -86,18 +95,21 @@ describe("grimoire withEffectScope", () => {
 		const disposeB = mountPage("B");
 
 		signal.set("b");
+		await tick();
 		expect(log).toEqual(["A:a", "B:a", "A:b", "B:b"]);
 
 		disposeA();
 		signal.set("c");
+		await tick();
 		expect(log).toEqual(["A:a", "B:a", "A:b", "B:b", "B:c"]); // only B ran
 
 		disposeB();
 		signal.set("d");
+		await tick();
 		expect(log).toEqual(["A:a", "B:a", "A:b", "B:b", "B:c"]); // neither ran
 	});
 
-	test("grimoire scope uses same globalThis channel as runtime scope", () => {
+	test("grimoire scope uses same globalThis channel as runtime scope", async () => {
 		// Both must route through the same global so that createEffect
 		// in page components (compiled by sigil, imports @sigil-dev/runtime)
 		// is captured by grimoire's router scope.
@@ -113,14 +125,16 @@ describe("grimoire withEffectScope", () => {
 		});
 
 		count.set(1);
+		await tick();
 		expect(runs).toBe(2);
 
 		dispose();
 		count.set(2);
+		await tick();
 		expect(runs).toBe(2); // runtime's createEffect was captured by grimoire's scope ✓
 	});
 
-	test("runtime's withEffectScope and grimoire's are interchangeable", () => {
+	test("runtime's withEffectScope and grimoire's are interchangeable", async () => {
 		// The runtime exports its own withEffectScope for user code.
 		// Both implementations must work the same way via the globalThis channel.
 		const count = createSignal(0);
@@ -134,9 +148,11 @@ describe("grimoire withEffectScope", () => {
 		});
 
 		count.set(1);
+		await tick();
 		expect(runs).toBe(2);
 		dispose();
 		count.set(2);
+		await tick();
 		expect(runs).toBe(2);
 	});
 });

package/test/server.test.ts

@@ -1,229 +1,249 @@
-import { afterAll, beforeAll, describe, expect, test } from "bun:test";
-import { mkdir, rm, writeFile } from "fs/promises";
-import { tmpdir } from "os";
-import { join } from "path";
-import { createServer } from "../src/server";
-
-// ── Sandbox note ─────────────────────────────────────────────────────────────
-// The sigil babel plugin unconditionally inserts `import ... from "@sigil-dev/runtime"`
-// for all non-SSR route files. When createServer() calls Bun.build to bundle hydrate.js,
-// those compiled page files pull in @sigil-dev/runtime → Bun's test sandbox blocks the
-// read of packages/runtime/index.ts.
-//
-// Consequence: createServer() integration tests can only use +server.ts API routes
-// (which are never bundled by Bun.build). Form action behavior at the HTTP level cannot
-// be tested here — it is covered at unit level by fail.test.ts and redirect-error.test.ts,
-// and at the renderer level by rendering.test.ts.
-// ─────────────────────────────────────────────────────────────────────────────
-
-let tmpDir: string;
-
-beforeAll(async () => {
-	tmpDir = join(tmpdir(), `grimoire-server-${Date.now()}`);
-	await mkdir(join(tmpDir, "api", "hello"), { recursive: true });
-	await mkdir(join(tmpDir, "api", "items"), { recursive: true });
-
-	await writeFile(
-		join(tmpDir, "api", "hello", "+server.ts"),
-		`export async function GET() { return Response.json({ message: "hello" }); }`,
-	);
-
-	await writeFile(
-		join(tmpDir, "api", "items", "+server.ts"),
-		`export async function GET() {
-			return Response.json([{ id: 1, name: "sword" }]);
-		}
-		export async function POST({ request }) {
-			const body = await request.json();
-			return Response.json({ id: 2, ...body }, { status: 201 });
-		}`,
-	);
-});
-
-describe("Server — API routes (+server.ts)", () => {
-	test("GET returns JSON", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
-		const res = await fetch("http://localhost:3004/api/hello");
-		const data = await res.json();
-		expect(data.message).toBe("hello");
-		server.stop();
-	});
-
-	test("GET on multi-method route returns correct JSON", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
-		const res = await fetch("http://localhost:3004/api/items");
-		expect(res.status).toBe(200);
-		const items = await res.json();
-		expect(items[0].name).toBe("sword");
-		server.stop();
-	});
-
-	test("POST returns 201 with created resource", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
-		const res = await fetch("http://localhost:3004/api/items", {
-			method: "POST",
-			headers: { "Content-Type": "application/json" },
-			body: JSON.stringify({ name: "shield" }),
-		});
-		expect(res.status).toBe(201);
-		const item = await res.json();
-		expect(item.name).toBe("shield");
-		server.stop();
-	});
-
-	test("unsupported method returns 405", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
-		const res = await fetch("http://localhost:3004/api/items", {
-			method: "DELETE",
-		});
-		expect(res.status).toBe(405);
-		server.stop();
-	});
-});
-
-describe("Server — WebSocket routes", () => {
-	let wsDir: string;
-	let server: Awaited<ReturnType<typeof createServer>>;
-
-	beforeAll(async () => {
-		wsDir = join(tmpdir(), `grimoire-ws-${Date.now()}`);
-		await mkdir(join(wsDir, "echo"), { recursive: true });
-		await mkdir(join(wsDir, "params", "[docId]"), { recursive: true });
-		await mkdir(join(wsDir, "reject"), { recursive: true });
-		await mkdir(join(wsDir, "mixed"), { recursive: true });
-
-		// echo: upgrade() merges extra data, message handler echoes back
-		await writeFile(
-			join(wsDir, "echo", "+server.ts"),
-			`export function upgrade({ params }) {
-  return { sessionId: "abc123" };
-}
-export const websocket = {
-  message(ws, data) { ws.send("echo:" + data); },
-};`,
-		);
-
-		// params: no upgrade(), ws.data.params still available
-		await writeFile(
-			join(wsDir, "params", "[docId]", "+server.ts"),
-			`export const websocket = {
-  open(ws) { ws.send("docId:" + ws.data.params.docId); },
-};`,
-		);
-
-		// reject: upgrade() throws → 426
-		await writeFile(
-			join(wsDir, "reject", "+server.ts"),
-			`export function upgrade() {
-  throw new Error("Unauthorized");
-}
-export const websocket = {
-  message(ws, data) { ws.send(data); },
-};`,
-		);
-
-		// mixed: HTTP GET and WebSocket both exported
-		await writeFile(
-			join(wsDir, "mixed", "+server.ts"),
-			`export function GET() {
-  return Response.json({ kind: "http" });
-}
-export function upgrade({ params }) { return {}; }
-export const websocket = {
-  message(ws, data) { ws.send(data); },
-};`,
-		);
-
-		server = await createServer({ port: 3005, routes: wsDir });
-	});
-
-	afterAll(() => {
-		server.stop();
-	});
-
-	function wsConnect(path: string): Promise<WebSocket> {
-		return new Promise((resolve, reject) => {
-			const ws = new WebSocket(`ws://localhost:3005${path}`);
-			ws.onopen = () => resolve(ws);
-			ws.onerror = () =>
-				reject(new Error(`WebSocket connection failed: ${path}`));
-		});
-	}
-
-	function nextMessage(ws: WebSocket): Promise<string> {
-		return new Promise((resolve, reject) => {
-			const timer = setTimeout(
-				() => reject(new Error("timeout waiting for message")),
-				2000,
-			);
-			ws.onmessage = (ev) => {
-				clearTimeout(timer);
-				resolve(String(ev.data));
-			};
-			ws.onerror = () => {
-				clearTimeout(timer);
-				reject(new Error("ws error"));
-			};
-		});
-	}
-
-	test("message is echoed back", async () => {
-		const ws = await wsConnect("/echo");
-		const pending = nextMessage(ws);
-		ws.send("hello");
-		expect(await pending).toBe("echo:hello");
-		ws.close();
-	});
-
-	test("upgrade() return value merges into ws.data", async () => {
-		// sessionId set in upgrade() — echo route sends it back via a second message
-		const ws = new WebSocket("ws://localhost:3005/echo");
-		// just verify connection opens cleanly (sessionId is in ws.data server-side)
-		await new Promise<void>((resolve, reject) => {
-			const t = setTimeout(() => reject(new Error("timeout")), 2000);
-			ws.onopen = () => {
-				clearTimeout(t);
-				resolve();
-			};
-			ws.onerror = () => {
-				clearTimeout(t);
-				reject(new Error("connect failed"));
-			};
-		});
-		ws.close();
-	});
-
-	test("ws.data.params available when no upgrade() export", async () => {
-		const ws = await wsConnect("/params/42");
-		expect(await nextMessage(ws)).toBe("docId:42");
-		ws.close();
-	});
-
-	test("upgrade() throwing rejects the connection", async () => {
-		await new Promise<void>((resolve, reject) => {
-			const ws = new WebSocket("ws://localhost:3005/reject");
-			const t = setTimeout(() => reject(new Error("timeout")), 2000);
-			ws.onopen = () => {
-				clearTimeout(t);
-				ws.close();
-				reject(new Error("should not have opened"));
-			};
-			ws.onerror = () => {
-				clearTimeout(t);
-				resolve();
-			};
-			ws.onclose = (ev) => {
-				clearTimeout(t);
-				if (ev.code !== 1006) resolve();
-				else resolve();
-			};
-		});
-	});
-
-	test("plain HTTP GET on mixed route still works (no Upgrade header)", async () => {
-		const res = await fetch("http://localhost:3005/mixed");
-		expect(res.status).toBe(200);
-		const body = await res.json();
-		expect(body.kind).toBe("http");
-	});
-});
+import { afterAll, beforeAll, describe, expect, test } from "bun:test";
+import { mkdir, writeFile } from "fs/promises";
+import { tmpdir } from "os";
+import { join } from "path";
+import { createServer } from "../src/server";
+
+// ── Sandbox note ─────────────────────────────────────────────────────────────
+// The Babel plugin unconditionally inserts `import ... from "@sigil-dev/runtime"`
+// for all non-SSR route files. When createServer() calls Bun.build to bundle hydrate.js,
+// those compiled page files pull in @sigil-dev/runtime → Bun's test sandbox blocks the
+// read of packages/runtime/index.ts.
+//
+// Consequence: createServer() integration tests can only use +server.ts API routes
+// (which are never bundled by Bun.build). Form action behavior at the HTTP level cannot
+// be tested here — it is covered at unit level by fail.test.ts and redirect-error.test.ts,
+// and at the renderer level by rendering.test.ts.
+// ─────────────────────────────────────────────────────────────────────────────
+
+let tmpDir: string;
+
+beforeAll(async () => {
+	tmpDir = join(tmpdir(), `grimoire-server-${Date.now()}`);
+	await mkdir(join(tmpDir, "api", "hello"), { recursive: true });
+	await mkdir(join(tmpDir, "api", "items"), { recursive: true });
+
+	await writeFile(
+		join(tmpDir, "api", "hello", "+server.ts"),
+		`export async function GET() { return Response.json({ message: "hello" }); }`,
+	);
+
+	await writeFile(
+		join(tmpDir, "api", "items", "+server.ts"),
+		`export async function GET() {
+			return Response.json([{ id: 1, name: "sword" }]);
+		}
+		export async function POST({ request }) {
+			const body = await request.json();
+			return Response.json({ id: 2, ...body }, { status: 201 });
+		}`,
+	);
+});
+
+describe("Server — API routes (+server.ts)", () => {
+	test("GET returns JSON", async () => {
+		const server = await createServer({
+			port: 3004,
+			routes: tmpDir,
+			_skipBuild: true,
+		});
+		const res = await fetch("http://localhost:3004/api/hello");
+		const data = await res.json();
+		expect(data.message).toBe("hello");
+		server.stop();
+	});
+
+	test("GET on multi-method route returns correct JSON", async () => {
+		const server = await createServer({
+			port: 3004,
+			routes: tmpDir,
+			_skipBuild: true,
+		});
+		const res = await fetch("http://localhost:3004/api/items");
+		expect(res.status).toBe(200);
+		const items = await res.json();
+		expect(items[0].name).toBe("sword");
+		server.stop();
+	});
+
+	test("POST returns 201 with created resource", async () => {
+		const server = await createServer({
+			port: 3004,
+			routes: tmpDir,
+			_skipBuild: true,
+		});
+		const res = await fetch("http://localhost:3004/api/items", {
+			method: "POST",
+			headers: { "Content-Type": "application/json" },
+			body: JSON.stringify({ name: "shield" }),
+		});
+		expect(res.status).toBe(201);
+		const item = await res.json();
+		expect(item.name).toBe("shield");
+		server.stop();
+	});
+
+	test("unsupported method returns 405", async () => {
+		const server = await createServer({
+			port: 3004,
+			routes: tmpDir,
+			_skipBuild: true,
+		});
+		const res = await fetch("http://localhost:3004/api/items", {
+			method: "DELETE",
+		});
+		expect(res.status).toBe(405);
+		server.stop();
+	});
+});
+
+describe("Server — WebSocket routes", () => {
+	let wsDir: string;
+	let server: Awaited<ReturnType<typeof createServer>>;
+
+	beforeAll(async () => {
+		wsDir = join(tmpdir(), `grimoire-ws-${Date.now()}`);
+		await mkdir(join(wsDir, "echo"), { recursive: true });
+		await mkdir(join(wsDir, "params", "[docId]"), { recursive: true });
+		await mkdir(join(wsDir, "reject"), { recursive: true });
+		await mkdir(join(wsDir, "mixed"), { recursive: true });
+
+		// echo: upgrade() merges extra data, message handler echoes back
+		await writeFile(
+			join(wsDir, "echo", "+server.ts"),
+			`export function upgrade({ params }) {
+  return { sessionId: "abc123" };
+}
+export const websocket = {
+  message(ws, data) { ws.send("echo:" + data); },
+};`,
+		);
+
+		// params: no upgrade(), ws.data.params still available
+		await writeFile(
+			join(wsDir, "params", "[docId]", "+server.ts"),
+			`export const websocket = {
+  open(ws) { ws.send("docId:" + ws.data.params.docId); },
+};`,
+		);
+
+		// reject: upgrade() throws → 426
+		await writeFile(
+			join(wsDir, "reject", "+server.ts"),
+			`export function upgrade() {
+  throw new Error("Unauthorized");
+}
+export const websocket = {
+  message(ws, data) { ws.send(data); },
+};`,
+		);
+
+		// mixed: HTTP GET and WebSocket both exported
+		await writeFile(
+			join(wsDir, "mixed", "+server.ts"),
+			`export function GET() {
+  return Response.json({ kind: "http" });
+}
+export function upgrade({ params }) { return {}; }
+export const websocket = {
+  message(ws, data) { ws.send(data); },
+};`,
+		);
+
+		server = await createServer({
+			port: 3005,
+			routes: wsDir,
+			_skipBuild: true,
+		});
+	});
+
+	afterAll(() => {
+		server.stop();
+	});
+
+	function wsConnect(path: string): Promise<WebSocket> {
+		return new Promise((resolve, reject) => {
+			const ws = new WebSocket(`ws://localhost:3005${path}`);
+			ws.onopen = () => resolve(ws);
+			ws.onerror = () =>
+				reject(new Error(`WebSocket connection failed: ${path}`));
+		});
+	}
+
+	function nextMessage(ws: WebSocket): Promise<string> {
+		return new Promise((resolve, reject) => {
+			const timer = setTimeout(
+				() => reject(new Error("timeout waiting for message")),
+				2000,
+			);
+			ws.onmessage = (ev) => {
+				clearTimeout(timer);
+				resolve(String(ev.data));
+			};
+			ws.onerror = () => {
+				clearTimeout(timer);
+				reject(new Error("ws error"));
+			};
+		});
+	}
+
+	test("message is echoed back", async () => {
+		const ws = await wsConnect("/echo");
+		const pending = nextMessage(ws);
+		ws.send("hello");
+		expect(await pending).toBe("echo:hello");
+		ws.close();
+	});
+
+	test("upgrade() return value merges into ws.data", async () => {
+		// sessionId set in upgrade() — echo route sends it back via a second message
+		const ws = new WebSocket("ws://localhost:3005/echo");
+		// just verify connection opens cleanly (sessionId is in ws.data server-side)
+		await new Promise<void>((resolve, reject) => {
+			const t = setTimeout(() => reject(new Error("timeout")), 2000);
+			ws.onopen = () => {
+				clearTimeout(t);
+				resolve();
+			};
+			ws.onerror = () => {
+				clearTimeout(t);
+				reject(new Error("connect failed"));
+			};
+		});
+		ws.close();
+	});
+
+	test("ws.data.params available when no upgrade() export", async () => {
+		const ws = await wsConnect("/params/42");
+		expect(await nextMessage(ws)).toBe("docId:42");
+		ws.close();
+	});
+
+	test("upgrade() throwing rejects the connection", async () => {
+		await new Promise<void>((resolve, reject) => {
+			const ws = new WebSocket("ws://localhost:3005/reject");
+			const t = setTimeout(() => reject(new Error("timeout")), 2000);
+			ws.onopen = () => {
+				clearTimeout(t);
+				ws.close();
+				reject(new Error("should not have opened"));
+			};
+			ws.onerror = () => {
+				clearTimeout(t);
+				resolve();
+			};
+			ws.onclose = (ev) => {
+				clearTimeout(t);
+				if (ev.code !== 1006) resolve();
+				else resolve();
+			};
+		});
+	});
+
+	test("plain HTTP GET on mixed route still works (no Upgrade header)", async () => {
+		const res = await fetch("http://localhost:3005/mixed");
+		expect(res.status).toBe(200);
+		const body = await res.json();
+		expect(body.kind).toBe("http");
+	});
+});