@rangojs/router 0.0.0-experimental.15 → 0.0.0-experimental.151

package/src/router/instrument.ts

@@ -0,0 +1,355 @@
+/**
+ * Phase + event instrumentation — the single internal API for observing router
+ * work.
+ *
+ * The router exposes the same work on three surfaces, and the rule is: each
+ * surface has exactly one owner here, so they cannot drift.
+ *
+ *   - observePhase(): a span of work. Co-emits the `debugPerformance` perf
+ *     metric (metrics store -> [RSC Perf] timeline + Server-Timing) AND the
+ *     platform span (tracing runner -> Cloudflare custom spans / OTel). From one
+ *     wrap site, so the span set is always a subset of the perf phases and the
+ *     two can't disagree. Phases that meter their own perf metric with a finer
+ *     decomposition (request, middleware) pass `metric: false` and get the span
+ *     only — still co-located, still one owner per surface.
+ *   - observeEvent(): a discrete fact (TelemetrySink): cache decisions,
+ *     revalidation decisions, handler errors, timeouts, origin rejections.
+ *     Event-shaped, not phase-shaped — derived from the same call sites but a
+ *     separate surface from spans.
+ *
+ * Why phases, not events, are the parent abstraction: Cloudflare's span API is
+ * callback-bound (enterSpan wraps the actual work), so the callback boundary is
+ * the source of truth — async-context nesting (a loader's KV/D1/fetch spans
+ * landing under rango.loader) cannot be faithfully reconstructed from
+ * after-the-fact start/end events. Spans drive; events are emitted alongside.
+ *
+ * Phase identity lives in the PHASES registry below, so the raw `rango.*` span
+ * names, perf-metric labels, and span attributes have a single definition each.
+ *
+ * When neither perf surface nor tracing is active on the request, observePhase
+ * is a direct call — no wrapper, no timestamp, no allocation.
+ */
+
+import { _getRequestContext } from "../server/request-context.js";
+import { isAutoGeneratedRouteName } from "../route-name.js";
+import { getRouterContext } from "./router-context.js";
+import { resolveSink, safeEmit, type TelemetryEvent } from "./telemetry.js";
+import { appendMetric } from "./metrics.js";
+import { type MetricsStore } from "../server/context.js";
+import {
+  NOOP_TRACE_SPAN,
+  traceSpan,
+  runThenSettle,
+  type TracePhase,
+  type TraceSpan,
+} from "./tracing.js";
+
+/**
+ * Perf-metric boundary for a phase, or `false` for span-only. `false` means the
+ * caller records its own perf metric with a finer decomposition than a single
+ * wrap (request: a grand total incl. pre-context bootstrap; middleware: pre/post
+ * own-time), so observePhase opens the span but records no metric of its own.
+ */
+export type PhaseMetric =
+  | { label: string | (() => string); depth?: number }
+  | false;
+
+/** Describes one observable phase across the perf and span surfaces. */
+export interface PhaseSpec {
+  /** Perf timeline label + Server-Timing name, or false for span-only. */
+  metric: PhaseMetric;
+  /** Span phase gate (per-phase toggle in the tracing config). */
+  tracePhase: TracePhase;
+  /** Span name (rango.*). */
+  spanName: string;
+  /** Span attributes set automatically when the span opens. */
+  attributes?: Record<string, string | number | boolean>;
+  /**
+   * Span attributes resolved AFTER the wrapped work runs (so they can read state
+   * that only exists once the work is underway, e.g. the matched route name).
+   * Applied for streaming phases once fn has constructed its value. Return
+   * undefined to add nothing.
+   */
+  lazyAttributes?: () => Record<string, string | number | boolean> | undefined;
+}
+
+/**
+ * The matched route name for the current request, or undefined when there is no
+ * named route (unmatched / auto-generated). Shared by the render phase's metric
+ * label and its rango.route span attribute so the two can't disagree.
+ */
+function currentRouteName(): string | undefined {
+  const routeName = _getRequestContext()?._routeName;
+  return routeName && !isAutoGeneratedRouteName(routeName)
+    ? routeName
+    : undefined;
+}
+
+/**
+ * The router's observable phases. One definition per phase keeps the `rango.*`
+ * span names, perf-metric labels, and identifying attributes from spreading
+ * across call sites.
+ */
+export const PHASES = {
+  /** Whole request pipeline. Span only — handler:total is metered directly. */
+  request: {
+    metric: false,
+    tracePhase: "request",
+    spanName: "rango.request",
+  } as PhaseSpec,
+
+  /** One middleware (incl. its downstream onion). Span only — the perf metric
+   * is the middleware's exclusive pre/post own-time, recorded directly.
+   * `metricLabel` is that metric's label (e.g. "middleware:auth@*"); it doubles
+   * as the rango.middleware_name span attribute. */
+  middleware: (metricLabel: string): PhaseSpec => ({
+    metric: false,
+    tracePhase: "middleware",
+    spanName: "rango.middleware",
+    attributes: { "rango.middleware_name": metricLabel },
+  }),
+
+  /** The server-action execution (decode args + run the action body), before
+   * the revalidation render. The metric label carries the action id (the
+   * _rsc_action / action $$id) so the perf timeline shows WHICH action ran, not
+   * just "an action"; the span also gets it as rango.action_id. */
+  action: (id: string): PhaseSpec => ({
+    metric: { label: `action:${id}` },
+    tracePhase: "action",
+    spanName: "rango.action",
+    attributes: { "rango.action_id": id },
+  }),
+
+  /**
+   * One loader execution. `depth` is the perf-timeline indentation: 2 (default)
+   * for render-time loaders that nest under the render phase; 1 for a standalone
+   * fetchable `_rsc_loader` request, which has no render parent.
+   */
+  loader: (id: string, depth: number = 2): PhaseSpec => ({
+    metric: { label: `loader:${id}`, depth },
+    tracePhase: "loader",
+    spanName: "rango.loader",
+    attributes: { "rango.loader_id": id },
+  }),
+
+  /** One segment route/layout handler execution (the component/handler that
+   * produces a segment). Span only — the perf metric (handler:<id>) is owned by
+   * the legacy track() at the same call site, so observePhase here adds the
+   * rango.handler span without double-recording. `id` is the HANDLER id (the
+   * entry.id used in the handler:<id> perf row), carried as rango.handler_id —
+   * NOT the emitted segment's id (shortCode), which differs; the *_id naming
+   * mirrors rango.loader_id / rango.action_id. */
+  handler: (id: string): PhaseSpec => ({
+    metric: false,
+    tracePhase: "handler",
+    spanName: "rango.handler",
+    attributes: { "rango.handler_id": id },
+  }),
+
+  /** Whole render phase: match + serialize + SSR. The metric label is resolved
+   * lazily at record time (after match has set the route name) so the perf
+   * timeline shows WHICH route rendered: `render:total:<routeName>`, falling back
+   * to `render:total` when there is no named route (unmatched / auto-generated). */
+  render: {
+    metric: {
+      label: () => {
+        const routeName = currentRouteName();
+        return routeName ? `render:total:${routeName}` : "render:total";
+      },
+    },
+    tracePhase: "render",
+    spanName: "rango.render",
+    // Tag the render span with the matched route so the Cloudflare/OTel waterfall
+    // shows WHICH route rendered (rango.render + rango.route=index), resolved
+    // after match has run. Kept an attribute (not baked into the span name) so the
+    // span name stays low-cardinality and aggregatable across routes.
+    lazyAttributes: () => {
+      const routeName = currentRouteName();
+      return routeName ? { "rango.route": routeName } : undefined;
+    },
+  } as PhaseSpec,
+
+  /** SSR HTML render from the RSC stream. Colon-delimited like the other ssr:*
+   * setup metrics (ssr:module-load / ssr:stream-mode). */
+  ssr: {
+    metric: { label: "ssr:render-html" },
+    tracePhase: "ssr",
+    spanName: "rango.ssr",
+  } as PhaseSpec,
+} as const;
+
+/** Apply a phase spec's static attributes to a span (the no-op span ignores them). */
+function applyAttributes(
+  span: TraceSpan,
+  attributes: Record<string, string | number | boolean>,
+): void {
+  for (const key in attributes) span.setAttribute(key, attributes[key]);
+}
+
+/**
+ * Record a phase's perf metric for the interval [start, now]. The label may be
+ * lazy (resolved here, e.g. render:total needs the route name that match sets
+ * partway through the wrapped work).
+ */
+function recordPhaseMetric(
+  store: MetricsStore,
+  metric: Exclude<PhaseMetric, false>,
+  start: number,
+): void {
+  const label =
+    typeof metric.label === "function" ? metric.label() : metric.label;
+  appendMetric(store, label, start, performance.now() - start, metric.depth);
+}
+
+/**
+ * Instrument one unit of work: open its span AND (unless `metric: false`) record
+ * its perf metric, from a single wrap site. fn is invoked exactly once with the
+ * span (a no-op span when tracing is off); its return value is returned
+ * unchanged and thrown errors / rejected promises propagate unchanged. When fn
+ * returns a promise both the metric duration and the span end when it settles.
+ *
+ * This is the ONLY phase primitive: every phase (request/middleware/action/
+ * loader/handler/render/ssr) is construction-bound — the span and metric settle
+ * when fn's own work completes (for the streaming phases, when the RSC/HTML
+ * stream is constructed, NOT when the body drains). Instrumentation is strictly
+ * best-effort: it never wraps or buffers the response and adds no work on the
+ * streaming path, so it cannot regress response latency or streaming. A loader
+ * that resolves while the body streams therefore keeps a rango.loader span that
+ * may extend past its render parent — overlapping spans are valid; the loader
+ * really did take that long.
+ *
+ * Reads the metrics store + tracing off the RequestContext ALS, which is active
+ * for the WHOLE request — contrast observeEvent, which reads the RouterContext
+ * ALS (entered later, during match).
+ */
+export function observePhase<T>(
+  spec: PhaseSpec,
+  fn: (span: TraceSpan) => T,
+): T {
+  const reqCtx = _getRequestContext();
+  const store = reqCtx?._metricsStore;
+  const tracing = reqCtx?._tracing;
+
+  // Neither surface active: direct call, zero overhead.
+  if (!store && !tracing) return fn(NOOP_TRACE_SPAN);
+
+  // Attributes only land on a real span. Build the attribute/lazy wrapper only
+  // when this phase's span is actually enabled (not toggled off via `spans`), and
+  // short-circuit inside when the runner hands back the no-op span (tracing
+  // configured but off at runtime — e.g. no executionContext.tracing). That keeps
+  // the "configured but effectively off" path free of per-call attribute loops
+  // and lazy `.then()` allocations. `lazyAttributes` resolve AFTER fn runs (e.g.
+  // rango.route, known post-match) and apply on BOTH success and failure so an
+  // errored phase span is still tagged.
+  const attributes = spec.attributes;
+  const lazy = spec.lazyAttributes;
+  const spanEnabled =
+    tracing !== undefined && tracing.phases[spec.tracePhase] !== false;
+  const wrapped: (span: TraceSpan) => T =
+    (attributes || lazy) && spanEnabled
+      ? (span) => {
+          if (span === NOOP_TRACE_SPAN) return fn(span);
+          if (attributes) applyAttributes(span, attributes);
+          // A SYNCHRONOUS throw from fn skips applyLate — fine by design: the only
+          // lazyAttributes phase (render) is always async, so any internal throw
+          // surfaces as a rejection that the onReject branch below DOES tag. If a
+          // sync lazyAttributes phase is ever added, wrap this in try/catch.
+          const out = fn(span);
+          if (!lazy) return out;
+          const applyLate = () => {
+            const late = lazy();
+            if (late) applyAttributes(span, late);
+          };
+          if (out instanceof Promise) {
+            return out.then(
+              (value) => {
+                applyLate();
+                return value;
+              },
+              (error) => {
+                applyLate();
+                throw error;
+              },
+            ) as T;
+          }
+          applyLate();
+          return out;
+        }
+      : fn;
+
+  const runSpan = (): T =>
+    traceSpan(tracing, spec.tracePhase, spec.spanName, wrapped);
+
+  // Span-only — no perf metric to record (metric:false, or perf surface off).
+  const metric = spec.metric;
+  if (!store || metric === false) return runSpan();
+
+  // Record the phase duration on EVERY termination — success or failure — so a
+  // failed loader/render still shows its timing in the perf report (parity with
+  // the old track().finally() path it replaced).
+  const start = performance.now();
+  return runThenSettle(runSpan, () => recordPhaseMetric(store, metric, start));
+}
+
+/**
+ * Open a rango.handler span around one segment route/layout handler call. The
+ * segment-resolution hot path runs this PER SEGMENT, so it gates on the SPAN
+ * surface alone and calls the handler directly otherwise — building neither the
+ * PhaseSpec (PHASES.handler allocates) nor the wrapper closure on the off path.
+ * The handler:<id> perf metric is owned by the track() at the call site, so the
+ * span is the only surface this adds (metric:false); a debugPerformance-only
+ * request (no tracing) or a disabled handler phase (spans:{handler:false}) has
+ * nothing to record here and short-circuits.
+ */
+export function observeHandler<C, R>(
+  id: string,
+  handler: (ctx: C) => R,
+  ctx: C,
+): R {
+  const tracing = _getRequestContext()?._tracing;
+  if (!tracing || tracing.phases.handler === false) return handler(ctx);
+  return observePhase(PHASES.handler(id), () => handler(ctx));
+}
+
+/**
+ * Emit one discrete telemetry event (the event-shaped counterpart to
+ * observePhase). Resolves the sink from the active router context and stamps the
+ * request id when the event omits it. No-op (and total — never throws) when no
+ * sink is configured.
+ *
+ * This is the canonical emitter for SYNCHRONOUS facts that fire inside the
+ * request's ALS scope (revalidation decisions, cache-lookup decisions). A few
+ * emitters deliberately stay on the lower-level resolveSink + safeEmit because
+ * observeEvent's lazy, per-call getRouterContext() read does not fit them — keep
+ * this the complete list:
+ *   - router.ts wrapLoaderPromise (loader.start/end/error) and
+ *     segment-resolution/streamed-handler-telemetry.ts (streamed handler.error)
+ *     capture the sink + request id EAGERLY and emit from a fire-and-forget
+ *     continuation that runs after the ALS scope may have unwound.
+ *   - router/match-handlers.ts resolves the sink ONCE for the hot match-pipeline
+ *     loop (request.start/end/error, cache.decision, ...).
+ *   - segment-resolution/helpers.ts emits via a caller-provided report.telemetry
+ *     sink rather than the ALS router context.
+ *   - rsc/handler.ts handleTimeoutResponse (request.timeout), the origin guard
+ *     (request.origin-rejected), and handleStore.onError (late-handle
+ *     handler.error) emit via router.telemetry directly — they run outside the
+ *     RouterContext ALS (only match()/matchPartial() enter it), so a
+ *     getRouterContext() read there throws and the event would vanish.
+ */
+export function observeEvent(event: TelemetryEvent): void {
+  // getRouterContext() either throws (real impl, outside a router context — e.g.
+  // the build-time prerender path) or returns null/undefined (e.g. mocked).
+  // Either way there is no sink to emit to, so swallow and return.
+  let routerCtx: ReturnType<typeof getRouterContext> | null | undefined;
+  try {
+    routerCtx = getRouterContext();
+  } catch {
+    return;
+  }
+  if (!routerCtx?.telemetry) return;
+  const stamped =
+    event.requestId === undefined && routerCtx.requestId !== undefined
+      ? ({ ...event, requestId: routerCtx.requestId } as TelemetryEvent)
+      : event;
+  safeEmit(resolveSink(routerCtx.telemetry), stamped);
+}

