fix(@angular/build): ensure input index HTML file triggers rebuilds when changed

 When using the `application` builder, the input index HTML file will now
 correctly trigger rebuilds of the application. The rebuilds are not currently
 optimized for the input index file only case but changes will be reflected
 in the output.

(cherry picked from commit 2708b18)

Author: clydin

packages/angular/build/src/builders/application/execute-build.ts

@@ -141,6 +141,11 @@ export async function executeBuild(
     );
   }
 
+  // Watch input index HTML file if configured
+  if (options.indexHtmlOptions) {
+    executionResult.extraWatchFiles.push(options.indexHtmlOptions.input);
+  }
+
   // Perform i18n translation inlining if enabled
   if (i18nOptions.shouldInline) {
     const result = await inlineI18n(options, executionResult, initialFiles);

packages/angular/build/src/builders/application/tests/behavior/rebuild-index-html_spec.ts

@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import { concatMap, count, take, timeout } from 'rxjs';
+import { buildApplication } from '../../index';
+import { APPLICATION_BUILDER_INFO, BASE_OPTIONS, describeBuilder } from '../setup';
+
+/**
+ * Maximum time in milliseconds for single build/rebuild
+ * This accounts for CI variability.
+ */
+export const BUILD_TIMEOUT = 30_000;
+
+describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
+  describe('Behavior: "Rebuilds when input index HTML changes"', () => {
+    beforeEach(async () => {
+      // Application code is not needed for styles tests
+      await harness.writeFile('src/main.ts', 'console.log("TEST");');
+    });
+
+    it('rebuilds output index HTML', async () => {
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        watch: true,
+      });
+
+      const buildCount = await harness
+        .execute({ outputLogsOnFailure: false })
+        .pipe(
+          timeout(30000),
+          concatMap(async ({ result }, index) => {
+            switch (index) {
+              case 0:
+                expect(result?.success).toBe(true);
+                harness.expectFile('dist/browser/index.html').content.toContain('charset="utf-8"');
+
+                await harness.modifyFile('src/index.html', (content) =>
+                  content.replace('charset="utf-8"', 'abc'),
+                );
+                break;
+              case 1:
+                expect(result?.success).toBe(true);
+                harness
+                  .expectFile('dist/browser/index.html')
+                  .content.not.toContain('charset="utf-8"');
+
+                await harness.modifyFile('src/index.html', (content) =>
+                  content.replace('abc', 'charset="utf-8"'),
+                );
+                break;
+              case 2:
+                expect(result?.success).toBe(true);
+                harness.expectFile('dist/browser/index.html').content.toContain('charset="utf-8"');
+
+                break;
+            }
+          }),
+          take(3),
+          count(),
+        )
+        .toPromise();
+
+      expect(buildCount).toBe(3);
+    });
+  });
+});

packages/angular/build/src/tools/esbuild/bundler-execution-result.ts

@@ -42,6 +42,7 @@ export class ExecutionResult {
   warnings: (Message | PartialMessage)[] = [];
   logs: string[] = [];
   externalMetadata?: ExternalResultMetadata;
+  extraWatchFiles: string[] = [];
 
   constructor(
     private rebuildContexts: BundlerContext[],
@@ -138,7 +139,7 @@ export class ExecutionResult {
       files.push(...this.codeBundleCache.loadResultCache.watchFiles);
     }
 
-    return files;
+    return files.concat(this.extraWatchFiles);
   }
 
   createRebuildState(fileChanges: ChangedFiles): RebuildState {