fix(@angular-devkit/build-angular): rewire sourcemap back to original source root

Prior to this change, when a error occurs when using the SSR dev-server the stacktraces pointed back to the virtual root path.

Author: alan-agius4

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

@@ -534,25 +534,21 @@ export async function setupServer(
           const originalssrTransform = server.ssrTransform;
           server.ssrTransform = async (code, map, url, originalCode) => {
             const result = await originalssrTransform(code, null, url, originalCode);
-            if (!result) {
-              return null;
+            if (!result || !result.map || !map) {
+              return result;
             }
 
-            let transformedCode = result.code;
-            if (result.map && map) {
-              transformedCode +=
-                `\n//# sourceMappingURL=` +
-                `data:application/json;base64,${Buffer.from(
-                  JSON.stringify(
-                    remapping([result.map as SourceMapInput, map as SourceMapInput], () => null),
-                  ),
-                ).toString('base64')}`;
-            }
+            const remappedMap = remapping(
+              [result.map as SourceMapInput, map as SourceMapInput],
+              () => null,
+            );
+
+            // Set the sourcemap root to the workspace root. This is needed since we set a virtual path as root.
+            remappedMap.sourceRoot = serverOptions.workspaceRoot + '/';
 
             return {
               ...result,
-              map: null,
-              code: transformedCode,
+              map: remappedMap as (typeof result)['map'],
             };
           };
 

tests/legacy-cli/e2e/tests/vite/ssr-error-stack.ts

@@ -0,0 +1,38 @@
+import { doesNotMatch, match } from 'node:assert';
+import { killAllProcesses, ng } from '../../utils/process';
+import { appendToFile, rimraf } from '../../utils/fs';
+import { ngServe, useSha } from '../../utils/project';
+import { installWorkspacePackages } from '../../utils/packages';
+
+export default async function () {
+  // Forcibly remove in case another test doesn't clean itself up.
+  await rimraf('node_modules/@angular/ssr');
+  await ng('add', '@angular/ssr', '--skip-confirmation');
+  await useSha();
+  await installWorkspacePackages();
+
+  try {
+    // Create Error.
+    await appendToFile(
+      'src/app/app.component.ts',
+      `
+      (() => {
+        throw new Error('something happened!');
+      })();
+      `,
+    );
+
+    const port = await ngServe();
+    const response = await fetch(`http://localhost:${port}/`);
+    const text = await response.text();
+
+    // The error is also sent in the browser, so we don't need to scrap the stderr.
+    match(
+      text,
+      /something happened.+at eval \(.+\/e2e-test[\\\/]test-project[\\\/]src[\\\/]app[\\\/]app\.component\.ts:\d+:\d+\)/,
+    );
+    doesNotMatch(text, /vite-root/);
+  } finally {
+    await killAllProcesses();
+  }
+}