fix(@angular/build): do not reference sourcemaps in web workers and global stylesheet bundles when hidden setting is enabled

packages/angular/build/src/builders/application/tests/options/sourcemap_spec.ts

@@ -124,6 +124,74 @@ describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
       harness.expectFile('dist/browser/main.js.map').content.toContain('/common/index.ts');
     });
 
+    it(`should not include 'sourceMappingURL' sourcemaps when hidden suboption is true`, async () => {
+      await harness.writeFile('src/styles.css', `div { flex: 1 }`);
+
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        styles: ['src/styles.css'],
+        sourceMap: { scripts: true, styles: true, hidden: true },
+      });
+
+      const { result } = await harness.executeOnce();
+
+      expect(result?.success).toBeTrue();
+
+      harness.expectFile('dist/browser/main.js.map').toExist();
+      harness
+        .expectFile('dist/browser/main.js')
+        .content.not.toContain('sourceMappingURL=main.js.map');
+
+      harness.expectFile('dist/browser/styles.css.map').toExist();
+      harness
+        .expectFile('dist/browser/styles.css')
+        .content.not.toContain('sourceMappingURL=styles.css.map');
+    });
+
+    it(`should include 'sourceMappingURL' sourcemaps when hidden suboption is false`, async () => {
+      await harness.writeFile('src/styles.css', `div { flex: 1 }`);
+
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        styles: ['src/styles.css'],
+        sourceMap: { scripts: true, styles: true, hidden: false },
+      });
+
+      const { result } = await harness.executeOnce();
+
+      expect(result?.success).toBeTrue();
+
+      harness.expectFile('dist/browser/main.js.map').toExist();
+      harness.expectFile('dist/browser/main.js').content.toContain('sourceMappingURL=main.js.map');
+
+      harness.expectFile('dist/browser/styles.css.map').toExist();
+      harness
+        .expectFile('dist/browser/styles.css')
+        .content.toContain('sourceMappingURL=styles.css.map');
+    });
+
+    it(`should include 'sourceMappingURL' sourcemaps when hidden suboption is not set`, async () => {
+      await harness.writeFile('src/styles.css', `div { flex: 1 }`);
+
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        styles: ['src/styles.css'],
+        sourceMap: { scripts: true, styles: true },
+      });
+
+      const { result } = await harness.executeOnce();
+
+      expect(result?.success).toBeTrue();
+
+      harness.expectFile('dist/browser/main.js.map').toExist();
+      harness.expectFile('dist/browser/main.js').content.toContain('sourceMappingURL=main.js.map');
+
+      harness.expectFile('dist/browser/styles.css.map').toExist();
+      harness
+        .expectFile('dist/browser/styles.css')
+        .content.toContain('sourceMappingURL=styles.css.map');
+    });
+
     it('should add "x_google_ignoreList" extension to script sourcemap files when true', async () => {
       harness.useTarget('build', {
         ...BASE_OPTIONS,

packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts

@@ -36,7 +36,7 @@ import { setupJitPluginCallbacks } from './jit-plugin-callbacks';
 import { SourceFileCache } from './source-file-cache';
 
 export interface CompilerPluginOptions {
-  sourcemap: boolean;
+  sourcemap: boolean | 'external';
   tsconfig: string;
   jit?: boolean;
   /** Skip TypeScript compilation setup. This is useful to re-use the TypeScript compilation from another plugin. */
@@ -71,7 +71,12 @@ export function createCompilerPlugin(
         );
       }
       const javascriptTransformer = new JavaScriptTransformer(
-        pluginOptions,
+        {
+          sourcemap: !!pluginOptions.sourcemap,
+          thirdPartySourcemaps: pluginOptions.thirdPartySourcemaps,
+          advancedOptimizations: pluginOptions.advancedOptimizations,
+          jit: pluginOptions.jit,
+        },
         maxWorkers,
         cacheStore?.createCache('jstransformer'),
       );
@@ -541,8 +546,8 @@ function createCompilerOptionsTransformer(
     return {
       ...compilerOptions,
       noEmitOnError: false,
-      inlineSources: pluginOptions.sourcemap,
-      inlineSourceMap: pluginOptions.sourcemap,
+      inlineSources: !!pluginOptions.sourcemap,
+      inlineSourceMap: !!pluginOptions.sourcemap,
       mapRoot: undefined,
       sourceRoot: undefined,
       preserveSymlinks,

packages/angular/build/src/tools/esbuild/compiler-plugin-options.ts

@@ -42,7 +42,7 @@ export function createCompilerPluginOptions(
   return {
     // JS/TS options
     pluginOptions: {
-      sourcemap: !!sourcemapOptions.scripts,
+      sourcemap: !!sourcemapOptions.scripts && (sourcemapOptions.hidden ? 'external' : true),
       thirdPartySourcemaps: sourcemapOptions.vendor,
       tsconfig,
       jit,

packages/angular/build/src/tools/esbuild/global-styles.ts

@@ -52,7 +52,7 @@ export function createGlobalStylesBundleOptions(
         workspaceRoot,
         optimization: !!optimizationOptions.styles.minify,
         inlineFonts: !!optimizationOptions.fonts.inline,
-        sourcemap: !!sourcemapOptions.styles,
+        sourcemap: !!sourcemapOptions.styles && (sourcemapOptions.hidden ? 'external' : true),
         preserveSymlinks,
         target,
         externalDependencies,