package/src/router/intercept-resolution.ts

@@ -11,13 +11,49 @@ import type {
   InterceptEntry,
   InterceptSelectorContext,
 } from "../server/context";
-import type { HandlerContext, ResolvedSegment } from "../types";
+import type {
+  HandlerContext,
+  InternalHandlerContext,
+  ResolvedSegment,
+} from "../types";
 import { evaluateRevalidation } from "./revalidation.js";
 import { getRequestContext } from "../server/request-context.js";
 import { executeInterceptMiddleware } from "./middleware.js";
-import { handleHandlerResult } from "./segment-resolution.js";
+import { createReverseFunction } from "./handler-context.js";
+import { getGlobalRouteMap } from "../route-map-builder.js";
+import {
+  handleHandlerResult,
+  warnOnStreamedResponse,
+  buildLoaderErrorContext,
+} from "./segment-resolution.js";
 import type { SegmentResolutionDeps } from "./types.js";
 import { debugLog } from "./logging.js";
+import {
+  RangoContext,
+  latchPprHeaderScopeForEntries,
+  runInsideLoaderScope,
+} from "../server/context.js";
+
+/**
+ * Header-guard latch for the intercept funnels (issue #713). ppr and
+ * intercepts do not compose on the shell path — shells are captured/served
+ * only for document requests and withInterceptResolution skips intercepts on
+ * full matches — so this is defense in depth: a partial nav CAN render an
+ * intercept over a ppr-declared target route, in its own store scope where
+ * the main funnel's latch does not apply. Latch by declaration, off the
+ * target route's manifest entry (same leaf input as the segment funnels).
+ * Called AFTER intercept middleware runs — middleware stays the live lane.
+ */
+function latchPprHeaderScopeForInterceptTarget(
+  interceptEntry: InterceptEntry,
+): void {
+  const targetEntry = RangoContext.getStore()?.manifest.get(
+    interceptEntry.routeName,
+  );
+  if (targetEntry) {
+    latchPprHeaderScopeForEntries([targetEntry], interceptEntry.routeName);
+  }
+}
 
 /**
  * Check if an intercept's when conditions are satisfied.
@@ -59,28 +95,14 @@ export function findInterceptForRoute(
   let current: EntryData | null = fromEntry;
 
   while (current) {
-    if (current.intercept && current.intercept.length > 0) {
-      for (const intercept of current.intercept) {
+    // current first, then its sibling layouts — same order as before.
+    for (const source of [current, ...current.layout]) {
+      for (const intercept of source.intercept) {
         if (
           intercept.routeName === targetRouteKey &&
           evaluateInterceptWhen(intercept, selectorContext, isAction)
         ) {
-          return { intercept, entry: current };
-        }
-      }
-    }
-
-    if (current.layout && current.layout.length > 0) {
-      for (const siblingLayout of current.layout) {
-        if (siblingLayout.intercept && siblingLayout.intercept.length > 0) {
-          for (const intercept of siblingLayout.intercept) {
-            if (
-              intercept.routeName === targetRouteKey &&
-              evaluateInterceptWhen(intercept, selectorContext, isAction)
-            ) {
-              return { intercept, entry: siblingLayout };
-            }
-          }
+          return { intercept, entry: source };
         }
       }
     }
@@ -116,10 +138,25 @@ export async function resolveInterceptEntry<TEnv>(
     };
     stale?: boolean;
   },
+  options?: {
+    /**
+     * Skip the intercept's middleware execution. Set ONLY by the post-response
+     * background re-render paths (proactive caching, stale background
+     * revalidation), whose sole purpose is to re-render the segment tree to
+     * populate the cache. The foreground request already ran the intercept
+     * middleware before the response was sent — it validated auth, set cookies,
+     * and wrote context vars into the request context's shared `_variables`,
+     * which the background render reuses. Re-running middleware here would fire
+     * its side effects a SECOND time, and a middleware that short-circuits with
+     * a Response would `throw` and silently abort the cache write. Never set on
+     * the foreground path.
+     */
+    skipMiddleware?: boolean;
+  },
 ): Promise<ResolvedSegment[]> {
   const segments: ResolvedSegment[] = [];
 
-  if (interceptEntry.middleware.length > 0) {
+  if (!options?.skipMiddleware && interceptEntry.middleware.length > 0) {
     const requestCtx = getRequestContext();
     if (!requestCtx?.res) {
       throw new Error(
@@ -131,12 +168,15 @@ export async function resolveInterceptEntry<TEnv>(
       context.request,
       context.env,
       params,
-      context.var as Record<string, any>,
+      (context as InternalHandlerContext<any, TEnv>)._variables,
       requestCtx.res,
+      createReverseFunction(getGlobalRouteMap()),
     );
     if (middlewareResponse) throw middlewareResponse;
   }
 
+  latchPprHeaderScopeForInterceptTarget(interceptEntry);
+
   const loaderPromises: Promise<any>[] = [];
   const loaderIds: string[] = [];
 
@@ -185,6 +225,7 @@ export async function resolveInterceptEntry<TEnv>(
           context,
           actionContext,
           stale,
+          traceSource: "intercept-loader",
         });
 
         if (!shouldRevalidate) {
@@ -203,10 +244,13 @@ export async function resolveInterceptEntry<TEnv>(
     loaderIds.push(loader.$$id);
     loaderPromises.push(
       deps.wrapLoaderPromise(
-        context.use(loader),
+        runInsideLoaderScope(() => context.use(loader)),
         parentEntry,
         segmentId,
         context.pathname,
+        // Report a throwing intercept loader to onError + loader.error telemetry,
+        // matching the fresh/revalidation paths.
+        buildLoaderErrorContext(context),
       ),
     );
   }
@@ -233,6 +277,12 @@ export async function resolveInterceptEntry<TEnv>(
   let loaderDataPromise: Promise<any[]> | any[] | undefined;
 
   if (interceptEntry.loading && loaderPromises.length > 0) {
+    if (handlerResult instanceof Promise) {
+      warnOnStreamedResponse(
+        handlerResult,
+        `intercept ${interceptEntry.slotName}`,
+      );
+    }
     component =
       handlerResult instanceof Promise
         ? handlerResult
@@ -305,6 +355,8 @@ export async function resolveInterceptLoadersOnly<TEnv>(
     return null;
   }
 
+  latchPprHeaderScopeForInterceptTarget(interceptEntry);
+
   const loaderPromises: Promise<any>[] = [];
   const loaderIds: string[] = [];
 
@@ -352,6 +404,7 @@ export async function resolveInterceptLoadersOnly<TEnv>(
         context,
         actionContext,
         stale,
+        traceSource: "intercept-loader",
       });
 
       if (!shouldRevalidate) {
@@ -369,10 +422,15 @@ export async function resolveInterceptLoadersOnly<TEnv>(
     loaderIds.push(loader.$$id);
     loaderPromises.push(
       deps.wrapLoaderPromise(
-        context.use(loader),
+        runInsideLoaderScope(() => context.use(loader)),
         parentEntry,
         segmentId,
         context.pathname,
+        // Report a throwing intercept loader to onError + loader.error telemetry,
+        // matching the fresh/revalidation paths. resolveInterceptLoadersOnly is
+        // only called on the cache-hit partial-update path (handleCacheHitIntercept),
+        // so flag isPartial:true exactly like revalidation.ts's partial path.
+        { ...buildLoaderErrorContext(context), isPartial: true },
       ),
     );
   }
@@ -381,10 +439,12 @@ export async function resolveInterceptLoadersOnly<TEnv>(
     return null;
   }
 
-  const loaderDataPromise =
-    interceptEntry.loading !== undefined
-      ? Promise.all(loaderPromises)
-      : await Promise.all(loaderPromises);
+  // Match fresh-path semantics: only defer (no await) when loading is truthy.
+  // `loading: false` means "no loading UI, await loaders before render" —
+  // same as the fresh path's `if (interceptEntry.loading && ...)` check.
+  const loaderDataPromise = interceptEntry.loading
+    ? Promise.all(loaderPromises)
+    : await Promise.all(loaderPromises);
 
   return { loaderDataPromise, loaderIds };
 }