Error: Vitest failed to access its internal state.

[ronny-lark]

Summary

All of a sudden, with no real changes to my app, I've started getting this error:

runtime.js:4 Error reading preview.js:

Error: Vitest failed to access its internal state.

One of the following is possible:
- "vitest" is imported directly without running "vitest" command
- "vitest" is imported inside "globalSetup" (to fix this, use "setupFiles" instead, because "globalSetup" runs in a different context)
- Otherwise, it might be a Vitest bug. Please report it to https://github.com/vitest-dev/vitest/issues

My app uses vitest for testing, but I am not loading vitest anywhere in Storybook not do I have any reason to. I have no idea why this could be happening.

Additional information

Storybook version: 7.4.5.
Vitest version: 0.33.0.
Vite version: 4.3.9.
React version: 18.2.0.

// main.ts
import type { StorybookConfig } from '@storybook/react-vite';
import { mergeConfig } from 'vite';
import path from 'path';

const config: StorybookConfig = {
  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
  addons: [
    '@storybook/addon-links',
    '@storybook/addon-essentials',
    '@storybook/addon-interactions',
    '@storybook/addon-styling',
    'storybook-addon-react-router-v6',
  ],
  framework: {
    name: '@storybook/react-vite',
    options: {},
  },
  docs: {
    autodocs: 'tag',
  },
  async viteFinal(config) {
    return mergeConfig(config, {
      resolve: {
        alias: {
          './flows.api': './flows.api.mocks',
          './folders.api': './folders.api.mocks',
          './labels.api': './labels.api.mocks',
        },
      },
    });
  },
};
export default config;

// preview.ts
import { Preview } from '@storybook/react';
import '../src/index.css';
import { globalDecorators } from './decorators';
import { enableMapSet } from 'immer';

enableMapSet();

const preview: Preview = {
  parameters: {
    actions: { argTypesRegex: '^on[A-Z].*' },
    controls: {
      matchers: {
        color: /(background|color)$/i,
        date: /Date$/,
      },
    },
  },
};

export const decorators = [...globalDecorators];

export default preview;

Create a reproduction

No response

[WhereJuly]

This presumably is because your main application code imports parts of Vitest and executes these while at the same time running outside Vitest context. It may happen as well if recently installed npm packages contain such imports. E.g. if some npm package imports Vitest in its code and exports that module in its index.js

Just context search from 'vitest' (mind quotes type) in your non-tests source code or node_modules and see what modules it brings.

Meanwhile if the npm package having the module does not re-export the module importing vitest (in its entry point, e.g. in dist/index.js) the error is gone. Yet you still can import the module in your tests providing the path to it manually, as it would not be found with autocomplete.

Hope this helps as there is no answer from vitest guys.

vitejs/vite#13474 (comment)
vitest-dev/vitest#5190 (comment)

[Max-Makhrov]

from "vitest" in my case

[prajwalkulkarni]

@WhereJuly not re-exporting the module did the trick. However, I'm trying to build a utility package that aggregates multiple other packages (like eslint, prettier etc.) and I'll have to be exporting vitest, react testing library etc from my package. Since this issue mainly revolved around exporting the module from the entry file, I did try bundling my package by exporting these modules(export * as Vitest from 'vitest', export * as rtl from "@testing-library/react") from a non-main file (let's call it exportbundle.js. But I'm still facing the same error. Any idea how do I go about this?

[snowwolfjay]

vite.config.ts/vitest.config.ts any import * from vitest

[quantuminformation]

getting this today in my remix app

[nikolailehbrink]

Hi @quantuminformation,
I had the same problem about now, but then realized, that my test files were underneath the route folder, that's why Remix wanted to pick the tests up and the error occured. Maybe it helps 🙂