rwsdk 1.0.0-alpha.4 → 1.0.0-alpha.6

package/dist/runtime/lib/router.js

@@ -97,30 +97,38 @@ export function defineRoutes(routes) {
                 return undefined;
             }
             // --- Main flow ---
-            const globalMiddlewares = flattenedRoutes.filter((route) => typeof route === "function");
-            const routeDefinitions = flattenedRoutes.filter((route) => typeof route !== "function");
-            // 1. Run global middlewares
-            for (const middleware of globalMiddlewares) {
-                const result = await middleware(getRequestInfo());
-                const handled = await handleMiddlewareResult(result);
-                if (handled) {
-                    return handled;
+            let firstRouteDefinitionEncountered = false;
+            let actionHandled = false;
+            const handleAction = async () => {
+                if (!actionHandled && url.searchParams.has("__rsc_action_id")) {
+                    getRequestInfo().rw.actionResult = await rscActionHandler(request);
+                    actionHandled = true;
+                }
+            };
+            for (const route of flattenedRoutes) {
+                if (typeof route === "function") {
+                    // This is a global middleware.
+                    const result = await route(getRequestInfo());
+                    const handled = await handleMiddlewareResult(result);
+                    if (handled) {
+                        return handled; // Short-circuit
+                    }
+                    continue;
+                }
+                // This is a RouteDefinition.
+                // The first time we see one, we handle any RSC actions.
+                if (!firstRouteDefinitionEncountered) {
+                    firstRouteDefinitionEncountered = true;
+                    await handleAction();
                 }
-            }
-            // 2. Handle RSC actions
-            if (url.searchParams.has("__rsc_action_id")) {
-                getRequestInfo().rw.actionResult = await rscActionHandler(request);
-            }
-            // 3. Match and handle routes
-            for (const route of routeDefinitions) {
                 const params = matchPath(route.path, path);
                 if (!params) {
-                    continue;
+                    continue; // Not a match, keep going.
                 }
-                // Found a match: run route-specific middlewares, then the final component
+                // Found a match: run route-specific middlewares, then the final component, then stop.
                 return await runWithRequestInfoOverrides({ params }, async () => {
                     const { routeMiddlewares, componentHandler } = parseHandlers(route.handler);
-                    // 3a. Route-specific middlewares
+                    // Route-specific middlewares
                     for (const mw of routeMiddlewares) {
                         const result = await mw(getRequestInfo());
                         const handled = await handleMiddlewareResult(result);
@@ -128,7 +136,7 @@ export function defineRoutes(routes) {
                             return handled;
                         }
                     }
-                    // 3b. Final component/handler
+                    // Final component/handler
                     if (isRouteComponent(componentHandler)) {
                         const requestInfo = getRequestInfo();
                         const WrappedComponent = wrapWithLayouts(wrapHandlerToThrowResponses(componentHandler), route.layouts || [], requestInfo);
@@ -148,7 +156,11 @@ export function defineRoutes(routes) {
                     });
                 });
             }
-            // No route matched
+            // If we've gotten this far, no route was matched.
+            // We still need to handle a possible action if the app has no route definitions at all.
+            if (!firstRouteDefinitionEncountered) {
+                await handleAction();
+            }
             return new Response("Not Found", { status: 404 });
         },
     };

package/dist/runtime/lib/router.test.js

@@ -1,5 +1,6 @@
 import { describe, it, expect } from "vitest";
