From e47ae67f86749d872953d2fc1221e2d9c5128ecb Mon Sep 17 00:00:00 2001
From: JiaLiPassion <JiaLi.Passion@gmail.com>
Date: Wed, 13 Sep 2023 14:23:04 +0800
Subject: [PATCH] refactor: import zone.js/testing instead of
 zone-testing-bundle (#2163)

Close https://github.com/thymikee/jest-preset-angular/issues/2162

From zone.js 0.13.2, the original
`zone.js/bundles/zone-testing-bundle.js` is not easily import and will
eventually removed from zone.js 0.14.0.

The proper way to import zone.js and zone.js/testing is

```
import 'zone.js';
import 'zone.js/testing';
```

So this PR use this way to import zone.js related bundles.
---
 setup-jest.js                                  |  3 ++-
 setup-jest.mjs                                 |  3 ++-
 src/config/setup-jest.spec.ts                  | 18 ++++++++++--------
 .../version-11.0/guides/angular-13+.md         |  3 ++-
 .../version-11.1/guides/angular-13+.md         |  3 ++-
 5 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/setup-jest.js b/setup-jest.js
index fe9ba09569..b77f79a883 100644
--- a/setup-jest.js
+++ b/setup-jest.js
@@ -1,4 +1,5 @@
-require('zone.js/bundles/zone-testing-bundle.umd');
+require('zone.js');
+require('zone.js/testing');
 const { getTestBed } = require('@angular/core/testing');
 const {
   BrowserDynamicTestingModule,
diff --git a/setup-jest.mjs b/setup-jest.mjs
index 7f7e451745..63247e4597 100644
--- a/setup-jest.mjs
+++ b/setup-jest.mjs
@@ -1,4 +1,5 @@
-import 'zone.js/fesm2015/zone-testing-bundle.min.js';
+import 'zone.js';
+import 'zone.js/testing';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
diff --git a/src/config/setup-jest.spec.ts b/src/config/setup-jest.spec.ts
index d8a04cc0b9..3f6e92c2f7 100644
--- a/src/config/setup-jest.spec.ts
+++ b/src/config/setup-jest.spec.ts
@@ -1,20 +1,20 @@
 const mockInitTestEnvironment = jest.fn();
-const mockUmdZoneJs = jest.fn();
-const mockEsmZoneJs = jest.fn();
+const mockZoneJs = jest.fn();
+const mockZoneJsTesting = jest.fn();
 const mockGetTestBed = jest.fn(() => {
   return {
     initTestEnvironment: mockInitTestEnvironment,
   };
 });
-jest.mock('zone.js/bundles/zone-testing-bundle.umd', () => {
-  const mockedResult = mockUmdZoneJs();
+jest.mock('zone.js', () => {
+  const mockedResult = mockZoneJs();
 
   return {
     mockedResult,
   };
 });
-jest.mock('zone.js/fesm2015/zone-testing-bundle.min.js', () => {
-  const mockedResult = mockEsmZoneJs();
+jest.mock('zone.js/testing', () => {
+  const mockedResult = mockZoneJsTesting();
 
   return {
     mockedResult,
@@ -66,7 +66,8 @@ describe('setup-jest', () => {
 
       await import('../../setup-jest');
 
-      expect(mockUmdZoneJs).toHaveBeenCalled();
+      expect(mockZoneJs).toHaveBeenCalled();
+      expect(mockZoneJsTesting).toHaveBeenCalled();
       assertOnInitTestEnv();
       expect(mockInitTestEnvironment.mock.calls[0][2]).toEqual({
         teardown: {
@@ -94,7 +95,8 @@ describe('setup-jest', () => {
 
       await import('../../setup-jest.mjs');
 
-      expect(mockEsmZoneJs).toHaveBeenCalled();
+      expect(mockZoneJs).toHaveBeenCalled();
+      expect(mockZoneJsTesting).toHaveBeenCalled();
       assertOnInitTestEnv();
       expect(mockInitTestEnvironment.mock.calls[0][2]).toEqual({
         teardown: {
diff --git a/website/versioned_docs/version-11.0/guides/angular-13+.md b/website/versioned_docs/version-11.0/guides/angular-13+.md
index e3a4cf434f..7763f6621f 100644
--- a/website/versioned_docs/version-11.0/guides/angular-13+.md
+++ b/website/versioned_docs/version-11.0/guides/angular-13+.md
@@ -88,7 +88,8 @@ The `jest-preset-angular/setup-jest` file doesn't work with ESM, because it uses
 
 ```ts
 // setup-jest.ts
-import 'zone.js/fesm2015/zone-testing-bundle.min.js';
+import 'zone.js';
+import 'zone.js/testing';
 import './jest-global-mocks';
 
 import { getTestBed } from '@angular/core/testing';
diff --git a/website/versioned_docs/version-11.1/guides/angular-13+.md b/website/versioned_docs/version-11.1/guides/angular-13+.md
index 9fa2d9feb0..2888768fa1 100644
--- a/website/versioned_docs/version-11.1/guides/angular-13+.md
+++ b/website/versioned_docs/version-11.1/guides/angular-13+.md
@@ -88,7 +88,8 @@ The `jest-preset-angular/setup-jest` file doesn't work with ESM, because it uses
 
 ```ts
 // setup-jest.ts
-import 'zone.js/fesm2015/zone-testing-bundle.min.js';
+import 'zone.js';
+import 'zone.js/testing';
 import './jest-global-mocks';
 
 import { getTestBed } from '@angular/core/testing';