@reckona/mreact-router 0.0.192 → 0.0.194

package/src/render.ts

@@ -677,12 +677,13 @@ export async function renderAppRequest(options: RenderAppRequestOptions): Promis
   };
   invokeRouterInstrumentation(options.instrumentation?.onRequestStart, requestEvent);
   const response = await renderAppRequestInternal({ ...options, requestUrl: url });
+  const finalResponse = await applyAppRouterResponseHook(response, options);
   invokeRouterInstrumentation(options.instrumentation?.onRequestEnd, {
     ...requestEvent,
-    status: response.status,
+    status: finalResponse.status,
   });
 
-  return applyAppRouterResponseHook(response, options);
+  return finalResponse;
 }
 
 function createRenderTiming(logger: AppRouterLogger | undefined): RenderTiming | undefined {
@@ -1693,13 +1694,77 @@ async function applyAppRouterResponseHook(
   response: Response,
   options: RenderAppRequestOptions,
 ): Promise<Response> {
-  const hooked = await options.onResponse?.(response, {
+  const onResponse = await resolveAppRouterResponseHook(options);
+  const hooked = await onResponse?.(response, {
     request: options.request,
   });
 
   return hooked instanceof Response ? hooked : response;
 }
 
+export async function resolveAppRouterResponseHook(
+  options: Pick<
+    RenderAppRequestOptions,
+    | "appDir"
+    | "define"
+    | "devServerModuleCacheVersion"
+    | "importPolicy"
+    | "onResponse"
+    | "serverModules"
+    | "serverModuleCacheVersion"
+    | "serverSourceFiles"
+    | "vitePlugins"
+  >,
+): Promise<AppRouterResponseHook | undefined> {
+  if (options.onResponse !== undefined) {
+    return options.onResponse;
+  }
+
+  const candidates = [
+    join(options.appDir, "on-response.ts"),
+    join(options.appDir, "on-response.mreact.ts"),
+  ];
+
+  for (const file of candidates) {
+    const embedded =
+      options.serverSourceFiles?.has(file) === true || options.serverModules?.has(file) === true;
+    if (!embedded) {
+      try {
+        await access(file);
+      } catch {
+        continue;
+      }
+    }
+
+    const code = await readServerSourceFile(
+      file,
+      options.serverModuleCacheVersion,
+      options.serverSourceFiles,
+    );
+    const loaded = (await loadBundledMiddlewareModule({
+      appDir: options.appDir,
+      code,
+      define: options.define,
+      devServerModuleCacheVersion: options.devServerModuleCacheVersion,
+      file,
+      importPolicy: options.importPolicy,
+      prebuiltArtifact: prebuiltRequestModuleArtifact(options.serverModules, file, code),
+      serverModuleCacheVersion: options.serverModuleCacheVersion,
+      vitePlugins: options.vitePlugins,
+    })) as unknown as { onResponse?: unknown };
+
+    if (typeof loaded.onResponse !== "function") {
+      throw new Error(
+        `Invalid on-response convention ${file}: expected a callable onResponse export.`,
+      );
+    }
+
+    return loaded.onResponse as AppRouterResponseHook;
+  }
+
+  return undefined;
+}
+
 function withOptionalActionCookie(
   response: Response,
   csrfToken: string | undefined,

package/src/serve.ts

@@ -18,6 +18,7 @@ import {
 } from "./built-runtime.js";
 import {
   allBuiltServerModuleFiles,
+  loadBuiltResponseHookArtifacts,
   loadBuiltServerModuleArtifacts,
   loadBuiltServerModuleArtifactsForRequest,
 } from "./built-server-module-artifacts.js";
@@ -30,13 +31,18 @@ import type { AppRouterImportPolicy } from "./import-policy.js";
 import {
   preloadBuiltRequestModules,
   renderAppRequest,
+  resolveAppRouterResponseHook,
   resolveAppRouterMiddleware,
   type AppRouterServerRenderArtifactLoader,
   type AppRouterRenderPreload,
   type AppRouterResponseHook,
   type RenderAppRequestRuntimeOptions,
 } from "./render.js";
-import type { RouterInstrumentation } from "./trace.js";
+import {
+  invokeRouterInstrumentation,
+  traceContextFromRequest,
+  type RouterInstrumentation,
+} from "./trace.js";
 import {
   bytesResponse,
   htmlResponse,
@@ -234,8 +240,10 @@ export async function createBuiltRequestRuntime(
       });
     },
     async render(request, renderOptions = {}) {
+      emitBuiltRequestStart(renderOptions.instrumentation, request);
       const response = await renderBuiltAppRequestWithRuntime({
         ...renderOptions,
+        instrumentation: withoutBuiltRequestInstrumentation(renderOptions.instrumentation),
         importPolicy:
           renderOptions.importPolicy === undefined
             ? defaultImportPolicy
@@ -245,10 +253,16 @@ export async function createBuiltRequestRuntime(
         runtime,
       });
 
-      return applyBuiltAppResponseHook(response, {
-        onResponse: renderOptions.onResponse,
-        request,
-      });
+      const finalResponse = await applyBuiltAppResponseHook(
+        response,
+        {
+          onResponse: renderOptions.onResponse,
+          request,
+        },
+        runtime,
+      );
+      emitBuiltRequestEnd(renderOptions.instrumentation, request, finalResponse.status);
+      return finalResponse;
     },
   };
 }
@@ -349,6 +363,7 @@ function builtRuntimePreloadRoutes(
 export async function renderBuiltAppRequest(
   options: RenderBuiltAppRequestOptions,
 ): Promise<Response> {
+  emitBuiltRequestStart(options.instrumentation, options.request);
   const runtime = await readBuiltRuntime({
     outDir: options.outDir,
     immutable: options.immutableRuntime,
@@ -356,11 +371,54 @@ export async function renderBuiltAppRequest(
   });
   const response = await renderBuiltAppRequestWithRuntime({
     ...options,
+    instrumentation: withoutBuiltRequestInstrumentation(options.instrumentation),
     importPolicy: mergeBuiltRuntimeImportPolicy(runtime, options.importPolicy),
     runtime,
   });
 
-  return applyBuiltAppResponseHook(response, options);
+  const finalResponse = await applyBuiltAppResponseHook(response, options, runtime);
+  emitBuiltRequestEnd(options.instrumentation, options.request, finalResponse.status);
+  return finalResponse;
+}
+
+function withoutBuiltRequestInstrumentation(
+  instrumentation: RouterInstrumentation | undefined,
+): RouterInstrumentation | undefined {
+  if (instrumentation === undefined) {
+    return undefined;
+  }
+
+  const { onRequestEnd: _onRequestEnd, onRequestStart: _onRequestStart, ...remaining } =
+    instrumentation;
+  return remaining;
+}
+
+function emitBuiltRequestStart(
+  instrumentation: RouterInstrumentation | undefined,
+  request: Request,
+): void {
+  const trace = traceContextFromRequest(request);
+  invokeRouterInstrumentation(instrumentation?.onRequestStart, {
+    method: request.method,
+    path: new URL(request.url).pathname,
+    request,
+    ...(trace === undefined ? {} : { trace }),
+  });
+}
+
+function emitBuiltRequestEnd(
+  instrumentation: RouterInstrumentation | undefined,
+  request: Request,
+  status: number,
+): void {
+  const trace = traceContextFromRequest(request);
+  invokeRouterInstrumentation(instrumentation?.onRequestEnd, {
+    method: request.method,
+    path: new URL(request.url).pathname,
+    request,
+    status,
+    ...(trace === undefined ? {} : { trace }),
+  });
 }
 
 async function renderBuiltAppRequestWithRuntime(
@@ -534,8 +592,18 @@ function emitBuiltRenderTiming(
 async function applyBuiltAppResponseHook(
   response: Response,
   options: Pick<RenderBuiltAppRequestOptions, "onResponse" | "request">,
+  runtime: BuiltRuntime,
 ): Promise<Response> {
-  const hooked = await options.onResponse?.(response, {
+  await loadBuiltResponseHookArtifacts(runtime);
+  const onResponse = await resolveAppRouterResponseHook({
+    appDir: runtime.appDir,
+    importPolicy: runtime.generatedImportPolicy,
+    onResponse: options.onResponse,
+    serverModules: runtime.serverModules,
+    serverModuleCacheVersion: runtime.serverModuleCacheVersion,
+    serverSourceFiles: runtime.serverSourceFiles,
+  });
+  const hooked = await onResponse?.(response, {
     request: options.request,
   });
 
@@ -814,6 +882,7 @@ function builtRenderAppRequestOptions(
       options.runtime.serverActionManifest,
     ),
     skipMiddleware: true,
+    onResponse: () => undefined,
     ...(options.preload === undefined ? {} : { preload: options.preload }),
   };
 

package/src/vite.ts

@@ -277,6 +277,7 @@ export function createAppRouterVitePlugin(options: AppRouterVitePluginOptions):
     },
     configureServer(server) {
       server.middlewares.use(createDevCssProxyMiddleware());
+      server.middlewares.use(createClientRouteTransformMiddleware(project.routesDir, server));
 
       return () => {
         const middlewareOptions: AppRouterViteRuntimeMiddlewareOptions = {
@@ -451,6 +452,48 @@ export function prepareReactiveEffectRunDevtoolsEvent() { return undefined; }`;
   return plugin;
 }
 
+function createClientRouteTransformMiddleware(
+  appDir: string,
+  server: ViteDevServer,
+): Connect.NextHandleFunction {
+  return (request, response, next) => {
+    void (async () => {
+      const url = new URL(request.url ?? "/", "http://localhost");
+
+      if (!url.pathname.startsWith(`${clientPrefix}routes/`)) {
+        next();
+        return;
+      }
+
+      const route = await clientRouteForRequestPath(appDir, url.pathname);
+
+      if (route === undefined) {
+        next();
+        return;
+      }
+
+      try {
+        const transformed = await server.transformRequest(`${url.pathname}${url.search}`);
+
+        if (transformed === null) {
+          next();
+          return;
+        }
+
+        await sendResponse(
+          response,
+          new Response(transformed.code, {
+            headers: { "content-type": "text/javascript; charset=utf-8" },
+          }),
+        );
+      } catch (error) {
+        sendViteErrorOverlay(server, error);
+        await sendResponse(response, clientAssetBuildErrorResponse(route.file, error));
+      }
+    })().catch(next);
+  };
+}
+
 function isMreactClientSourceDependency(
   filename: string,
   normalizedSourceDirs: readonly string[],