From fc928f6386061f34f7cd3ef6bb6d25aa4a33a800 Mon Sep 17 00:00:00 2001
From: Alan Agius <alanagius@google.com>
Date: Thu, 27 Jun 2024 11:42:44 +0000
Subject: [PATCH] fix(@angular/build): correctly name entry points to match
 budgets

This commit addresses an issue where some lazy entry points were not name correctly to align with specified budgets.

Closes: #27936
(cherry picked from commit f3ba2080f970d82def0d89cf8c2c1b96781dfbb9)
---
 .../tests/options/bundle-budgets_spec.ts      | 33 +++++++++++++++++++
 .../build/src/tools/esbuild/budget-stats.ts   |  6 ++--
 .../angular/build/src/tools/esbuild/utils.ts  | 11 +++++--
 3 files changed, 43 insertions(+), 7 deletions(-)

diff --git a/packages/angular/build/src/builders/application/tests/options/bundle-budgets_spec.ts b/packages/angular/build/src/builders/application/tests/options/bundle-budgets_spec.ts
index 51098df61ccf..4614d5a5788e 100644
--- a/packages/angular/build/src/builders/application/tests/options/bundle-budgets_spec.ts
+++ b/packages/angular/build/src/builders/application/tests/options/bundle-budgets_spec.ts
@@ -93,6 +93,39 @@ describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
       );
     });
 
+    it(`should not warn when non-injected style is not within the baseline threshold`, async () => {
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        optimization: false,
+        styles: [
+          {
+            input: 'src/lazy-styles.css',
+            inject: false,
+            bundleName: 'lazy-styles',
+          },
+        ],
+        budgets: [
+          { type: Type.Bundle, name: 'lazy-styles', warning: '1kb', error: '1kb', baseline: '2kb' },
+        ],
+      });
+
+      await harness.writeFile(
+        'src/lazy-styles.css',
+        `
+          .foo { color: green; padding: 1px; }
+        `.repeat(24),
+      );
+
+      const { result, logs } = await harness.executeOnce();
+      expect(result?.success).toBeTrue();
+      expect(logs).not.toContain(
+        jasmine.objectContaining<logging.LogEntry>({
+          level: 'warn',
+          message: jasmine.stringMatching('lazy-styles failed to meet minimum budget'),
+        }),
+      );
+    });
+
     CSS_EXTENSIONS.forEach((ext) => {
       it(`shows warnings for large component ${ext} when using 'anyComponentStyle' when AOT`, async () => {
         const cssContent = `
diff --git a/packages/angular/build/src/tools/esbuild/budget-stats.ts b/packages/angular/build/src/tools/esbuild/budget-stats.ts
index 09b61711e56a..981d9bf5604b 100644
--- a/packages/angular/build/src/tools/esbuild/budget-stats.ts
+++ b/packages/angular/build/src/tools/esbuild/budget-stats.ts
@@ -7,9 +7,9 @@
  */
 
 import type { Metafile } from 'esbuild';
-import { basename } from 'node:path';
 import type { BudgetStats } from '../../utils/bundle-calculator';
 import type { InitialFileRecord } from './bundler-context';
+import { getEntryPointName } from './utils';
 
 /**
  * Generates a bundle budget calculator compatible stats object that provides
@@ -43,9 +43,7 @@ export function generateBudgetStats(
     let name = initialRecord?.name;
     if (name === undefined && entry.entryPoint) {
       // For non-initial lazy modules, convert the entry point file into a Webpack compatible name
-      name = basename(entry.entryPoint)
-        .replace(/\.[cm]?[jt]s$/, '')
-        .replace(/[\\/.]/g, '-');
+      name = getEntryPointName(entry.entryPoint);
     }
 
     stats.chunks.push({
diff --git a/packages/angular/build/src/tools/esbuild/utils.ts b/packages/angular/build/src/tools/esbuild/utils.ts
index d4f71ca52241..b8e4b1c8bb5f 100644
--- a/packages/angular/build/src/tools/esbuild/utils.ts
+++ b/packages/angular/build/src/tools/esbuild/utils.ts
@@ -66,9 +66,7 @@ export function logBuildStats(
 
     let name = initial.get(file)?.name;
     if (name === undefined && output.entryPoint) {
-      name = basename(output.entryPoint)
-        .replace(/\.[cm]?[jt]s$/, '')
-        .replace(/[\\/.]/g, '-');
+      name = getEntryPointName(output.entryPoint);
     }
 
     const stat: BundleStats = {
@@ -496,3 +494,10 @@ export function isZonelessApp(polyfills: string[] | undefined): boolean {
   // TODO: Instead, we should rely on the presence of zone.js in the polyfills build metadata.
   return !polyfills?.some((p) => p === 'zone.js' || /\.[mc]?[jt]s$/.test(p));
 }
+
+export function getEntryPointName(entryPoint: string): string {
+  return basename(entryPoint)
+    .replace(/(.*:)/, '') // global:bundle.css  -> bundle.css
+    .replace(/\.[cm]?[jt]s$/, '')
+    .replace(/[\\/.]/g, '-');
+}