feat: forward runtime context

vikejs · Aug 29, 2024 · ea4bbfd · ea4bbfd
1 parent a2171ea
commit ea4bbfd
Show file tree

Hide file tree

Showing 21 changed files with 126 additions and 92 deletions.
diff --git a/examples/hattip-app/.testRun.ts b/examples/hattip-app/.testRun.ts
@@ -2,13 +2,17 @@ import { expect, fetchHtml, getServerUrl, page, run, test } from "@brillout/test
 
 export { testRun };
 
+let isProd: boolean;
+
 function testRun(cmd: `pnpm run ${"dev" | "preview"}${string}`, options?: Parameters<typeof run>[1]) {
   run(cmd, options);
 
+  isProd = !cmd.startsWith("pnpm run dev");
+
   testUrl({
     url: "/",
     title: "My Vike App",
-    text: "Rendered to HTML",
+    text: isProd ? "SSR running on Cloudflare" : "Rendered to HTML",
     textHydration: "Rendered to HTML",
   });
 

diff --git a/examples/hattip-app/hattip-entry.ts b/examples/hattip-app/hattip-entry.ts
@@ -1,29 +1,18 @@
+import type { HattipHandler } from "@hattip/core";
+import { createRouter } from "@hattip/router";
+import { createHandler } from "@universal-middleware/hattip";
 import { createTodoHandler } from "./server/create-todo-handler";
 import { vikeHandler } from "./server/vike-handler";
-import type { HattipHandler } from "@hattip/core";
-import { createRouter, type RouteHandler } from "@hattip/router";
-
-type Middleware<Context extends Record<string | number | symbol, unknown>> = (request: Request, context: Context) => Response | void | Promise<Response> | Promise<void>
-
-function handlerAdapter<Context extends Record<string | number | symbol, unknown>>(
-  handler: Middleware<Context>,
-): RouteHandler<unknown, unknown> {
-  return (context) => {
-    const rawContext = context as unknown as Record<string, unknown>;
-    rawContext.context ??= {};
-    return handler(context.request, rawContext.context as Context);
-  };
-}
 
 const router = createRouter();
 
-router.post("/api/todo/create", handlerAdapter(createTodoHandler));
+router.post("/api/todo/create", createHandler(() => createTodoHandler)());
 
 /**
  * Vike route
  *
  * @link {@see https://vike.dev}
  **/
-router.use(handlerAdapter(vikeHandler));
+router.use(createHandler(() => vikeHandler)());
 
 export default router.buildHandler() as HattipHandler;
diff --git a/examples/hattip-app/package.json b/examples/hattip-app/package.json
@@ -17,6 +17,7 @@
     "@hattip/adapter-cloudflare-workers": "^0.0.47",
     "@hattip/adapter-node": "^0.0.47",
     "@hattip/vite": "^0.0.47",
+    "@universal-middleware/core": "^0.2.6",
     "cross-env": "^7.0.3",
     "typescript": "^5.5.4",
     "vike-cloudflare": "^0.1.0",
@@ -25,6 +26,7 @@
   "dependencies": {
     "@hattip/core": "^0.0.47",
     "@hattip/router": "^0.0.47",
+    "@universal-middleware/hattip": "^0.2.3",
     "cross-fetch": "^4.0.0",
     "hattip": "^0.0.33",
     "lowdb": "^7.0.1",

diff --git a/examples/hattip-app/pages/index/+Page.tsx b/examples/hattip-app/pages/index/+Page.tsx
@@ -1,12 +1,16 @@
+import { usePageContext } from "vike-solid/usePageContext";
 import { Counter } from "./Counter.js";
 
 export default function Page() {
+  const ctx = usePageContext();
+
   return (
     <>
       <h1>My Vike app</h1>
       This page is:
       <ul>
         <li>Rendered to HTML.</li>
+        {typeof ctx?.ctx?.waitUntil === "function" ? <li>SSR running on Cloudflare</li> : null}
         <li>
           Interactive. <Counter />
         </li>

diff --git a/examples/hattip-app/server/create-todo-handler.ts b/examples/hattip-app/server/create-todo-handler.ts
@@ -1,7 +1,6 @@
-export async function createTodoHandler<Context extends Record<string | number | symbol, unknown>>(
-  request: Request,
-  _context?: Context,
-): Promise<Response> {
+import type { UniversalHandler } from "@universal-middleware/core";
+
+export const createTodoHandler = (async (request: Request): Promise<Response> => {
   await request.json();
 
   return new Response(JSON.stringify({ status: "OK" }), {
@@ -10,4 +9,4 @@ export async function createTodoHandler<Context extends Record<string | number |
       "content-type": "application/json",
     },
   });
-}
+}) satisfies UniversalHandler;
diff --git a/examples/hattip-app/server/vike-handler.ts b/examples/hattip-app/server/vike-handler.ts
@@ -1,10 +1,8 @@
 import { renderPage } from "vike/server";
+import type { UniversalHandler } from "@universal-middleware/core";
 
-export async function vikeHandler<Context extends Record<string | number | symbol, unknown>>(
-  request: Request,
-  context?: Context,
-): Promise<Response> {
-  const pageContextInit = { ...context, urlOriginal: request.url };
+export const vikeHandler = (async (request, context, runtime): Promise<Response> => {
+  const pageContextInit = { ...context, urlOriginal: request.url, ...runtime };
   const pageContext = await renderPage(pageContextInit);
   const response = pageContext.httpResponse;
 
@@ -16,4 +14,4 @@ export async function vikeHandler<Context extends Record<string | number | symbo
     status: response?.statusCode,
     headers: response?.headers,
   });
-}
+}) satisfies UniversalHandler;
diff --git a/examples/hattip-app/tsconfig.json b/examples/hattip-app/tsconfig.json
@@ -13,7 +13,7 @@
     "moduleResolution": "Bundler",
     "target": "ES2022",
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "types": ["vite/client", "vike-solid/client"],
+    "types": ["vite/client", "vike-solid/client", "vike-cloudflare/types"],
     "jsx": "preserve",
     "jsxImportSource": "solid-js"
   },

