From 791ef809d8dfec8fde844e916973a05b2eb5c9d9 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 (cherry picked from commit 8c379269e0e96a958d7bc93cf065a0ff36be9601) --- .../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 41874f4a62fb..3b2294dcbc5f 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'), ); @@ -532,8 +537,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,