@sigil-dev/grimoire 0.7.5 → 0.7.7

package/test/routing.test.ts

@@ -10,6 +10,10 @@ const makeRoute = (path: string, type: RouteFile["type"]): RouteFile => ({
 		.split("/")
 		.filter((p) => p.startsWith(":"))
 		.map((p) => p.slice(1)),
+	restParamNames: path
+		.split("/")
+		.filter((p) => p.startsWith("*"))
+		.map((p) => p.slice(1)),
 });
 
 const tree: RouteTree = {
@@ -43,3 +47,35 @@ describe("matchRoute", () => {
 		expect(match).toBeNull();
 	});
 });
+
+describe("matchRoute — rest params (catch-all)", () => {
+	const restTree: RouteTree = {
+		routes: [],
+		layouts: [],
+		servers: [makeRoute("/docs/*path", "server")],
+		errors: [],
+	};
+
+	test("matches single remaining segment", () => {
+		const match = matchRoute(restTree, new URL("http://localhost/docs/abc"));
+		expect(match?.route.path).toBe("/docs/*path");
+		expect(match?.params).toEqual({ path: "abc" });
+	});
+
+	test("matches multiple remaining segments joined by /", () => {
+		const match = matchRoute(restTree, new URL("http://localhost/docs/a/b/c"));
+		expect(match?.route.path).toBe("/docs/*path");
+		expect(match?.params).toEqual({ path: "a/b/c" });
+	});
+
+	test("matches zero remaining segments as empty string", () => {
+		const match = matchRoute(restTree, new URL("http://localhost/docs/"));
+		expect(match?.route.path).toBe("/docs/*path");
+		expect(match?.params).toEqual({ path: "" });
+	});
+
+	test("does not match when prefix segments don't line up", () => {
+		const match = matchRoute(restTree, new URL("http://localhost/other/a"));
+		expect(match).toBeNull();
+	});
+});

package/test/scanning.test.ts