-import { matchPath } from "./router";
+import React from "react";
+import { matchPath, defineRoutes, route, render, layout } from "./router";
 describe("matchPath", () => {
     // Test case 1: Static paths
     it("should match static paths", () => {
@@ -56,3 +57,507 @@ describe("matchPath", () => {
         expect(() => matchPath("/type/**", "/type/a-thumb-drive")).toThrow();
     });
 });
+describe("defineRoutes - Request Handling Behavior", () => {
+    // Helper to create mock dependencies using dependency injection
+    const createMockDependencies = () => {
+        const mockRequestInfo = {
+            request: new Request("http://localhost:3000/"),
+            params: {},
+            ctx: {},
+            headers: new Headers(),
+            rw: {
+                nonce: "test-nonce",
+                Document: () => React.createElement("html"),
+                rscPayload: true,
+                ssr: true,
+                databases: new Map(),
+                scriptsToBeLoaded: new Set(),
+                pageRouteResolved: undefined,
+            },
+            cf: {},
+            response: { headers: new Headers() },
+            isAction: false,
+        };
+        const mockRenderPage = async (requestInfo, Page, onError) => {
+            return new Response(`Rendered: ${Page.name || "Component"}`, {
+                headers: { "content-type": "text/html" },
+            });
+        };
+        const mockRscActionHandler = async (request) => {
+            return { actionResult: "test-action-result" };
+        };
+        const mockRunWithRequestInfoOverrides = async (overrides, fn) => {
+            // Merge overrides into the mock request info
+            Object.assign(mockRequestInfo, overrides);
+            return await fn();
+        };
+        return {
+            mockRequestInfo,
+            mockRenderPage,
+            mockRscActionHandler,
+            mockRunWithRequestInfoOverrides,
+            getRequestInfo: () => mockRequestInfo,
+            onError: (error) => {
+                throw error;
+            },
+        };
+    };
+    describe("Sequential Route Evaluation", () => {
+        it("should process routes in the exact order they are defined", async () => {
+            const executionOrder = [];
+            const middleware1 = (requestInfo) => {
+                executionOrder.push("middleware1");
+            };
+            const middleware2 = (requestInfo) => {
+                executionOrder.push("middleware2");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                middleware1,
+                middleware2,
+                route("/test/", PageComponent),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual([
+                "middleware1",
+                "middleware2",
+                "PageComponent",
+            ]);
+        });
+    });
+    describe("Middleware Short-Circuiting", () => {
+        it("should stop processing when middleware returns a Response", async () => {
+            const executionOrder = [];
+            const middleware1 = (requestInfo) => {
+                executionOrder.push("middleware1");
+            };
+            const middleware2 = (requestInfo) => {
+                executionOrder.push("middleware2");
+                return new Response("Middleware2 Response", { status: 200 });
+            };
+            const middleware3 = (requestInfo) => {
+                executionOrder.push("middleware3");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                middleware1,
+                middleware2,
+                middleware3,
+                route("/test/", PageComponent),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["middleware1", "middleware2"]);
+            expect(await response.text()).toBe("Middleware2 Response");
+            expect(response.status).toBe(200);
+        });
+        it("should stop processing when middleware returns a JSX element", async () => {
+            const executionOrder = [];
+            const middleware1 = (requestInfo) => {
+                executionOrder.push("middleware1");
+            };
+            const middleware2 = (requestInfo) => {
+                executionOrder.push("middleware2");
+                return React.createElement("div", {}, "Middleware JSX");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                middleware1,
+                middleware2,
+                route("/test/", PageComponent),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["middleware1", "middleware2"]);
+            expect(await response.text()).toBe("Rendered: Element");
+        });
+    });
+    describe("RSC Action Handling", () => {
+        it("should handle RSC actions before the first route definition", async () => {
+            const executionOrder = [];
+            const middleware1 = (requestInfo) => {
+                executionOrder.push("middleware1");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                middleware1,
+                route("/test/", PageComponent),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            deps.mockRscActionHandler = async (request) => {
+                executionOrder.push("rscActionHandler");
+                return { actionResult: "test-result" };
+            };
+            const request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual([
+                "middleware1",
+                "rscActionHandler",
+                "PageComponent",
+            ]);
+            expect(deps.mockRequestInfo.rw.actionResult).toEqual({
+                actionResult: "test-result",
+            });
+        });
+        it("should not handle RSC actions multiple times for multiple routes", async () => {
+            const executionOrder = [];
+            const PageComponent1 = () => {
+                executionOrder.push("PageComponent1");
+                return React.createElement("div", {}, "Page1");
+            };
+            const PageComponent2 = () => {
+                executionOrder.push("PageComponent2");
+                return React.createElement("div", {}, "Page2");
+            };
+            const router = defineRoutes([
+                route("/other/", PageComponent1),
+                route("/test/", PageComponent2),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            deps.mockRscActionHandler = async (request) => {
+                executionOrder.push("rscActionHandler");
+                return { actionResult: "test-result" };
+            };
+            const request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["rscActionHandler", "PageComponent2"]);
+            // Should only call action handler once, even though there are multiple routes
+        });
+    });
+    describe("Page Route Matching and Rendering", () => {
+        it("should match the first route that matches the path", async () => {
+            const executionOrder = [];
+            const PageComponent1 = () => {
+                executionOrder.push("PageComponent1");
+                return React.createElement("div", {}, "Page1");
+            };
+            const PageComponent2 = () => {
+                executionOrder.push("PageComponent2");
+                return React.createElement("div", {}, "Page2");
+            };
+            const router = defineRoutes([
+                route("/test/", PageComponent1),
+                route("/test/", PageComponent2), // This should never be reached
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["PageComponent1"]);
+        });
+        it("should continue to next route if path does not match", async () => {
+            const executionOrder = [];
+            const PageComponent1 = () => {
+                executionOrder.push("PageComponent1");
+                return React.createElement("div", {}, "Page1");
+            };
+            const PageComponent2 = () => {
+                executionOrder.push("PageComponent2");
+                return React.createElement("div", {}, "Page2");
+            };
+            const router = defineRoutes([
+                route("/other/", PageComponent1),
+                route("/test/", PageComponent2),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["PageComponent2"]);
+        });
+        it("should return 404 when no routes match", async () => {
+            const PageComponent = () => React.createElement("div", {}, "Page");
+            const router = defineRoutes([route("/other/", PageComponent)]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(response.status).toBe(404);
+            expect(await response.text()).toBe("Not Found");
+        });
+    });
+    describe("Multiple Render Blocks with SSR Configuration", () => {
+        it("should short-circuit on first matching render block and not apply later configurations", async () => {
+            const executionOrder = [];
+            const ssrSettings = [];
+            const Document1 = () => React.createElement("html", {}, "Doc1");
+            const Document2 = () => React.createElement("html", {}, "Doc2");
+            const PageComponent1 = (requestInfo) => {
+                executionOrder.push("PageComponent1");
+                ssrSettings.push(requestInfo.rw.ssr);
+                return React.createElement("div", {}, "Page1");
+            };
+            const PageComponent2 = (requestInfo) => {
+                executionOrder.push("PageComponent2");
+                ssrSettings.push(requestInfo.rw.ssr);
+                return React.createElement("div", {}, "Page2");
+            };
+            const router = defineRoutes([
+                ...render(Document1, [route("/test/", PageComponent1)], { ssr: true }),
+                ...render(Document2, [route("/other/", PageComponent2)], {
+                    ssr: false,
+                }),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["PageComponent1"]);
+            expect(ssrSettings).toEqual([true]);
+            // The second render block's ssr: false should not have been applied
+            expect(deps.mockRequestInfo.rw.Document).toBe(Document1);
+        });
+    });
+    describe("Route-Specific Middleware", () => {
+        it("should execute route-specific middleware before the component", async () => {
+            const executionOrder = [];
+            const globalMiddleware = (requestInfo) => {
+                executionOrder.push("globalMiddleware");
+            };
+            const routeMiddleware = (requestInfo) => {
+                executionOrder.push("routeMiddleware");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                globalMiddleware,
+                route("/test/", [routeMiddleware, PageComponent]),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual([
+                "globalMiddleware",
+                "routeMiddleware",
+                "PageComponent",
+            ]);
+        });
+        it("should short-circuit if route-specific middleware returns a Response", async () => {
+            const executionOrder = [];
+            const routeMiddleware = (requestInfo) => {
+                executionOrder.push("routeMiddleware");
+                return new Response("Route Middleware Response");
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page");
+            };
+            const router = defineRoutes([
+                route("/test/", [routeMiddleware, PageComponent]),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            const request = new Request("http://localhost:3000/test/");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(executionOrder).toEqual(["routeMiddleware"]);
+            expect(await response.text()).toBe("Route Middleware Response");
+        });
+    });
+    describe("Layout Handling", () => {
+        it("should wrap components with layouts", async () => {
+            const executionOrder = [];
+            const TestLayout = ({ children }) => {
+                executionOrder.push("TestLayout");
+                return React.createElement("div", { className: "layout" }, children);
+            };
+            const PageComponent = () => {
+                executionOrder.push("PageComponent");
+                return React.createElement("div", {}, "Page Content");
+            };
+            const router = defineRoutes([
+                ...layout(TestLayout, [route("/test/", PageComponent)]),
+            ]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/");
+            // Mock renderPage to track layout wrapping
+            deps.mockRenderPage = async (requestInfo, WrappedComponent, onError) => {
+                // The component should be wrapped with layouts
+                const element = React.createElement(WrappedComponent);
+                return new Response(`Rendered with layouts`);
+            };
+            const request = new Request("http://localhost:3000/test/");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(await response.text()).toBe("Rendered with layouts");
+        });
+    });
+    describe("Parameter Extraction", () => {
+        it("should extract path parameters and make them available in request info", async () => {
+            let extractedParams = null;
+            const PageComponent = (requestInfo) => {
+                extractedParams = requestInfo.params;
+                return React.createElement("div", {}, `User: ${requestInfo.params.id}`);
+            };
+            const router = defineRoutes([route("/users/:id/", PageComponent)]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/users/123/");
+            const request = new Request("http://localhost:3000/users/123/");
+            await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(extractedParams).toEqual({ id: "123" });
+        });
+    });
+    describe("Edge Cases", () => {
+        it("should handle middleware-only apps with RSC actions", async () => {
+            const executionOrder = [];
+            const middleware1 = (requestInfo) => {
+                executionOrder.push("middleware1");
+            };
+            const middleware2 = (requestInfo) => {
+                executionOrder.push("middleware2");
+                return new Response("Middleware Response");
+            };
+            // No route definitions, only middleware
+            const router = defineRoutes([middleware1, middleware2]);
+            const deps = createMockDependencies();
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            deps.mockRscActionHandler = async (request) => {
+                executionOrder.push("rscActionHandler");
+                return { actionResult: "test-result" };
+            };
+            const request = new Request("http://localhost:3000/test/?__rsc_action_id=test");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            // Action should still be handled even with no route definitions
+            expect(executionOrder).toEqual(["middleware1", "middleware2"]);
+            expect(await response.text()).toBe("Middleware Response");
+        });
+        it("should handle trailing slash normalization", async () => {
+            const PageComponent = () => React.createElement("div", {}, "Page");
+            const router = defineRoutes([route("/test/", PageComponent)]);
+            const deps = createMockDependencies();
+            // Request without trailing slash should be normalized
+            deps.mockRequestInfo.request = new Request("http://localhost:3000/test");
+            const request = new Request("http://localhost:3000/test");
+            const response = await router.handle({
+                request,
+                renderPage: deps.mockRenderPage,
+                getRequestInfo: deps.getRequestInfo,
+                onError: deps.onError,
+                runWithRequestInfoOverrides: deps.mockRunWithRequestInfoOverrides,
+                rscActionHandler: deps.mockRscActionHandler,
+            });
+            expect(response.status).not.toBe(404);
+            expect(await response.text()).toBe("Rendered: Element");
+        });
+    });
+});

package/dist/vite/directiveModulesDevPlugin.mjs

@@ -14,7 +14,7 @@ export const generateVendorBarrelContent = (files, projectRootDir) => {
     const exports = "export default {\n" +
         [...files]
             .filter((file) => file.includes("node_modules"))
-            .map((file, i) => `  '${normalizeModulePath(file, projectRootDir).slice(1)}': M${i},`)
+            .map((file, i) => `  '${normalizeModulePath(file, projectRootDir)}': M${i},`)
             .join("\n") +
         "\n};";
     return `${imports}\n\n${exports}`;

package/dist/vite/directiveModulesDevPlugin.test.mjs

@@ -14,8 +14,8 @@ describe("directiveModulesDevPlugin helpers", () => {
 import * as M1 from '${projectRootDir}/node_modules/lib-b/component.tsx';
 
 export default {
-  'node_modules/lib-a/index.js': M0,
-  'node_modules/lib-b/component.tsx': M1,
+  '/node_modules/lib-a/index.js': M0,
+  '/node_modules/lib-b/component.tsx': M1,
 };`;
             expect(content).toEqual(expected);
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rwsdk",
-  "version": "1.0.0-alpha.4",
+  "version": "1.0.0-alpha.6",
   "description": "Build fast, server-driven webapps on Cloudflare with SSR, RSC, and realtime",
   "type": "module",
   "bin": {