From 8c379269e0e96a958d7bc93cf065a0ff36be9601 Mon Sep 17 00:00:00 2001 From: Alan Agius Date: Thu, 13 Jun 2024 09:47:40 +0000 Subject: [PATCH] fix(@angular/build): do not reference sourcemaps in web workers and global stylesheet bundles when hidden setting is enabled This commit addresses an issue where sourcemaps in web workers and global stylesheets were referenced despite the hidden setting being enabled. Closes: #27833 --- .../tests/options/sourcemap_spec.ts | 68 +++++++++++++++++++ .../tools/esbuild/angular/compiler-plugin.ts | 13 ++-- .../tools/esbuild/compiler-plugin-options.ts | 2 +- .../build/src/tools/esbuild/global-styles.ts | 2 +- 4 files changed, 79 insertions(+), 6 deletions(-) diff --git a/packages/angular/build/src/builders/application/tests/options/sourcemap_spec.ts b/packages/angular/build/src/builders/application/tests/options/sourcemap_spec.ts index 890e959b5102..ddd36477bd99 100644 --- a/packages/angular/build/src/builders/application/tests/options/sourcemap_spec.ts +++ b/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, diff --git a/packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts b/packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts index 31d2ea7ed4cb..b84a2fe6c423 100644 --- a/packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts +++ b/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, diff --git a/packages/angular/build/src/tools/esbuild/compiler-plugin-options.ts b/packages/angular/build/src/tools/esbuild/compiler-plugin-options.ts index f762c0e90371..37d9721064ea 100644 --- a/packages/angular/build/src/tools/esbuild/compiler-plugin-options.ts +++ b/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, diff --git a/packages/angular/build/src/tools/esbuild/global-styles.ts b/packages/angular/build/src/tools/esbuild/global-styles.ts index 6a89232c90c1..bb6b095419ea 100644 --- a/packages/angular/build/src/tools/esbuild/global-styles.ts +++ b/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,