feat: allow configuring destroyAfterEach for setup test env (#1469)

Closes #1466

Author: ahnpnl

.eslintrc.js

@@ -4,6 +4,9 @@ module.exports = {
     es6: true,
     'jest/globals': true,
   },
+  globals: {
+    globalThis: false,
+  },
   parserOptions: {
     ecmaVersion: 2020,
     sourceType: 'module',

setup-jest.js

@@ -1,9 +1,17 @@
 require('zone.js/bundles/zone-testing-bundle.umd');
-
 const { getTestBed } = require('@angular/core/testing');
 const {
   BrowserDynamicTestingModule,
   platformBrowserDynamicTesting,
 } = require('@angular/platform-browser-dynamic/testing');
 
-getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+const configuredDestroyAfterEach = globalThis.ngJest?.destroyAfterEach;
+if (configuredDestroyAfterEach !== undefined) {
+  getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
+    teardown: {
+      destroyAfterEach: configuredDestroyAfterEach,
+    },
+  });
+} else {
+  getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+}

setup-jest.mjs

@@ -2,4 +2,13 @@ import 'zone.js/fesm2015/zone-testing-bundle.min.js';
 import { getTestBed } from '@angular/core/testing';
 import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
 
-getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+const configuredDestroyAfterEach = globalThis.ngJest?.destroyAfterEach;
+if (configuredDestroyAfterEach !== undefined) {
+  getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting(), {
+    teardown: {
+      destroyAfterEach: configuredDestroyAfterEach,
+    },
+  });
+} else {
+  getTestBed().initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting());
+}

src/config/setup-jest.spec.ts

@@ -46,20 +46,30 @@ describe('setup-jest', () => {
   };
 
   beforeEach(() => {
+    delete globalThis.ngJest;
     jest.clearAllMocks();
   });
 
   test('should initialize test environment with getTestBed() and initTestEnvironment() for CJS setup-jest', async () => {
+    globalThis.ngJest = {
+      destroyAfterEach: true,
+    };
     await import('../../setup-jest');
 
     expect(mockUmdZoneJs).toHaveBeenCalled();
     assertOnInitTestEnv();
+    expect(mockInitTestEnvironment.mock.calls[0][2]).toEqual({
+      teardown: {
+        destroyAfterEach: true,
+      },
+    });
   });
 
   test('should initialize test environment with getTestBed() and initTestEnvironment() for ESM setup-jest', async () => {
     await import('../../setup-jest.mjs');
 
     expect(mockEsmZoneJs).toHaveBeenCalled();
     assertOnInitTestEnv();
+    expect(mockInitTestEnvironment.mock.calls[0][2]).toBeUndefined();
   });
 });

src/global.d.ts

@@ -4,7 +4,8 @@ declare global {
   var ngJest: {
     skipNgcc?: boolean;
     tsconfig?: string;
-  };
+    destroyAfterEach?: boolean;
+  } | undefined;
 }
 
 export {}

tsconfig.json

@@ -17,5 +17,6 @@
     "module": "CommonJS",
     "lib": ["esnext", "dom"],
     "types": ["node", "jest"]
-  }
+  },
+  "files": ["src/global.d.ts"]
 }

website/docs/getting-started/test-environment.md

@@ -9,3 +9,19 @@ we also make sure Jest test methods run in Zone context. Then we initialize the
 
 While `setup-jest.js` above is for running Jest with **CommonJS** mode, we also provide [`setup-jest.mjs`](https://github.com/thymikee/jest-preset-angular/blob/main/setup-jest.mjs)
 to run with **ESM** mode.
+
+### Configure test environment
+
+When creating Angular test environment with `TestBed`, it is possible to specify the behavior of `teardown` via `globalThis` in the Jest setup file.
+For example:
+
+```ts
+// setup-test.ts
+globalThis.ngJest = {
+  destroyAfterEach: true,
+};
+
+import 'jest-preset-angular/setup-jest';
+```
+
+`jest-preset-angular` will look at `globalThis.ngJest` and pass the correct `destroyAfterEach` to `TestBed`.