diff --git a/examples/hono-app/.testRun.ts b/examples/hono-app/.testRun.ts
@@ -7,12 +7,12 @@ let isProd: boolean;
 function testRun(cmd: `pnpm run ${"dev" | "preview"}${string}`, options?: Parameters<typeof run>[1]) {
   run(cmd, options);
 
-  isProd = cmd !== "pnpm run dev";
+  isProd = !cmd.startsWith("pnpm run dev");
 
   testUrl({
     url: "/",
     title: "My Vike App",
-    text: "Rendered to HTML",
+    text: isProd ? "SSR running on Cloudflare" : "Rendered to HTML",
     textHydration: "Rendered to HTML",
   });
 

diff --git a/examples/hono-app/hono-entry.ts b/examples/hono-app/hono-entry.ts
@@ -1,40 +1,17 @@
+import { createHandler } from "@universal-middleware/hono";
 import { Hono } from "hono";
-import { createMiddleware } from "hono/factory";
 import { createTodoHandler } from "./server/create-todo-handler.js";
 import { vikeHandler } from "./server/vike-handler";
 
-type Middleware<Context extends Record<string | number | symbol, unknown>> = (request: Request, context: Context) => Response | void | Promise<Response> | Promise<void>
-
-export function handlerAdapter<Context extends Record<string | number | symbol, unknown>>(
-  handler: Middleware<Context>,
-) {
-  return createMiddleware(async (context, next) => {
-    let ctx = context.get("context");
-    if (!ctx) {
-      ctx = {};
-      context.set("context", ctx);
-    }
-
-    const res = await handler(context.req.raw, ctx as Context);
-    context.set("context", ctx);
-
-    if (!res) {
-      await next();
-    }
-
-    return res;
-  });
-}
-
 const app = new Hono();
 
-app.post("/api/todo/create", handlerAdapter(createTodoHandler));
+app.post("/api/todo/create", createHandler(() => createTodoHandler)());
 
 /**
  * Vike route
  *
  * @link {@see https://vike.dev}
  **/
-app.all("*", handlerAdapter(vikeHandler));
+app.all("*", createHandler(() => vikeHandler)());
 
 export default app;
diff --git a/examples/hono-app/package.json b/examples/hono-app/package.json
@@ -18,11 +18,13 @@
     "@hono/vite-cloudflare-pages": "^0.4.2",
     "@hono/vite-dev-server": "^0.14.0",
     "@types/node": "^18.19.14",
+    "@universal-middleware/core": "^0.2.6",
     "typescript": "^5.5.4",
     "vike-cloudflare": "^0.1.0",
     "wrangler": "^3.72.2"
   },
   "dependencies": {
+    "@universal-middleware/hono": "^0.2.4",
     "cross-fetch": "^4.0.0",
     "hono": "^4.5.8",
     "solid-js": "^1.8.21",

diff --git a/examples/hono-app/pages/index/+Page.tsx b/examples/hono-app/pages/index/+Page.tsx
@@ -1,12 +1,16 @@
+import { usePageContext } from "vike-solid/usePageContext";
 import { Counter } from "./Counter.js";
 
 export default function Page() {
+  const ctx = usePageContext();
+
   return (
     <>
       <h1>My Vike app</h1>
       This page is:
       <ul>
         <li>Rendered to HTML.</li>
+        {typeof ctx?.ctx?.waitUntil === "function" ? <li>SSR running on Cloudflare</li> : null}
         <li>
           Interactive. <Counter />
         </li>

diff --git a/examples/hono-app/server/create-todo-handler.ts b/examples/hono-app/server/create-todo-handler.ts
@@ -1,7 +1,6 @@
-export async function createTodoHandler<Context extends Record<string | number | symbol, unknown>>(
-  request: Request,
-  _context?: Context,
-): Promise<Response> {
+import type { UniversalHandler } from "@universal-middleware/core";
+
+export const createTodoHandler = (async (request: Request): Promise<Response> => {
   await request.json();
 
   return new Response(JSON.stringify({ status: "OK" }), {
@@ -10,4 +9,4 @@ export async function createTodoHandler<Context extends Record<string | number |
       "content-type": "application/json",
     },
   });
-}
+}) satisfies UniversalHandler;
diff --git a/examples/hono-app/server/vike-handler.ts b/examples/hono-app/server/vike-handler.ts
@@ -1,10 +1,8 @@
 import { renderPage } from "vike/server";
+import type { UniversalHandler } from "@universal-middleware/core";
 
-export async function vikeHandler<Context extends Record<string | number | symbol, unknown>>(
-  request: Request,
-  context?: Context,
-): Promise<Response> {
-  const pageContextInit = { ...context, urlOriginal: request.url };
+export const vikeHandler = (async (request, context, runtime): Promise<Response> => {
+  const pageContextInit = { ...context, urlOriginal: request.url, ...runtime };
   const pageContext = await renderPage(pageContextInit);
   const response = pageContext.httpResponse;
 
@@ -16,4 +14,4 @@ export async function vikeHandler<Context extends Record<string | number | symbo
     status: response?.statusCode,
     headers: response?.headers,
   });
-}
+}) satisfies UniversalHandler;
diff --git a/examples/hono-app/tsconfig.json b/examples/hono-app/tsconfig.json
@@ -13,7 +13,7 @@
     "moduleResolution": "Bundler",
     "target": "ES2022",
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "types": ["vite/client", "vike-solid/client"],
+    "types": ["vite/client", "vike-solid/client", "vike-cloudflare/types"],
     "jsx": "preserve",
     "jsxImportSource": "solid-js"
   },

