fix(middleware): load template variables on deep-linked sub-path navigation

Template data was loaded only when the first request matched the exact main page
URL. Opening a deep-linked sub-path (e.g. an SPA route) left template variables
unloaded, breaking page injection.

Load template data also on the first HTML-document navigation under the app base
(detected via Sec-Fetch-Dest / Accept), so asset and XHR requests are unaffected;
the load is cached and stays a no-op afterwards. The base is passed as a dedicated
appBase option used only for navigation scoping, leaving the auth-failure redirect
URL unchanged to avoid a redirect loop on v7.

Add integration tests for sub-path, asset, and out-of-base requests.

Author: sergak01

src/lib/load-pp-data.middleware.ts

@@ -42,12 +42,44 @@ function setCachedResponse(key: string, data: any): void {
 // Constants
 const DEFAULT_REDIRECT_URL = '/home?proxyRedirect=';
 
+/**
+ * Whether the request is a top-level HTML document navigation (as opposed to an
+ * asset/XHR/HMR request). Used to detect deep-linked page loads so template data
+ * can be loaded even when the first request is not the main page URL.
+ */
+function isHtmlDocumentRequest(req: IncomingMessage): boolean {
+  const dest = req.headers['sec-fetch-dest'];
+
+  if (typeof dest === 'string') {
+    return dest === 'document';
+  }
+
+  // Fallback for clients that don't send Sec-Fetch-* headers.
+  const accept = req.headers['accept'];
+
+  return typeof accept === 'string' && accept.includes('text/html');
+}
+
+/**
+ * Whether the request path is served by this dev app (under its base path).
+ * An empty/`/` base means the app is served from the root.
+ */
+function isUnderBase(requestPath: string, base?: string): boolean {
+  if (!base || base === '/') {
+    return true;
+  }
+
+  const normalizedBase = base.endsWith('/') ? base : `${base}/`;
+
+  return requestPath === normalizedBase || requestPath === normalizedBase.slice(0, -1) || requestPath.startsWith(normalizedBase);
+}
+
 export function initLoadPPData(
   applyUrlRegExp: RegExp,
   mi: MiAPI,
-  opts: PPDevConfig & { base?: string },
+  opts: PPDevConfig & { base?: string; appBase?: string },
 ): NextHandleFunction {
-  const { templateLess = false, miHudLess = false, appId, base, v7Features } = opts;
+  const { templateLess = false, miHudLess = false, appId, base, appBase, v7Features } = opts;
 
   const logger = createLogger();
 
@@ -65,7 +97,19 @@ export function initLoadPPData(
   return async (req: IncomingMessage, res: ServerResponse, next: NextFunction) => {
     try {
       const isNeedTemplateLoad = !(templateLess && miHudLess);
-      const isApplyRequest = applyUrlRegExp.test(cutUrlParams(req.url ?? ''));
+      const requestPath = cutUrlParams(req.url ?? '');
+      const isApplyRequest = applyUrlRegExp.test(requestPath);
+
+      // A deep-linked navigation into the app (e.g. an SPA sub-route) that is not the
+      // exact main page URL. Without loading here, template variables would never be
+      // fetched when the very first request is such a sub-path. Excludes `/home`,
+      // which is handled by the auth/redirect block above. The load itself is cached,
+      // so this stays a no-op after the first navigation.
+      const isAppNavigation =
+        !isApplyRequest &&
+        !requestPath.startsWith('/home') &&
+        isUnderBase(requestPath, appBase) &&
+        isHtmlDocumentRequest(req);
 
       // 1. If !isAuthenticated && !isRedirected and url started with /home - try to handle load page or template
       if (
@@ -121,7 +165,7 @@ export function initLoadPPData(
       }
 
       // Default case - continue with normal flow
-      if (!isApplyRequest) {
+      if (!isApplyRequest && !isAppNavigation) {
         return next();
       }
 

src/plugin.ts

@@ -606,6 +606,7 @@ function vitePPDev(options: NormalizedVitePPDevOptions): Plugin {
             Object.assign({}, options, {
               appId: normalizedAppId,
               portalPageId: normalizedAppId,
+              appBase: base,
             }),
           ),
         );

tests/integration/middleware/load-pp-data.spec.ts

@@ -0,0 +1,117 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { createServer, type Server } from 'http';
+import { initLoadPPData, clearAPICache } from '../../../src/lib/load-pp-data.middleware.js';
+import type { MiAPI } from '../../../src/lib/pp.middleware.js';
+
+function createTestServer(middleware: any): Promise<{ server: Server; port: number }> {
+  return new Promise((resolve) => {
+    const server = createServer((req, res) => {
+      const next = () => {
+        res.statusCode = 200;
+        res.end('OK');
+      };
+      middleware(req, res, next);
+    });
+
+    server.listen(0, () => {
+      const address = server.address();
+      const port = typeof address === 'object' ? (address?.port ?? 0) : 0;
+
+      resolve({ server, port });
+    });
+  });
+}
+
+function makeRequest(port: number, path: string, headers: Record<string, string> = {}): Promise<{ status: number }> {
+  return new Promise((resolve) => {
+    const http = require('http');
+    const req = http.request({ hostname: 'localhost', port, path, method: 'GET', headers }, (res: any) => {
+      res.on('data', () => {});
+      res.on('end', () => resolve({ status: res.statusCode }));
+    });
+    req.end();
+  });
+}
+
+const DOCUMENT_HEADERS = { accept: 'text/html', 'sec-fetch-dest': 'document' };
+const SCRIPT_HEADERS = { accept: '*/*', 'sec-fetch-dest': 'script' };
+
+/**
+ * Regression tests for the bug where template variables were not loaded when the
+ * first dev-server request was a deep-linked sub-path instead of the main page URL.
+ */
+describe('initLoadPPData — load on deep-linked sub-path navigation', () => {
+  const APP_BASE = '/pl/foo/';
+  const isIndexRegExp = new RegExp(`^((${APP_BASE})|/)$`);
+
+  let mi: MiAPI;
+  let getPageVariables: ReturnType<typeof vi.fn>;
+  let getPageTemplate: ReturnType<typeof vi.fn>;
+
+  function buildMiddleware() {
+    return initLoadPPData(isIndexRegExp, mi, {
+      appId: 123,
+      templateLess: false,
+      miHudLess: false,
+      v7Features: true,
+      appBase: APP_BASE,
+    } as any);
+  }
+
+  beforeEach(() => {
+    clearAPICache();
+
+    getPageVariables = vi.fn().mockResolvedValue([]);
+    getPageTemplate = vi.fn().mockResolvedValue('<html></html>');
+
+    mi = { getPageVariables, getPageTemplate, getPageInfo: vi.fn().mockResolvedValue({}) } as unknown as MiAPI;
+  });
+
+  it('loads template variables for an HTML-document sub-path (the bug)', async () => {
+    const { server, port } = await createTestServer(buildMiddleware());
+
+    try {
+      await makeRequest(port, '/pl/foo/dashboard/widget', DOCUMENT_HEADERS);
+
+      expect(getPageVariables).toHaveBeenCalledTimes(1);
+    } finally {
+      server.close();
+    }
+  });
+
+  it('loads template variables for the exact main page URL', async () => {
+    const { server, port } = await createTestServer(buildMiddleware());
+
+    try {
+      await makeRequest(port, '/pl/foo/', DOCUMENT_HEADERS);
+
+      expect(getPageVariables).toHaveBeenCalledTimes(1);
+    } finally {
+      server.close();
+    }
+  });
+
+  it('does NOT load for asset (non-document) requests under base', async () => {
+    const { server, port } = await createTestServer(buildMiddleware());
+
+    try {
+      await makeRequest(port, '/pl/foo/assets/app.js', SCRIPT_HEADERS);
+
+      expect(getPageVariables).not.toHaveBeenCalled();
+    } finally {
+      server.close();
+    }
+  });
+
+  it('does NOT load for sub-paths outside the app base', async () => {
+    const { server, port } = await createTestServer(buildMiddleware());
+
+    try {
+      await makeRequest(port, '/pl/other-app/dashboard', DOCUMENT_HEADERS);
+
+      expect(getPageVariables).not.toHaveBeenCalled();
+    } finally {
+      server.close();
+    }
+  });
+});