@@ -7,32 +7,32 @@ import { filePathToRoutePath, scanRoutes } from "../src/routing/scanner";
 describe("File scanning", () => {
 	test("index.tsx → /", () => {
 		expect(filePathToRoutePath("/app/routes/index.tsx", "/app/routes")).toEqual(
-			{ pattern: "/", params: [] },
+			{ pattern: "/", params: [], restParams: [] },
 		);
 	});
 
 	test("about.tsx → /about", () => {
 		expect(filePathToRoutePath("/app/routes/about.tsx", "/app/routes")).toEqual(
-			{ pattern: "/about", params: [] },
+			{ pattern: "/about", params: [], restParams: [] },
 		);
 	});
 
 	test("[slug].tsx → /:slug", () => {
 		expect(
 			filePathToRoutePath("/app/routes/[slug].tsx", "/app/routes"),
-		).toEqual({ pattern: "/:slug", params: ["slug"] });
+		).toEqual({ pattern: "/:slug", params: ["slug"], restParams: [] });
 	});
 
 	test("blog/+page.tsx → /blog", () => {
 		expect(
 			filePathToRoutePath("/app/routes/blog/+page.tsx", "/app/routes"),
-		).toEqual({ pattern: "/blog", params: [] });
+		).toEqual({ pattern: "/blog", params: [], restParams: [] });
 	});
 
 	test("blog/[slug]/+page.tsx → /blog/:slug", () => {
 		expect(
 			filePathToRoutePath("/app/routes/blog/[slug]/+page.tsx", "/app/routes"),
-		).toEqual({ pattern: "/blog/:slug", params: ["slug"] });
+		).toEqual({ pattern: "/blog/:slug", params: ["slug"], restParams: [] });
 	});
 
 	test("blog/[slug]/+page.server.ts → /blog/:slug", () => {
@@ -41,19 +41,34 @@ describe("File scanning", () => {
 				"/app/routes/blog/[slug]/+page.server.ts",
 				"/app/routes",
 			),
-		).toEqual({ pattern: "/blog/:slug", params: ["slug"] });
+		).toEqual({ pattern: "/blog/:slug", params: ["slug"], restParams: [] });
 	});
 
 	test("+layout.tsx → /", () => {
 		expect(
 			filePathToRoutePath("/app/routes/+layout.tsx", "/app/routes"),
-		).toEqual({ pattern: "/", params: [] });
+		).toEqual({ pattern: "/", params: [], restParams: [] });
 	});
 
 	test("nested +layout.tsx → /blog", () => {
 		expect(
 			filePathToRoutePath("/app/routes/blog/+layout.tsx", "/app/routes"),
-		).toEqual({ pattern: "/blog", params: [] });
+		).toEqual({ pattern: "/blog", params: [], restParams: [] });
+	});
+
+	test("[...rest].tsx → /*rest (catch-all)", () => {
+		expect(
+			filePathToRoutePath("/app/routes/[...rest].tsx", "/app/routes"),
+		).toEqual({ pattern: "/*rest", params: [], restParams: ["rest"] });
+	});
+
+	test("docs/[...path]/+server.ts → /docs/*path (nested catch-all)", () => {
+		expect(
+			filePathToRoutePath(
+				"/app/routes/docs/[...path]/+server.ts",
+				"/app/routes",
+			),
+		).toEqual({ pattern: "/docs/*path", params: [], restParams: ["path"] });
 	});
 
 	test("about/index.tsx, about/+page.tsx, and about.tsx all resolve to /about", () => {
@@ -88,6 +103,22 @@ describe("File scanning", () => {
 		expect(root.pattern).toBe("/");
 		expect(nested.pattern).toBe("/blog");
 	});
+
+	test("(group)/page/+page.tsx → /page", () => {
+		const { pattern } = filePathToRoutePath(
+			"/routes/(marketing)/about/+page.tsx",
+			"/routes",
+		);
+		expect(pattern).toBe("/about");
+	});
+
+	test("nested groups collapse correctly", () => {
+		const { pattern } = filePathToRoutePath(
+			"/routes/(app)/(auth)/login/+page.tsx",
+			"/routes",
+		);
+		expect(pattern).toBe("/login");
+	});
 });
 
 describe("Duplicate route detection", () => {

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,11 +1,11 @@
 import { afterAll, beforeAll, describe, expect, test } from "bun:test";
-import { mkdir, rm, writeFile } from "fs/promises";
+import { mkdir, 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"`
+// 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.
@@ -42,7 +42,11 @@ beforeAll(async () => {
 
 describe("Server — API routes (+server.ts)", () => {
 	test("GET returns JSON", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
+		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");
@@ -50,7 +54,11 @@ describe("Server — API routes (+server.ts)", () => {
 	});
 
 	test("GET on multi-method route returns correct JSON", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
+		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();
@@ -59,7 +67,11 @@ describe("Server — API routes (+server.ts)", () => {
 	});
 
 	test("POST returns 201 with created resource", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
+		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" },
@@ -72,7 +84,11 @@ describe("Server — API routes (+server.ts)", () => {
 	});
 
 	test("unsupported method returns 405", async () => {
-		const server = await createServer({ port: 3004, routes: tmpDir });
+		const server = await createServer({
+			port: 3004,
+			routes: tmpDir,
+			_skipBuild: true,
+		});
 		const res = await fetch("http://localhost:3004/api/items", {
 			method: "DELETE",
 		});
@@ -134,7 +150,11 @@ export const websocket = {
 };`,
 		);
 
-		server = await createServer({ port: 3005, routes: wsDir });
+		server = await createServer({
+			port: 3005,
+			routes: wsDir,
+			_skipBuild: true,
+		});
 	});
 
 	afterAll(() => {

package/test/streaming.test.ts

@@ -2,105 +2,124 @@ import { describe, expect, test } from "bun:test";
 import { renderRoute } from "../src/rendering";
 
 function makeMatched(path: string, filePath: string, params = {}) {
-    return {
-        route: { path, params: {}, filePath },
-        params,
-        layouts: [],
-        layoutServers: [],
-    } as any;
+	return {
+		route: { path, params: {}, filePath },
+		params,
+		layouts: [],
+		layoutServers: [],
+	} as any;
 }
 
 describe("Streaming SSR", () => {
-    test("returns a ReadableStream response", async () => {
-        const matched = makeMatched("/", "data:text/javascript,export default (p) => '<div>hello</div>'");
-        const res = await renderRoute(matched, new Request("http://localhost/"));
-        expect(res.body).toBeInstanceOf(ReadableStream);
-    });
-
-    test("stream contains full HTML document", async () => {
-        const matched = makeMatched("/test", "data:text/javascript,export default (p) => '<p>streaming works</p>'");
-
-        const res = await renderRoute(
-            matched,
-            new Request("http://localhost/test"),
-        );
-        const html = await res.text();
-
-        expect(html).toContain("<!DOCTYPE html>");
-        expect(html).toContain('<meta charset="UTF-8" />');
-        expect(html).toContain("streaming works");
-        expect(html).toContain("</html>");
-        expect(html).toContain("__grimoire_state__");
-    });
-
-    test("stream includes state JSON with route pattern", async () => {
-        const matched = makeMatched("/spells/:id", "data:text/javascript,export default (p) => '<div>spell</div>'", { id: "fireball" });
-
-        const res = await renderRoute(
-            matched,
-            new Request("http://localhost/spells/fireball"),
-        );
-        const html = await res.text();
-
-        expect(html).toContain('"pattern":"/spells/:id"');
-        expect(html).toContain('"id":"fireball"');
-    });
-
-    test("head script tag comes before head content", async () => {
-        const matched = makeMatched("/head-test", "data:text/javascript,export default (p) => '<div>head</div>'");
-
-        const res = await renderRoute(
-            matched,
-            new Request("http://localhost/head-test"),
-        );
-        const html = await res.text();
-
-        const hydrateScript = html.indexOf("hydrate.js");
-        const headClosing = html.indexOf("</head>");
-        // hydrate.js should be in <head>
-        expect(hydrateScript).toBeGreaterThan(-1);
-        expect(hydrateScript).toBeLessThan(headClosing);
-    });
-
-    test("stream chunks arrive incrementally", async () => {
-        const matched = makeMatched("/chunked", "data:text/javascript,export default (p) => '<div>chunked</div>'");
-
-        const res = await renderRoute(
-            matched,
-            new Request("http://localhost/chunked"),
-        );
-        const reader = res.body!.getReader();
-        const chunks: string[] = [];
-
-        while (true) {
-            const { done, value } = await reader.read();
-            if (done) break;
-            // Bun ReadableStream returns Uint8Array
-            chunks.push(
-                typeof value === "string"
-                    ? value
-                    : new TextDecoder().decode(value.buffer),
-            );
-        }
-
-        // Should have multiple chunks (at least DOCTYPE + body)
-        expect(chunks.length).toBeGreaterThan(1);
-        // First chunk should start with DOCTYPE
-        expect(chunks[0]).toContain("<!DOCTYPE html>");
-        // Last chunk should close the document
-        expect(chunks[chunks.length - 1]).toContain("</html>");
-    });
-
-    test("navigation request returns JSON not stream", async () => {
-        const matched = makeMatched("/nav", "data:text/javascript,export default (p) => '<div>nav</div>'");
-
-        const req = new Request("http://localhost/nav", {
-            headers: { "x-grimoire-navigate": "1" },
-        });
-        const res = await renderRoute(matched, req);
-        const json = await res.json();
-
-        expect(json.pattern).toBe("/nav");
-        expect(json.data).toBeDefined();
-    });
+	test("returns a ReadableStream response", async () => {
+		const matched = makeMatched(
+			"/",
+			"data:text/javascript,export default (p) => '<div>hello</div>'",
+		);
+		const res = await renderRoute(matched, new Request("http://localhost/"));
+		expect(res.body).toBeInstanceOf(ReadableStream);
+	});
+
+	test("stream contains full HTML document", async () => {
+		const matched = makeMatched(
+			"/test",
+			"data:text/javascript,export default (p) => '<p>streaming works</p>'",
+		);
+
+		const res = await renderRoute(
+			matched,
+			new Request("http://localhost/test"),
+		);
+		const html = await res.text();
+
+		expect(html).toContain("<!DOCTYPE html>");
+		expect(html).toContain('<meta charset="UTF-8" />');
+		expect(html).toContain("streaming works");
+		expect(html).toContain("</html>");
+		expect(html).toContain("__grimoire_state__");
+	});
+
+	test("stream includes state JSON with route pattern", async () => {
+		const matched = makeMatched(
+			"/spells/:id",
+			"data:text/javascript,export default (p) => '<div>spell</div>'",
+			{ id: "fireball" },
+		);
+
+		const res = await renderRoute(
+			matched,
+			new Request("http://localhost/spells/fireball"),
+		);
+		const html = await res.text();
+
+		expect(html).toContain('"pattern":"/spells/:id"');
+		expect(html).toContain('"id":"fireball"');
+	});
+
+	test("head script tag comes before head content", async () => {
+		const matched = makeMatched(
+			"/head-test",
+			"data:text/javascript,export default (p) => '<div>head</div>'",
+		);
+
+		const res = await renderRoute(
+			matched,
+			new Request("http://localhost/head-test"),
+		);
+		const html = await res.text();
+
+		const hydrateScript = html.indexOf("hydrate.js");
+		const headClosing = html.indexOf("</head>");
+		// hydrate.js should be in <head>
+		expect(hydrateScript).toBeGreaterThan(-1);
+		expect(hydrateScript).toBeLessThan(headClosing);
+	});
+
+	test("stream chunks arrive incrementally", async () => {
+		const matched = makeMatched(
+			"/chunked",
+			"data:text/javascript,export default (p) => '<div>chunked</div>'",
+		);
+
+		const res = await renderRoute(
+			matched,
+			new Request("http://localhost/chunked"),
+		);
+		const reader = res.body!.getReader();
+		const chunks: string[] = [];
+
+		while (true) {
+			const { done, value } = await reader.read();
+			if (done) break;
+			// Bun ReadableStream returns Uint8Array
+			chunks.push(
+				typeof value === "string"
+					? value
+					: new TextDecoder().decode(value.buffer),
+			);
+		}
+
+		// Should have multiple chunks (at least DOCTYPE + body)
+		expect(chunks.length).toBeGreaterThan(1);
+		// First chunk should start with DOCTYPE
+		expect(chunks[0]).toContain("<!DOCTYPE html>");
+		// Last chunk should close the document
+		expect(chunks[chunks.length - 1]).toContain("</html>");
+	});
+
+	test("navigation request returns JSON not stream", async () => {
+		const matched = makeMatched(
+			"/nav",
+			"data:text/javascript,export default (p) => '<div>nav</div>'",
+		);
+
+		const req = new Request("http://localhost/nav", {
+			headers: { "x-grimoire-navigate": "1" },
+		});
+		const res = await renderRoute(matched, req);
+		const json = await res.json();
+
+		expect(json.pattern).toBe("/nav");
+		expect(json.data).toBeDefined();
+	});
 });