vitest-dev / vitest-dev/vitest

Inspecting import values in debuggers returns Uncaught ReferenceError: importName is not defined

Open
#9,159 5 comments 1 reaction 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 am trying to use the debugger while running vitest specs. Breakpoints work, and debugging of variables defined inside the file work as well.

test repro: https://github.com/DamianPereira/vitest-debugger-repro

Image

You can see that the source map failed to account for the imports, and shows them as __vite_ssr_import_0__

This also happens with webstorm js debugger.

Reproduction

Clone the repo, and run

yarn vitest --inspect-brk ----no-file-parallelism

Then open chrome://inspect in any chrome based browser. And inspect the file. Add a breakpoint where it shows in the screenshot, and try debugging the value.

The repo contains a brand new npm create vite@latest + yarn add -D vitest with nothing else.

System Info
System:
    OS: macOS 15.6.1
    CPU: (14) arm64 Apple M4 Max
    Memory: 2.19 GB / 36.00 GB
    Shell: 4.2.1 - /opt/homebrew/bin/fish
  Binaries:
    Node: 20.19.4 - /Users/damian/.local/share/mise/installs/node/20.19.4/bin/node
    Yarn: 1.22.22 - /Users/damian/.local/share/mise/installs/node/20.19.4/bin/yarn
    npm: 10.8.2 - /Users/damian/.local/share/mise/installs/node/20.19.4/bin/npm
    pnpm: 10.12.4 - /Users/damian/.local/share/mise/installs/node/20.19.4/bin/pnpm
  Browsers:
    Chrome: 142.0.7444.176
    Firefox: 145.0.2
    Firefox Developer Edition: 146.0
    Safari: 18.6
  npmPackages:
    vite: ^7.2.4 => 7.2.6
    vitest: ^4.0.15 => 4.0.15
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

Clone the linked vitest-debugger-repro repository and run yarn vitest --inspect-brk ----no-file-parallelism. Inspect the generated debugger source map around imported values and compare the displayed __vite_ssr_import_0__ names with the original imports. Done means imported values can be inspected without an importName ReferenceError in Chrome DevTools and the WebStorm JavaScript debugger.

Written by the indexing model from the issue text.

Assessment

Tech stack
node.js, typescript, vite
Domain
devtools, testing-qa
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.