analogjs · brandonroberts · Dec 8, 2025 · Dec 7, 2025 · yjaaidi · Dec 7, 2025
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -86,6 +86,8 @@ jobs:
           cache-dependency-path: '**/pnpm-lock.yaml'
       - name: Install
         run: pnpm install --frozen-lockfile --prefer-offline
+      - name: Install Playwright
+        run: pnpm playwright install --with-deps chromium --only-shell
       - name: Test
         run: pnpm test
 

diff --git a/libs/my-package/project.json b/libs/my-package/project.json
@@ -25,8 +25,10 @@
       }
     },
     "test": {
-      "executor": "@nx/vite:test",
-      "outputs": ["{projectRoot}/coverage"]
+      "command": "vitest",
+      "options": {
+        "cwd": "libs/my-package"
+      }
     },
     "lint": {
       "executor": "@nx/eslint:lint"

diff --git a/libs/my-package/src/lib/my-package/reset-test-bed-between-tests/README.md b/libs/my-package/src/lib/my-package/reset-test-bed-between-tests/README.md
@@ -0,0 +1,9 @@
+If TestBed is not reset between tests, the following error would be thrown on second test of the second test file:
+
+> Error: Cannot configure the test module when the test module has already been instantiated.
+> Make sure you are not using `inject` before `TestBed.configureTestingModule`.
+
+That is why we have two test files:
+
+- `reset-test-bed-between-tests-1.spec.ts`
+- `reset-test-bed-between-tests-2.spec.ts`
diff --git a/...ge/src/lib/my-package/reset-test-bed-between-tests/reset-test-bed-between-tests-1.spec.ts b/...ge/src/lib/my-package/reset-test-bed-between-tests/reset-test-bed-between-tests-1.spec.ts
@@ -0,0 +1,13 @@
+import { InjectionToken } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { expect, test } from 'vitest';
+
+test.each([1, 2])('provide and inject dependency #%s', () => {
+  const MY_TOKEN = new InjectionToken<string>('MY_TOKEN');
+
+  TestBed.configureTestingModule({
+    providers: [{ provide: MY_TOKEN, useValue: 'My Value' }],
+  });
+
+  expect(TestBed.inject(MY_TOKEN)).toBe('My Value');
+});
diff --git a/...ge/src/lib/my-package/reset-test-bed-between-tests/reset-test-bed-between-tests-2.spec.ts b/...ge/src/lib/my-package/reset-test-bed-between-tests/reset-test-bed-between-tests-2.spec.ts
@@ -0,0 +1,13 @@
+import { InjectionToken } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { expect, test } from 'vitest';
+
+test.each([1, 2])('provide and inject dependency #%s', () => {
+  const MY_TOKEN = new InjectionToken<string>('MY_TOKEN');
+
+  TestBed.configureTestingModule({
+    providers: [{ provide: MY_TOKEN, useValue: 'My Value' }],
+  });
+
+  expect(TestBed.inject(MY_TOKEN)).toBe('My Value');
+});
diff --git a/libs/my-package/src/test-setup.ts b/libs/my-package/src/test-setup.ts
@@ -1,15 +1,3 @@
-import '@analogjs/vitest-angular/setup-zone';
+import { setupTestBed } from '@analogjs/vitest-angular/setup-testbed';
 
-/**
- * Initialize TestBed for all tests inside of content
- */
-import { TestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting,
-} from '@angular/platform-browser-dynamic/testing';
-
-TestBed.initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting(),
-);
+setupTestBed();
diff --git a/libs/my-package/vite.config.ts b/libs/my-package/vite.config.ts
@@ -3,6 +3,7 @@ import angular from '@analogjs/vite-plugin-angular';
 import { nxCopyAssetsPlugin } from '@nx/vite/plugins/nx-copy-assets.plugin';
 import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import { defineConfig } from 'vite';
