fix(@angular-devkit/build-angular): serve assets from the provided serve-path

When the `serve-path` option is used assets are now correctly servered from this location.

Closes #26509

Author: alan-agius4

packages/angular_devkit/build_angular/src/builders/dev-server/tests/options/serve-path_spec.ts

@@ -18,7 +18,9 @@ describeServeBuilder(
   (harness, setupTarget, isViteRun) => {
     describe('option: "servePath"', () => {
       beforeEach(async () => {
-        setupTarget(harness);
+        setupTarget(harness, {
+          assets: ['src/assets'],
+        });
 
         // Application code is not needed for these tests
         await harness.writeFile('src/main.ts', 'console.log("foo");');
@@ -96,6 +98,23 @@ describeServeBuilder(
         expect(result?.success).toBeTrue();
         expect(await response?.text()).toContain('<title>');
       });
+
+      it('serves assets at specified path when option is used', async () => {
+        await harness.writeFile('src/assets/test.txt', 'hello world!');
+
+        harness.useTarget('serve', {
+          ...BASE_OPTIONS,
+          servePath: '/test',
+        });
+
+        const { result, response } = await executeOnceAndFetch(harness, '/test/assets/test.txt', {
+          // fallback processing requires an accept header
+          request: { headers: { accept: 'text/html' } },
+        });
+
+        expect(result?.success).toBeTrue();
+        expect(await response?.text()).toContain('hello world');
+      });
     });
   },
 );

packages/angular_devkit/build_angular/src/builders/dev-server/vite-server.ts

@@ -90,6 +90,10 @@ export async function* serveWithVite(
     serverOptions.servePath = browserOptions.baseHref;
   }
 
+  if (serverOptions.servePath) {
+    serverOptions.servePath = addLeadingSlash(serverOptions.servePath);
+  }
+
   // The development server currently only supports a single locale when localizing.
   // This matches the behavior of the Webpack-based development server but could be expanded in the future.
   if (
@@ -591,7 +595,7 @@ export async function setupServer(
             if (assetSourcePath !== undefined) {
               // The encoding needs to match what happens in the vite static middleware.
               // ref: https://github.com/vitejs/vite/blob/d4f13bd81468961c8c926438e815ab6b1c82735e/packages/vite/src/node/server/middlewares/static.ts#L163
-              req.url = `/@fs/${encodeURI(assetSourcePath)}`;
+              req.url = `${serverOptions.servePath ?? ''}/@fs/${encodeURI(assetSourcePath)}`;
               next();
 
               return;
@@ -801,17 +805,15 @@ async function loadViteClientCode(file: string) {
   return contents;
 }
 
-function pathnameWithoutServePath(url: string, serverOptions: NormalizedDevServerOptions): string {
+function pathnameWithoutServePath(url: string, { servePath }: NormalizedDevServerOptions): string {
   const parsedUrl = new URL(url, 'http://localhost');
-  let pathname = decodeURIComponent(parsedUrl.pathname);
-  if (serverOptions.servePath && pathname.startsWith(serverOptions.servePath)) {
-    pathname = pathname.slice(serverOptions.servePath.length);
-    if (pathname[0] !== '/') {
-      pathname = '/' + pathname;
-    }
-  }
+  const pathname = decodeURIComponent(parsedUrl.pathname);
+
+  return servePath && pathname.startsWith(servePath) ? pathname.slice(servePath.length) : pathname;
+}
 
-  return pathname;
+function addLeadingSlash(value: string): string {
+  return value.charAt(0) === '/' ? value : '/' + value;
 }
 
 type ViteEsBuildPlugin = NonNullable<