diff --git a/examples/vike-app/.testRun.ts b/examples/vike-app/.testRun.ts
@@ -7,12 +7,12 @@ let isProd: boolean;
 function testRun(cmd: `pnpm run ${"dev" | "preview"}${string}`, options?: Parameters<typeof run>[1]) {
   run(cmd, options);
 
-  isProd = cmd !== "pnpm run dev";
+  isProd = !cmd.startsWith("pnpm run dev");
 
   testUrl({
     url: "/",
     title: "My Vike App",
-    text: "Rendered to HTML",
+    text: isProd ? "SSR running on Cloudflare" : "Rendered to HTML",
     textHydration: "Rendered to HTML",
   });
 

diff --git a/examples/vike-app/pages/index/+Page.tsx b/examples/vike-app/pages/index/+Page.tsx
@@ -1,12 +1,16 @@
+import { usePageContext } from "vike-solid/usePageContext";
 import { Counter } from "./Counter.js";
 
 export default function Page() {
+  const ctx = usePageContext();
+
   return (
     <>
       <h1>My Vike app</h1>
       This page is:
       <ul>
         <li>Rendered to HTML.</li>
+        {typeof ctx?.ctx?.waitUntil === "function" ? <li>SSR running on Cloudflare</li> : null}
         <li>
           Interactive. <Counter />
         </li>

diff --git a/examples/vike-app/tsconfig.json b/examples/vike-app/tsconfig.json
@@ -13,7 +13,7 @@
     "moduleResolution": "Bundler",
     "target": "ES2022",
     "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "types": ["vite/client", "vike-solid/client"],
+    "types": ["vite/client", "vike-solid/client", "vike-cloudflare/types"],
     "jsx": "preserve",
     "jsxImportSource": "solid-js"
   },

diff --git a/packages/vike-cloudflare/assets/vike.js b/packages/vike-cloudflare/assets/vike.js
@@ -3,37 +3,40 @@ import { renderPage } from "vike/server";
 
 /**
  * @param url {string}
+ * @param ctx {{ env: any, ctx: any }}
  * @returns {Promise<Response>}
  */
-async function handleSsr(url) {
+async function handleSsr(url, ctx) {
   const pageContextInit = {
     urlOriginal: url,
     fetch,
+    ...ctx,
   };
   const pageContext = await renderPage(pageContextInit);
   const { httpResponse } = pageContext;
   if (!httpResponse) {
     return new Response("Something went wrong", { status: 500 });
   }
-    const { statusCode: status, headers } = httpResponse;
+  const { statusCode: status, headers } = httpResponse;
 
-    const { readable, writable } = new TransformStream();
+  const { readable, writable } = new TransformStream();
 
-    httpResponse.pipe(writable);
+  httpResponse.pipe(writable);
 
-    return new Response(readable, {
-      status,
-      headers,
-    });
+  return new Response(readable, {
+    status,
+    headers,
+  });
 }
 
 export default {
   /**
    * @param request {Request}
-   * @param env {{}}
+   * @param env {any}
+   * @param ctx {any}
    * @returns {Promise<Response>}
    */
-  async fetch(request, env) {
-    return handleSsr(request.url);
+  async fetch(request, env, ctx) {
+    return handleSsr(request.url, { env, ctx });
   },
 };
diff --git a/packages/vike-cloudflare/package.json b/packages/vike-cloudflare/package.json
@@ -33,14 +33,19 @@
     "@hattip/adapter-cloudflare-workers": "^0.0.47"
   },
   "files": [
-    "dist"
+    "dist",
+    "vike.d.ts"
   ],
+  "types": "./vike.d.ts",
   "exports": {
     ".": {
       "import": "./dist/index.js",
       "node": "./dist/index.js",
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
+    },
+    "./types": {
+      "types": "./vike.d.ts"
     }
   },
   "repository": "github:vikejs/vike-cloudflare"

diff --git a/packages/vike-cloudflare/vike.d.ts b/packages/vike-cloudflare/vike.d.ts
@@ -0,0 +1,14 @@
+declare global {
+  namespace Vike {
+    interface PageContext {
+      ctx?: {
+        // biome-ignore lint/suspicious/noExplicitAny: <explanation>
+        waitUntil(promise: Promise<any>): void;
+        passThroughOnException(): void;
+      };
+      env?: Record<string | symbol | number, unknown>;
+    }
+  }
+}
+
+export type {};