fix(qwik-router): preserve params for ancestor layout loaders

.changeset/brave-pandas-smile.md

@@ -0,0 +1,5 @@
+---
+'@qwik.dev/router': patch
+---
+
+fix: scope ancestor route loader params to the params matched at their own path

packages/qwik-router/src/middleware/request-handler/handlers/loader-request-event.unit.ts

@@ -1,5 +1,9 @@
 import { describe, expect, it, vi } from 'vitest';
-import { getRouteLoaderCtx, loadRouteLoader } from '../../../runtime/src/route-loaders';
+import {
+  getRouteLoaderCtx,
+  getRouteLoaderParams,
+  loadRouteLoader,
+} from '../../../runtime/src/route-loaders';
 import type { LoaderInternal } from '../../../runtime/src/types';
 import type { RequestEventInternal } from '../request-event-core';
 import { createLoaderRequestEventFactory } from './loader-request-event';
@@ -109,6 +113,9 @@ describe('createLoaderRequestEventFactory', () => {
       const routeLoaderCtx = getRouteLoaderCtx(requestEv);
       routeLoaderCtx.loaderPaths['products-loader'] = '/products/';
       routeLoaderCtx.loaderPaths['details-loader'] = '/products/123/';
+      const loaderParams = getRouteLoaderParams(requestEv);
+      loaderParams['products-loader'] = {};
+      loaderParams['details-loader'] = { id: '123' };
       const getLoaderRequestEvent = createLoaderRequestEventFactory(requestEv);
       const productsLoader = createLoader('products-loader', ['page']);
       const detailsLoader = createLoader('details-loader', ['page']);
@@ -123,7 +130,25 @@ describe('createLoaderRequestEventFactory', () => {
       expect(detailsEv.url.href).toBe('http://localhost/products/123/?page=2');
       expect(productsEv.request.url).toBe('http://localhost/products/?page=2');
       expect(productsEv.originalUrl.href).toBe('http://localhost/products/?page=2');
-      expect(productsEv.params).toEqual({ id: '123' });
+      expect(productsEv.params).toEqual({});
+      expect(detailsEv.params).toEqual({ id: '123' });
+    } finally {
+      globalThis.__STRICT_LOADERS__ = previousStrictLoaders;
+    }
+  });
+
+  it('gives strict ancestor loaders no params when none were recorded for their path', () => {
+    const previousStrictLoaders = globalThis.__STRICT_LOADERS__;
+    globalThis.__STRICT_LOADERS__ = true;
+    try {
+      const requestEv = createRequestEv('http://localhost/products/123/view/');
+      getRouteLoaderCtx(requestEv).loaderPaths['details-loader'] = '/products/123/';
+      const getLoaderRequestEvent = createLoaderRequestEventFactory(requestEv);
+
+      const detailsEv = getLoaderRequestEvent(createLoader('details-loader', undefined));
+
+      expect(detailsEv.pathname).toBe('/products/123/');
+      expect(detailsEv.params).toEqual({});
     } finally {
       globalThis.__STRICT_LOADERS__ = previousStrictLoaders;
     }

packages/qwik-router/src/middleware/request-handler/resolve-request-handlers-core.ts

@@ -17,6 +17,7 @@ import type {
 import {
   clearRouteLoaderData,
   getRouteLoaderCtx,
+  getRouteLoaderParams,
   getRouteLoaderValues,
   loadRouteLoader,
   matchesRouteLoaderId,
@@ -363,6 +364,9 @@ function createResolveRequestHandlers() {
     if (route.$loaderPaths$) {
       Object.assign(routeLoaderCtx.loaderPaths, route.$loaderPaths$);
     }
+    if (route.$loaderParams$) {
+      Object.assign(getRouteLoaderParams(requestEv), route.$loaderParams$);
+    }
 
     // Store loader internals so SSG can check __cacheControl.
     setRouteLoaders(requestEv, routeLoaders);

packages/qwik-router/src/middleware/request-handler/resolve-request-handlers.unit.ts

@@ -605,6 +605,37 @@ describe('resolve-request-handler', () => {
       expect(background).toHaveBeenCalledTimes(1);
     });
 
+    it('scopes ancestor loader params to their matched path', async () => {
+      const previousStrictLoaders = globalThis.__STRICT_LOADERS__;
+      globalThis.__STRICT_LOADERS__ = true;
+      try {
+        const layoutLoader = vi.fn(() => 'layout');
+        const route = pageRouteWithLoaders(makeLoader('layout-loader', layoutLoader));
+        Object.assign(route, {
+          $routeName$: '/[tenantSlug]/agents/[id]/',
+          $params$: { tenantSlug: 'acme', id: '7' },
+          $loaderPaths$: { 'layout-loader': '/acme/' },
+          $loaderParams$: { 'layout-loader': { tenantSlug: 'acme' } },
+        });
+        const handlers = resolveRequestHandlers(undefined, route, 'GET', true, exitRender());
+        const requestEv = createRequestEvent(
+          createMockServerRequestEvent('http://localhost:3000/acme/agents/7/'),
+          route,
+          handlers,
+          '/',
+          vi.fn()
+        );
+
+        await requestEv.next();
+
+        expect(layoutLoader).toHaveBeenCalledWith(
+          expect.objectContaining({ params: { tenantSlug: 'acme' } })
+        );
+      } finally {
+        globalThis.__STRICT_LOADERS__ = previousStrictLoaders;
+      }
+    });
+
     it('does not await blockSSR:false loaders before render', async () => {
       let release!: () => void;
       const gate = new Promise<string>((resolve) => (release = () => resolve('late')));

packages/qwik-router/src/runtime/src/route-loaders.ts

@@ -44,6 +44,7 @@ import type {
   LoaderConstructorQRL,
   LoaderInternal,
   LoaderOptions,
+  PathParams,
   QwikRouterEnvData,
   RequestEvent,
   RequestEventLoader,
@@ -61,6 +62,7 @@ import type {
 
 const REQUEST_ROUTE_LOADER_STATE = '@routeLoaderState';
 const REQUEST_LOADER_PATHS_STORE = '@loaderPathsStore';
+const REQUEST_LOADER_PARAMS_STORE = '@loaderParamsStore';
 const REQUEST_ROUTE_LOADERS = '@routeLoaders';
 const REQUEST_ROUTE_LOADER_PROMISES = '@routeLoaderPromises';
 const REQUEST_ROUTE_LOADER_EVENTS = '@routeLoaderEvents';
@@ -635,6 +637,18 @@ export function getRouteLoaderCtx(requestEv: RequestEventBase): RouteLoaderCtx {
   return ctx;
 }
 
+/** Server-only loader ID → params matched at its loader path; never serialized to the client. */
+export function getRouteLoaderParams(
+  requestEv: RequestEventBase
+): Record<string, PathParams | undefined> {
+  let params = requestEv.sharedMap.get(REQUEST_LOADER_PARAMS_STORE);
+  if (!params) {
+    params = {};
+    requestEv.sharedMap.set(REQUEST_LOADER_PARAMS_STORE, params);
+  }
+  return params;
+}
+
 export const getModuleRouteLoaders = (mods: readonly (RouteModule | undefined)[]) => {
   const routeLoaders: LoaderInternal[] = [];
   const seen = new Map<string, LoaderInternal>();
@@ -942,6 +956,11 @@ export const getLoaderRequestEvent = (
   if (pathname === rootRequestEv.url.pathname && filteredSearch === rootRequestEv.url.search) {
     return rootRequestEv;
   }
+  // An ancestor path only sees params matched up to it; fail closed if none were recorded.
+  const params =
+    pathname === rootRequestEv.url.pathname
+      ? rootRequestEv.params
+      : getRouteLoaderParams(rootRequestEv)[loader.__id] || {};
 
   let events: Map<string, RequestEvent> = rootRequestEv.sharedMap.get(REQUEST_ROUTE_LOADER_EVENTS);
   if (!events) {
@@ -961,7 +980,7 @@ export const getLoaderRequestEvent = (
         enumerable: true,
       },
       params: {
-        value: rootRequestEv.params,
+        value: params,
         enumerable: true,
       },
       pathname: {