From 1aeeb7da099ff90126b0844eb6c8ed21d174e617 Mon Sep 17 00:00:00 2001
From: Charles Lyding <19598772+clydin@users.noreply.github.com>
Date: Thu, 8 Feb 2024 11:22:52 -0500
Subject: [PATCH] fix(@angular-devkit/build-angular): ensure WebWorker main
 entry is used in output code

Previously, the check for determining the correct main entry point for a bundled web worker
found in application code could incorrectly use a lazy chunk created from the worker bundling
under certain situations. The check has now been made more strict to mitigate these situations.
---
 .../behavior/web-workers-application_spec.ts  | 60 +++++++++++++++++++
 .../tools/esbuild/angular/compiler-plugin.ts  |  2 +-
 2 files changed, 61 insertions(+), 1 deletion(-)
 create mode 100644 packages/angular_devkit/build_angular/src/builders/application/tests/behavior/web-workers-application_spec.ts

diff --git a/packages/angular_devkit/build_angular/src/builders/application/tests/behavior/web-workers-application_spec.ts b/packages/angular_devkit/build_angular/src/builders/application/tests/behavior/web-workers-application_spec.ts
new file mode 100644
index 000000000000..284479cbc151
--- /dev/null
+++ b/packages/angular_devkit/build_angular/src/builders/application/tests/behavior/web-workers-application_spec.ts
@@ -0,0 +1,60 @@
+/**
+ * @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 { buildApplication } from '../../index';
+import { APPLICATION_BUILDER_INFO, BASE_OPTIONS, describeBuilder } from '../setup';
+
+/**
+ * A regular expression used to check if a built worker is correctly referenced in application code.
+ */
+const REFERENCED_WORKER_REGEXP =
+  /new Worker\(new URL\("worker-[A-Z0-9]{8}\.js", import\.meta\.url\)/;
+
+describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
+  describe('Behavior: "Bundles web worker files within application code"', () => {
+    it('should use the worker entry point when worker lazy chunks are present', async () => {
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+      });
+
+      const workerCodeFile = `
+        addEventListener('message', () => {
+          import('./extra').then((m) => console.log(m.default));
+        });
+      `;
+      const extraWorkerCodeFile = `
+        export default 'WORKER FILE';
+      `;
+
+      // Create a worker file
+      await harness.writeFile('src/app/worker.ts', workerCodeFile);
+      await harness.writeFile('src/app/extra.ts', extraWorkerCodeFile);
+
+      // Create app component that uses the directive
+      await harness.writeFile(
+        'src/app/app.component.ts',
+        `
+        import { Component } from '@angular/core'
+        @Component({
+          selector: 'app-root',
+          template: '<h1>Worker Test</h1>',
+        })
+        export class AppComponent {
+          worker = new Worker(new URL('./worker', import.meta.url), { type: 'module' });
+        }
+      `,
+      );
+
+      const { result } = await harness.executeOnce();
+      expect(result?.success).toBeTrue();
+
+      // Ensure built worker is referenced in the application code
+      harness.expectFile('dist/browser/main.js').content.toMatch(REFERENCED_WORKER_REGEXP);
+    });
+  });
+});
diff --git a/packages/angular_devkit/build_angular/src/tools/esbuild/angular/compiler-plugin.ts b/packages/angular_devkit/build_angular/src/tools/esbuild/angular/compiler-plugin.ts
index 1239cc0b1ab4..6750765e02ec 100644
--- a/packages/angular_devkit/build_angular/src/tools/esbuild/angular/compiler-plugin.ts
+++ b/packages/angular_devkit/build_angular/src/tools/esbuild/angular/compiler-plugin.ts
@@ -216,7 +216,7 @@ export function createCompilerPlugin(
 
             // Return bundled worker file entry name to be used in the built output
             const workerCodeFile = workerResult.outputFiles.find((file) =>
-              file.path.endsWith('.js'),
+              /^worker-[A-Z0-9]{8}.[cm]?js$/.test(path.basename(file.path)),
             );
             assert(workerCodeFile, 'Web Worker bundled code file should always be present.');
             const workerCodePath = path.relative(