Describe the bug

Happened while writing tests for a Vite plugin load hook, using fs.readFileSync.

I was reading a Vue basic component, and the <template> turned into an HTML fragment, from a console.log in the Vitest UI.

This is the output when displaying it in Vitest UI:

Running the same readFileSync from Node:

Where Vitest UI turns it into an HTML fragment:

Let me know if you need any further explanations.

Also, if you can give me guidelines, I can most likely help to solve this via a PR!

Thanks again for Vitest! 🙏

Reproduction

https://stackblitz.com/edit/vitest-dev-vitest-zhysj6?file=test/basic.test.ts&initialPath=__vitest__/

Run test:run to see proper output in console.

Run test:ui to see wrong output in side-panel of the test.

System Info

System:
    OS: macOS 13.4
    CPU: (10) arm64 Apple M1 Pro
    Memory: 163.50 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.16.0 - ~/.volta/tools/image/node/18.16.0/bin/node
    Yarn: 1.22.19 - ~/.volta/tools/image/yarn/1.22.19/bin/yarn
    npm: 9.5.1 - ~/.volta/tools/image/node/18.16.0/bin/npm
    pnpm: 8.6.1 - ~/.volta/bin/pnpm
  Browsers:
    Chrome: 115.0.5790.170
    Safari: 16.5

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.