From bf3be56db8b3a1ef8a0e02dfc5de914651d8ec93 Mon Sep 17 00:00:00 2001
From: Alan Agius <alanagius@google.com>
Date: Fri, 3 Feb 2023 09:11:55 +0000
Subject: [PATCH] fix(@angular-devkit/build-angular): load polyfills and
 runtime as scripts instead of modules

This commit updates changes the way polyfills and runtime are loaded from modules to scripts. This is required as otherwise Jasmine will be loaded prior to Zone.js which causes clock patching not to work.

Closes #24651
---
 .../webpack/plugins/karma/karma-context.html  |  4 +-
 .../webpack/plugins/karma/karma-debug.html    |  4 +-
 .../e2e/tests/test/test-jasmine-clock.ts      | 37 +++++++++++++++++++
 3 files changed, 41 insertions(+), 4 deletions(-)
 create mode 100644 tests/legacy-cli/e2e/tests/test/test-jasmine-clock.ts

diff --git a/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-context.html b/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-context.html
index 2b3902b5848d..64139997b25a 100644
--- a/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-context.html
+++ b/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-context.html
@@ -30,8 +30,8 @@
       // All served files with the latest timestamps
       %MAPPINGS%
     </script>
-    <script src="_karma_webpack_/runtime.js" crossorigin="anonymous" type="module"></script>
-    <script src="_karma_webpack_/polyfills.js" crossorigin="anonymous" type="module"></script>
+    <script src="_karma_webpack_/runtime.js" crossorigin="anonymous"></script>
+    <script src="_karma_webpack_/polyfills.js" crossorigin="anonymous"></script>
     <!-- Dynamically replaced with <script> tags -->
     %SCRIPTS%
     <script src="_karma_webpack_/scripts.js" crossorigin="anonymous" defer></script>
diff --git a/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-debug.html b/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-debug.html
index 0f13c288aa6a..f348daf64352 100644
--- a/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-debug.html
+++ b/packages/angular_devkit/build_angular/src/webpack/plugins/karma/karma-debug.html
@@ -32,8 +32,8 @@
       // All served files with the latest timestamps
       %MAPPINGS%
     </script>
-    <script src="_karma_webpack_/runtime.js" crossorigin="anonymous" type="module"></script>
-    <script src="_karma_webpack_/polyfills.js" crossorigin="anonymous" type="module"></script>
+    <script src="_karma_webpack_/runtime.js" crossorigin="anonymous"></script>
+    <script src="_karma_webpack_/polyfills.js" crossorigin="anonymous"></script>
     <!-- Dynamically replaced with <script> tags -->
     %SCRIPTS%
     <script src="_karma_webpack_/scripts.js" crossorigin="anonymous" defer></script>
diff --git a/tests/legacy-cli/e2e/tests/test/test-jasmine-clock.ts b/tests/legacy-cli/e2e/tests/test/test-jasmine-clock.ts
new file mode 100644
index 000000000000..fa24baaf5b27
--- /dev/null
+++ b/tests/legacy-cli/e2e/tests/test/test-jasmine-clock.ts
@@ -0,0 +1,37 @@
+import { ng } from '../../utils/process';
+import { writeFile } from '../../utils/fs';
+
+export default async function () {
+  await writeFile(
+    'src/app/app.component.spec.ts',
+    `
+  import { TestBed } from '@angular/core/testing';
+  import { RouterTestingModule } from '@angular/router/testing';
+  import { AppComponent } from './app.component';
+
+  describe('AppComponent', () => {
+    beforeAll(() => {
+      jasmine.clock().install();
+    });
+
+    afterAll(() => {
+      jasmine.clock().uninstall();
+    });
+
+    beforeEach(async () => {
+      await TestBed.configureTestingModule({
+        imports: [RouterTestingModule],
+        declarations: [AppComponent],
+      }).compileComponents();
+    });
+
+    it('should create the app', () => {
+      const fixture = TestBed.createComponent(AppComponent);
+      expect(fixture.componentInstance).toBeTruthy();
+    });
+  });
+  `,
+  );
+
+  await ng('test', '--watch=false');
+}