vitest-dev / vitest-dev/vitest

Presence of storybook causes `vi.useFakeTimers();` to break.

Open
#9,487 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

pending triage
Dominant language
TypeScript
Stars
17.1k
Forks
2k
Avg merge
1d 22h
Merged PRs (30d)
94

Description

Describe the bug

I have a test that looks like this:

import { it, vi, expect } from "vitest";

vi.useFakeTimers();
async function waitTenSeconds() {
  await new Promise((res) => {
    setTimeout(res, 10000);
  });

  return 99;
}
it("timer test", async () => {
  const prom = waitTenSeconds();

  vi.runAllTimers();

  const result = await prom;

  expect(result).toBe(99);
});

This test passes by it self.

If I install storybook@10.0.11 then this test will now error.

 ❯ src/timer.test.ts (1 test | 1 failed) 2ms
   × timer test 2ms

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Tests 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

 FAIL  src/timer.test.ts > timer test
Error: Test timed out in 5000ms.
If this is a long-running test, pass a timeout value as the last argument or configure it globally with "testTimeout".
 ❯ src/timer.test.ts:11:4
      9|   return 99;
     10| }
     11| it.only("timer test", async () => {
       |    ^
     12|   const prom = waitTenSeconds();
     13| 

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯


 Test Files  1 failed (1)
      Tests  1 failed (1)
   Start at  14:58:22
   Duration  92ms (transform 13ms, setup 0ms, import 19ms, tests 2ms, environment 0ms)

Note that this test fails immediately, it doesn't wait 5000ms for this error to occur.

If you remove vi.runAllTimers then the test hangs indefinitely.

There are no warnings when you run npm i.

Other dependencies that will also cause this error:

    "eslint-plugin-storybook": "^10.1.11",
    "@storybook/addon-docs": "^10.1.11",
    "@storybook/vue3-vite": "^10.1.11",
    "storybook": "^10.1.11",
    "storybook-vue3-router": "^7.0.0",
Reproduction

https://github.com/dwjohnston/vitest-4-storybook-issue

System Info
System:
    OS: macOS 15.6.1
    CPU: (12) arm64 Apple M4 Pro
    Memory: 92.88 MB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.21.1 - /Users/davidjohnston/.nvm/versions/node/v22.21.1/bin/node
    npm: 11.6.2 - /Users/davidjohnston/.nvm/versions/node/v22.21.1/bin/npm
    pnpm: 10.16.1 - /Users/davidjohnston/Library/pnpm/pnpm
    bun: 1.2.21 - /Users/davidjohnston/.bun/bin/bun
  Browsers:
    Brave Browser: 143.1.85.120
    Chrome: 144.0.7559.59
    Edge: 144.0.3719.82
    Safari: 18.6
  npmPackages:
    vite: ^7.2.4 => 7.3.1 
    vitest: 4.0.17 => 4.0.17
Used Package Manager

npm

Validations

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the failure in the linked repository, starting with src/timer.test.ts and the listed Storybook dependencies. Compare the test behavior with and without Storybook installed, focusing on vi.useFakeTimers() and vi.runAllTimers(). Done means the timer test resolves and passes when the reported Storybook packages are present.

Written by the indexing model from the issue text.

Assessment

Tech stack
storybook, typescript
Domain
testing-qa, tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.