+import { playwright } from '@vitest/browser-playwright';
 
 export default defineConfig(({ mode }) => ({
   root: __dirname,
@@ -40,6 +41,18 @@ export default defineConfig(({ mode }) => ({
     setupFiles: ['src/test-setup.ts'],
     include: ['**/*.spec.ts'],
     cacheDir: '../../node_modules/.vitest',
+    isolate: false,
+    /**
+     * Make sure that all tests are running in the same worker,
+     * so that we can test the reset of the TestBed between tests
+     * @see src/lib/my-package/reset-test-bed-between-tests/README.md
+     */
+    maxWorkers: 1,
+    browser: {
+      enabled: true,
+      provider: playwright(),
+      instances: [{ browser: 'chromium' }],
+    },
   },
   define: {
     'import.meta.vitest': mode !== 'production',

diff --git a/package.json b/package.json
@@ -111,6 +111,7 @@
     "@nx/storybook": "22.0.2",
     "@nx/vite": "22.0.2",
     "@nx/web": "22.0.2",
+    "@oxc-project/runtime": "^0.99.0",
     "@playwright/test": "^1.54.2",
     "@schematics/angular": "21.0.0",
     "@semantic-release/changelog": "^6.0.3",
@@ -136,6 +137,7 @@
     "@typescript-eslint/eslint-plugin": "7.18.0",
     "@typescript-eslint/parser": "7.18.0",
     "@typescript-eslint/utils": "^8.13.0",
+    "@vitest/browser-playwright": "^4.0.15",
     "@vitest/coverage-v8": "^3.0.5",
     "@vitest/ui": "^3.0.0",
     "all-contributors-cli": "^6.24.0",
@@ -152,7 +154,6 @@
     "eslint-plugin-playwright": "^1.8.3",
     "execa": "^9.6.0",
     "fast-glob": "^3.2.12",
-    "tinyglobby": "^0.2.14",
     "fd-package-json": "^2.0.0",
     "find-up": "^7.0.0",
     "fs-extra": "^11.1.1",
@@ -172,7 +173,6 @@
     "ng-packagr": "21.0.0",
     "nitropack": "^2.11.0",
     "nx": "22.0.2",
-    "@oxc-project/runtime": "^0.99.0",
     "playwright": "^1.49.1",
     "postcss": "^8.4.21",
     "postcss-import": "~16.1.1",
@@ -192,6 +192,7 @@
     "start-server-and-test": "^1.15.4",
     "storybook": "^10.0.0",
     "tailwindcss": "^3.1.0",
+    "tinyglobby": "^0.2.14",
     "ts-dedent": "^2.0.0",
     "ts-jest": "29.4.0",
     "ts-morph": "^26.0.0",
@@ -202,7 +203,7 @@
     "vite-plugin-inspect": "11.3.2",
     "vite-tsconfig-paths": "4.2.0",
     "vitefu": "^1.1.1",
-    "vitest": "^4.0.0",
+    "vitest": "^4.0.15",
     "webpack-bundle-analyzer": "^4.7.0",
     "xmlbuilder2": "^4.0.1"
   },

diff --git a/packages/vitest-angular/setup-testbed.ts b/packages/vitest-angular/setup-testbed.ts
@@ -9,9 +9,6 @@ import {
 } from '@angular/platform-browser/testing';
 import { afterEach, beforeEach } from 'vitest';
 
-beforeEach(getCleanupHook(false));
-afterEach(getCleanupHook(true));
-
 const ANGULAR_TESTBED_SETUP = Symbol.for('testbed-setup');
 
 type TestBedSetupOptions = {
@@ -22,6 +19,9 @@ type TestBedSetupOptions = {
 export function setupTestBed(
   options: TestBedSetupOptions = { zoneless: true, providers: [] },
 ) {
+  beforeEach(getCleanupHook(false));
+  afterEach(getCleanupHook(true));
+
   if (!(globalThis as any)[ANGULAR_TESTBED_SETUP]) {
     (globalThis as any)[ANGULAR_TESTBED_SETUP] = true;