fix(@angular/build): handle APP_BASE_HREF correctly in prerendered routes

This commit resolves path stripping issues when `APP_BASE_HREF` does not align with the expected value.

Closes #28775

Author: alan-agius4

packages/angular/build/src/builders/application/execute-post-bundle.ts

@@ -206,6 +206,8 @@ export async function executePostBundleSteps(
         locale,
       );
 
+      manifest.contents = new TextEncoder().encode(manifestContent);
+
       for (const chunk of serverAssetsChunks) {
         const idx = additionalOutputFiles.findIndex(({ path }) => path === chunk.path);
         if (idx === -1) {
@@ -214,8 +216,6 @@ export async function executePostBundleSteps(
           additionalOutputFiles[idx] = chunk;
         }
       }
-
-      manifest.contents = new TextEncoder().encode(manifestContent);
     }
   }
 

packages/angular/build/src/utils/server-rendering/prerender.ts

@@ -220,9 +220,10 @@ async function renderPages(
 
     for (const { route, redirectTo, renderMode } of serializableRouteTreeNode) {
       // Remove base href from file output path.
-      const routeWithoutBaseHref = addLeadingSlash(
-        route.slice(baseHrefWithLeadingSlash.length - 1),
-      );
+      const routeWithoutBaseHref = route.startsWith(baseHrefWithLeadingSlash)
+        ? addLeadingSlash(route.slice(baseHrefWithLeadingSlash.length - 1))
+        : route;
+
       const outPath = posix.join(removeLeadingSlash(routeWithoutBaseHref), 'index.html');
 
       if (typeof redirectTo === 'string') {

tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-static-i18n_APP_BASE_HREF.ts

@@ -0,0 +1,152 @@
+import { join } from 'node:path';
+import { existsSync } from 'node:fs';
+import assert from 'node:assert';
+import {
+  expectFileNotToExist,
+  expectFileToMatch,
+  replaceInFile,
+  writeFile,
+} from '../../../utils/fs';
+import { ng, noSilentNg, silentNg } from '../../../utils/process';
+import { installWorkspacePackages, uninstallPackage } from '../../../utils/packages';
+import { useSha } from '../../../utils/project';
+import { getGlobalVariable } from '../../../utils/env';
+import { expectToFail } from '../../../utils/utils';
+import { setupI18nConfig } from '../../i18n/setup';
+
+export default async function () {
+  assert(
+    getGlobalVariable('argv')['esbuild'],
+    'This test should not be called in the Webpack suite.',
+  );
+
+  // Setup project
+  await setupI18nConfig();
+
+  // Forcibly remove in case another test doesn't clean itself up.
+  await uninstallPackage('@angular/ssr');
+  await ng('add', '@angular/ssr', '--server-routing', '--skip-confirmation', '--skip-install');
+  await useSha();
+  await installWorkspacePackages();
+
+  // Add routes
+  await writeFile(
+    'src/app/app.routes.ts',
+    `
+  import { Routes } from '@angular/router';
+  import { HomeComponent } from './home/home.component';
+  import { SsgComponent } from './ssg/ssg.component';
+  import { SsgWithParamsComponent } from './ssg-with-params/ssg-with-params.component';
+
+  export const routes: Routes = [
+    {
+      path: '',
+      component: HomeComponent,
+    },
+    {
+      path: 'ssg',
+      component: SsgComponent,
+    },
+    {
+      path: 'ssg-redirect',
+      redirectTo: 'ssg'
+    },
+    {
+      path: 'ssg/:id',
+      component: SsgWithParamsComponent,
+    },
+    {
+      path: '**',
+      component: HomeComponent,
+    },
+  ];
+  `,
+  );
+
+  // Add server routing
+  await writeFile(
+    'src/app/app.routes.server.ts',
+    `
+  import { RenderMode, ServerRoute } from '@angular/ssr';
+
+  export const serverRoutes: ServerRoute[] = [
+    {
+      path: 'ssg/:id',
+      renderMode: RenderMode.Prerender,
+      getPrerenderParams: async() => [{id: 'one'}, {id: 'two'}],
+    },
+    {
+      path: '**',
+      renderMode: RenderMode.Server,
+    },
+  ];
+  `,
+  );
+
+  await writeFile(
+    'src/app/app.config.ts',
+    `
+      import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
+      import { provideRouter } from '@angular/router';
+
+      import { routes } from './app.routes';
+      import { provideClientHydration } from '@angular/platform-browser';
+      import { APP_BASE_HREF } from '@angular/common';
+
+      export const appConfig: ApplicationConfig = {
+        providers: [
+          provideZoneChangeDetection({ eventCoalescing: true }),
+          provideRouter(routes),
+          provideClientHydration(),
+          {
+            provide: APP_BASE_HREF,
+            useValue: '/',
+          },
+        ],
+      };
+      `,
+  );
+
+  // Generate components for the above routes
+  const componentNames: string[] = ['home', 'ssg', 'ssg-with-params'];
+  for (const componentName of componentNames) {
+    await silentNg('generate', 'component', componentName);
+  }
+
+  // Should error as above we set `RenderMode.Server`
+  const { message: errorMessage } = await expectToFail(() =>
+    noSilentNg('build', '--output-mode=static'),
+  );
+  assert.match(
+    errorMessage,
+    new RegExp(
+      `Route '/' is configured with server render mode, but the build 'outputMode' is set to 'static'.`,
+    ),
+  );
+
+  // Fix the error
+  await replaceInFile('src/app/app.routes.server.ts', 'RenderMode.Server', 'RenderMode.Prerender');
+  await noSilentNg('build', '--output-mode=static');
+
+  const expects: Record<string, string> = {
+    'index.html': 'home works!',
+    'ssg/index.html': 'ssg works!',
+    'ssg/one/index.html': 'ssg-with-params works!',
+    'ssg/two/index.html': 'ssg-with-params works!',
+    // When static redirects as generated as meta tags.
+    'ssg-redirect/index.html': '<meta http-equiv="refresh" content="0; url=/ssg">',
+  };
+
+  for (const [filePath, fileMatch] of Object.entries(expects)) {
+    await expectFileToMatch(join('dist/test-project/browser', filePath), fileMatch);
+  }
+
+  // Check that server directory does not exist
+  assert(
+    !existsSync('dist/test-project/server'),
+    'Server directory should not exist when output-mode is static',
+  );
+
+  // Should not prerender the catch all
+  await expectFileNotToExist(join('dist/test-project/browser/**/index.html'));
+}