From 4e42261609b0a77712695dcafe1eb53f0018fb6d Mon Sep 17 00:00:00 2001
From: Charles Lyding <19598772+clydin@users.noreply.github.com>
Date: Thu, 10 Nov 2022 12:53:53 -0500
Subject: [PATCH] refactor(@angular-devkit/build-angular): move internal bundle
 output processing into esbuild bundle helper

The path adjustments and initial file logic for index file generation are now centralized in the esbuild
build helper function. This allows usage of the functionality in multiple areas of the build system.
---
 .../src/builders/browser-esbuild/esbuild.ts   | 33 ++++++++++++++++--
 .../src/builders/browser-esbuild/index.ts     | 34 ++++---------------
 .../builders/browser-esbuild/stylesheets.ts   |  3 +-
 3 files changed, 38 insertions(+), 32 deletions(-)

diff --git a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/esbuild.ts b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/esbuild.ts
index a7d5dc9fd726..984c145117c4 100644
--- a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/esbuild.ts
+++ b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/esbuild.ts
@@ -17,6 +17,8 @@ import {
   build,
   formatMessages,
 } from 'esbuild';
+import { basename, extname, relative } from 'node:path';
+import { FileInfo } from '../../utils/index-file/augment-index-html';
 
 /**
  * Determines if an unknown value is an esbuild BuildFailure error object thrown by esbuild.
@@ -39,16 +41,20 @@ export function isEsBuildFailure(value: unknown): value is BuildFailure {
  * warnings and errors for the attempted build.
  */
 export async function bundle(
+  workspaceRoot: string,
   optionsOrInvalidate: BuildOptions | BuildInvalidate,
 ): Promise<
-  (BuildResult & { outputFiles: OutputFile[] }) | (BuildFailure & { outputFiles?: never })
+  | (BuildResult & { outputFiles: OutputFile[]; initialFiles: FileInfo[] })
+  | (BuildFailure & { outputFiles?: never })
 > {
+  let result;
   try {
     if (typeof optionsOrInvalidate === 'function') {
-      return (await optionsOrInvalidate()) as BuildResult & { outputFiles: OutputFile[] };
+      result = (await optionsOrInvalidate()) as BuildResult & { outputFiles: OutputFile[] };
     } else {
-      return await build({
+      result = await build({
         ...optionsOrInvalidate,
+        metafile: true,
         write: false,
       });
     }
@@ -60,6 +66,27 @@ export async function bundle(
       throw failure;
     }
   }
+
+  const initialFiles: FileInfo[] = [];
+  for (const outputFile of result.outputFiles) {
+    // Entries in the metafile are relative to the `absWorkingDir` option which is set to the workspaceRoot
+    const relativeFilePath = relative(workspaceRoot, outputFile.path);
+    const entryPoint = result.metafile?.outputs[relativeFilePath]?.entryPoint;
+
+    outputFile.path = relativeFilePath;
+
+    if (entryPoint) {
+      // An entryPoint value indicates an initial file
+      initialFiles.push({
+        file: outputFile.path,
+        // The first part of the filename is the name of file (e.g., "polyfills" for "polyfills.7S5G3MDY.js")
+        name: basename(outputFile.path).split('.')[0],
+        extension: extname(outputFile.path),
+      });
+    }
+  }
+
+  return { ...result, initialFiles };
 }
 
 export async function logMessages(
diff --git a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/index.ts b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/index.ts
index 01a14ec5e551..ce186616098b 100644
--- a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/index.ts
+++ b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/index.ts
@@ -92,7 +92,10 @@ async function execute(
 
   const [codeResults, styleResults] = await Promise.all([
     // Execute esbuild to bundle the application code
-    bundle(rebuildState?.codeRebuild ?? createCodeBundleOptions(options, target, codeBundleCache)),
+    bundle(
+      workspaceRoot,
+      rebuildState?.codeRebuild ?? createCodeBundleOptions(options, target, codeBundleCache),
+    ),
     // Execute esbuild to bundle the global stylesheets
     bundleGlobalStylesheets(options, target),
   ]);
@@ -108,31 +111,9 @@ async function execute(
     return new ExecutionResult(false, rebuildState?.codeRebuild, codeBundleCache);
   }
 
-  // Structure the code bundling output files
-  const initialFiles: FileInfo[] = [];
-  const outputFiles: OutputFile[] = [];
-  for (const outputFile of codeResults.outputFiles) {
-    // Entries in the metafile are relative to the `absWorkingDir` option which is set to the workspaceRoot
-    const relativeFilePath = path.relative(workspaceRoot, outputFile.path);
-    const entryPoint = codeResults.metafile?.outputs[relativeFilePath]?.entryPoint;
-
-    outputFile.path = relativeFilePath;
-
-    if (entryPoint) {
-      // An entryPoint value indicates an initial file
-      initialFiles.push({
-        file: outputFile.path,
-        // The first part of the filename is the name of file (e.g., "polyfills" for "polyfills.7S5G3MDY.js")
-        name: path.basename(outputFile.path).split('.')[0],
-        extension: path.extname(outputFile.path),
-      });
-    }
-    outputFiles.push(outputFile);
-  }
-
-  // Add global stylesheets output files
-  outputFiles.push(...styleResults.outputFiles);
-  initialFiles.push(...styleResults.initialFiles);
+  // Combine the bundling output files
+  const initialFiles: FileInfo[] = [...codeResults.initialFiles, ...styleResults.initialFiles];
+  const outputFiles: OutputFile[] = [...codeResults.outputFiles, ...styleResults.outputFiles];
 
   // Return if the global stylesheet bundling has errors
   if (styleResults.errors.length) {
@@ -268,7 +249,6 @@ function createCodeBundleOptions(
     conditions: ['es2020', 'es2015', 'module'],
     resolveExtensions: ['.ts', '.tsx', '.mjs', '.js'],
     logLevel: options.verbose ? 'debug' : 'silent',
-    metafile: true,
     minify: optimizationOptions.scripts,
     pure: ['forwardRef'],
     outdir: workspaceRoot,
diff --git a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/stylesheets.ts b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/stylesheets.ts
index 7c58c8aaaaa4..b51eaf5b12eb 100644
--- a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/stylesheets.ts
+++ b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/stylesheets.ts
@@ -28,7 +28,7 @@ async function bundleStylesheet(
   options: BundleStylesheetOptions,
 ) {
   // Execute esbuild
-  const result = await bundle({
+  const result = await bundle(options.workspaceRoot, {
     ...entry,
     absWorkingDir: options.workspaceRoot,
     bundle: true,
@@ -58,7 +58,6 @@ async function bundleStylesheet(
   const resourceFiles: OutputFile[] = [];
   if (result.outputFiles) {
     for (const outputFile of result.outputFiles) {
-      outputFile.path = path.relative(options.workspaceRoot, outputFile.path);
       const filename = path.basename(outputFile.path);
       if (filename.endsWith('.css')) {
         outputPath = outputFile.path;