Addon Test: Add Vitest 3 support

code/.storybook/vitest.config.ts

@@ -24,7 +24,7 @@ export default mergeConfig(
     plugins: [
       import('@storybook/experimental-addon-test/vitest-plugin').then(({ storybookTest }) =>
         storybookTest({
-          configDir: process.cwd(),
+          configDir: __dirname,
           tags: {
             include: ['vitest'],
           },
@@ -47,10 +47,14 @@ export default mergeConfig(
       testNamePattern: /^(?!.*(UseState)).*$/,
       browser: {
         enabled: true,
-        name: 'chromium',
         provider: 'playwright',
         headless: true,
         screenshotFailures: false,
+        instances: [
+          {
+            browser: 'chromium',
+          },
+        ],
       },
       setupFiles: ['./storybook.setup.ts'],
       environment: 'happy-dom',

code/addons/test/package.json

@@ -95,8 +95,8 @@
     "@types/istanbul-lib-report": "^3.0.3",
     "@types/node": "^22.0.0",
     "@types/semver": "^7",
-    "@vitest/browser": "^2.1.3",
-    "@vitest/runner": "^2.1.3",
+    "@vitest/browser": "3.0.0-beta.4",
+    "@vitest/runner": "3.0.0-beta.4",
     "ansi-to-html": "^0.7.2",
     "boxen": "^8.0.1",
     "es-toolkit": "^1.22.0",
@@ -116,13 +116,13 @@
     "tree-kill": "^1.2.2",
     "ts-dedent": "^2.2.0",
     "typescript": "^5.3.2",
-    "vitest": "^2.1.3"
+    "vitest": "3.0.0-beta.4"
   },
   "peerDependencies": {
-    "@vitest/browser": "^2.1.1",
-    "@vitest/runner": "^2.1.1",
+    "@vitest/browser": "^2.1.1 || ^3.0.0",
+    "@vitest/runner": "^2.1.1 || ^3.0.0",
     "storybook": "workspace:^",
-    "vitest": "^2.1.1"
+    "vitest": "^2.1.1 || ^3.0.0"
   },
   "peerDependenciesMeta": {
     "@vitest/browser": {

code/addons/test/src/node/reporter.ts

@@ -1,5 +1,6 @@
 import type { TaskState } from 'vitest';
 import type { Vitest } from 'vitest/node';
+import { version as vitestVersion } from 'vitest/node';
 import { type Reporter } from 'vitest/reporters';
 
 import type {
@@ -12,6 +13,7 @@ import type { API_StatusUpdate } from '@storybook/types';
 
 import type { Suite } from '@vitest/runner';
 import { throttle } from 'es-toolkit';
+import { satisfies } from 'semver';
 
 import { TEST_PROVIDER_ID } from '../constants';
 import type { TestManager } from './test-manager';
@@ -50,8 +52,11 @@ const statusMap: Record<TaskState, TestStatus> = {
   run: 'pending',
   skip: 'skipped',
   todo: 'skipped',
+  queued: 'pending',
 };
 
+const isVitest3OrLater = satisfies(vitestVersion, '>=3.0.0-beta.3', { includePrerelease: true });
+
 export class StorybookReporter implements Reporter {
   testStatusData: API_StatusUpdate = {};
 
@@ -213,7 +218,10 @@ export class StorybookReporter implements Reporter {
   async onFinished() {
     const unhandledErrors = this.ctx.state.getUnhandledErrors();
 
-    const isCancelled = this.ctx.isCancelling;
+    const isCancelled = isVitest3OrLater
+      ? this.testManager.vitestManager.isCancelling
+      : // @ts-expect-error isCancelling is private in Vitest 3.
+        this.ctx.isCancelling;
     const report = await this.getProgressReport(Date.now());
 
     const testSuiteFailures = report.details.testResults.filter(

code/addons/test/src/node/test-manager.test.ts

@@ -19,20 +19,21 @@ const vitest = vi.hoisted(() => ({
   cancelCurrentRun: vi.fn(),
   globTestSpecs: vi.fn(),
   getModuleProjects: vi.fn(() => []),
-  configOverride: {
-    actualTestNamePattern: undefined,
-    get testNamePattern() {
-      return this.actualTestNamePattern!;
+  setGlobalTestNamePattern: setTestNamePattern,
+  vite: {
+    watcher: {
+      removeAllListeners: vi.fn(),
+      on: vi.fn(),
     },
-    set testNamePattern(value: string) {
-      setTestNamePattern(value);
-      // @ts-expect-error Ignore for testing
-      this.actualTestNamePattern = value;
+    moduleGraph: {
+      getModulesByFile: () => [],
+      invalidateModule: vi.fn(),
     },
   },
 }));
 
-vi.mock('vitest/node', () => ({
+vi.mock('vitest/node', async (importOriginal) => ({
+  ...(await importOriginal()),
   createVitest: vi.fn(() => Promise.resolve(vitest)),
 }));
 const createVitest = vi.mocked(actualCreateVitest);
@@ -85,7 +86,7 @@ const options: ConstructorParameters<typeof TestManager>[1] = {
   onReady: vi.fn(),
 };
 
-describe('TestManager', () => {
+describe('TestManager', { timeout: 2000 }, () => {
   it('should create a vitest instance', async () => {
     new TestManager(mockChannel, options);
     await new Promise((r) => setTimeout(r, 1000));
@@ -137,7 +138,6 @@ describe('TestManager', () => {
       storyIds: [],
     });
     expect(vitest.runFiles).toHaveBeenCalledWith([], true);
-    expect(vitest.configOverride.testNamePattern).toBeUndefined();
 
     await testManager.handleRunRequest({
       providerId: TEST_PROVIDER_ID,