From 8bd2b260e2008f1ffc71af0e55b27884c3660c54 Mon Sep 17 00:00:00 2001
From: Alan Agius <alanagius@google.com>
Date: Wed, 20 Nov 2024 12:34:32 +0000
Subject: [PATCH] fix(@angular/ssr): handle baseHref that start with `./`

Updated function to support handling `baseHref` starting with './' path correctly.

(cherry picked from commit 8c534da64955fc834a39dfd4ced6b83358e11028)
---
 packages/angular/ssr/src/routes/ng-routes.ts  |  7 +++++--
 packages/angular/ssr/test/app-engine_spec.ts  |  2 +-
 .../angular/ssr/test/routes/ng-routes_spec.ts | 20 +++++++++++++++++++
 packages/angular/ssr/test/testing-utils.ts    |  8 ++++----
 4 files changed, 30 insertions(+), 7 deletions(-)

diff --git a/packages/angular/ssr/src/routes/ng-routes.ts b/packages/angular/ssr/src/routes/ng-routes.ts
index 5bba8b7d9aba..9e48f49b2b11 100644
--- a/packages/angular/ssr/src/routes/ng-routes.ts
+++ b/packages/angular/ssr/src/routes/ng-routes.ts
@@ -421,12 +421,15 @@ export async function getRoutesFromAngularRouterConfig(
     const routesResults: RouteTreeNodeMetadata[] = [];
     const errors: string[] = [];
 
-    const baseHref =
+    let baseHref =
       injector.get(APP_BASE_HREF, null, { optional: true }) ??
       injector.get(PlatformLocation).getBaseHrefFromDOM();
 
-    const compiler = injector.get(Compiler);
+    if (baseHref.startsWith('./')) {
+      baseHref = baseHref.slice(2);
+    }
 
+    const compiler = injector.get(Compiler);
     const serverRoutesConfig = injector.get(SERVER_ROUTES_CONFIG, null, { optional: true });
     let serverConfigRouteTree: RouteTree<ServerConfigRouteTreeAdditionalMetadata> | undefined;
 
diff --git a/packages/angular/ssr/test/app-engine_spec.ts b/packages/angular/ssr/test/app-engine_spec.ts
index cf4e1d0d11a8..33e9741f4c9c 100644
--- a/packages/angular/ssr/test/app-engine_spec.ts
+++ b/packages/angular/ssr/test/app-engine_spec.ts
@@ -42,7 +42,7 @@ describe('AngularAppEngine', () => {
               setAngularAppTestingManifest(
                 [{ path: 'home', component: HomeComponent }],
                 [{ path: '**', renderMode: RenderMode.Server }],
-                locale,
+                '/' + locale,
               );
 
               return {
diff --git a/packages/angular/ssr/test/routes/ng-routes_spec.ts b/packages/angular/ssr/test/routes/ng-routes_spec.ts
index 4b334c25eac9..050e0e09cd33 100644
--- a/packages/angular/ssr/test/routes/ng-routes_spec.ts
+++ b/packages/angular/ssr/test/routes/ng-routes_spec.ts
@@ -355,4 +355,24 @@ describe('extractRoutesAndCreateRouteTree', () => {
       { route: '/', renderMode: RenderMode.Server, status: 201 },
     ]);
   });
+
+  it(`handles a baseHref starting with a "./" path`, async () => {
+    setAngularAppTestingManifest(
+      [{ path: 'home', component: DummyComponent }],
+      [{ path: '**', renderMode: RenderMode.Server }],
+      /** baseHref*/ './example',
+    );
+
+    const { routeTree, errors } = await extractRoutesAndCreateRouteTree(
+      url,
+      /** manifest */ undefined,
+      /** invokeGetPrerenderParams */ true,
+      /** includePrerenderFallbackRoutes */ true,
+    );
+
+    expect(errors).toHaveSize(0);
+    expect(routeTree.toObject()).toEqual([
+      { route: '/example/home', renderMode: RenderMode.Server },
+    ]);
+  });
 });
diff --git a/packages/angular/ssr/test/testing-utils.ts b/packages/angular/ssr/test/testing-utils.ts
index be4a52d09d0f..99971ab894ef 100644
--- a/packages/angular/ssr/test/testing-utils.ts
+++ b/packages/angular/ssr/test/testing-utils.ts
@@ -21,12 +21,12 @@ import { ServerRoute, provideServerRoutesConfig } from '../src/routes/route-conf
  *
  * @param routes - An array of route definitions to be used by the Angular Router.
  * @param serverRoutes - An array of ServerRoute definitions to be used for server-side rendering.
- * @param [baseHref=''] - An optional base href to be used in the HTML template.
+ * @param [baseHref='/'] - An optional base href to be used in the HTML template.
  */
 export function setAngularAppTestingManifest(
   routes: Routes,
   serverRoutes: ServerRoute[],
-  baseHref = '',
+  baseHref = '/',
   additionalServerAssets: Record<string, ServerAsset> = {},
 ): void {
   setAngularAppManifest({
@@ -40,7 +40,7 @@ export function setAngularAppTestingManifest(
           text: async () => `<html>
             <head>
               <title>SSR page</title>
-              <base href="/${baseHref}" />
+              <base href="${baseHref}" />
             </head>
             <body>
               <app-root></app-root>
@@ -55,7 +55,7 @@ export function setAngularAppTestingManifest(
             `<html>
             <head>
               <title>CSR page</title>
-              <base href="/${baseHref}" />
+              <base href="${baseHref}" />
             </head>
             <body>
               <app-root></app-root>