Bug: Running tests with both script setup and script error

[VividLemon]

Describe the bug

I recently posted the same issue vuejs/test-utils#1617 , but they believe it's a vitest issue, and probably is.
Simply put, an import declared inside of script setup causes tests to fail when attempted to be accessed in regular script. As the other member had mentioned in the other github issue, it causes an issue with webpack but not vite. I assume this is a feature that it works fine for Vite, and should work fine with Vitest as well.

Reproduction

https://stackblitz.com/edit/vitejs-vite-suaivh?file=src/components/HelloWorld.vue

Create a component
Create <script setup lang="ts">
import {defineComponent} from 'vue' // for example, this is where I had my issue
then create normal <script lang="ts">
then attempt to export default defineComponent({}) // This is completely fine when building, and running in dev, however, the test will always fail. ReferenceError: Cannot access 'vite_ssr_import_1' before initialization

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (12) x64 AMD Ryzen 5 3600X 6-Core Processor
    Memory: 9.06 GB / 15.93 GB
  Binaries:
    Node: 16.14.2 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.15 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.11.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (98.0.1108.43)
    Internet Explorer: 11.0.22000.120

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.

[sheremet-va]

I don't want to point you to another project, but I will 😄

Vitest doesn't process files, Vite does. Vitest only runs it. Please, open an issue in Vite repo. Issue is with how Vite processes SSR transforms: https://stackblitz.com/edit/vitejs-vite-kp6pw1?file=transform.mjs

For web:

import { defineComponent as _defineComponent } from "/node_modules/vue/dist/vue.runtime.esm-bundler.js";
const __default__ = defineComponent({});
import { defineComponent } from "/node_modules/vue/dist/vue.runtime.esm-bundler.js";

When processed with SSR transformer:

const __vite_ssr_import_1__ = await __vite_ssr_import__("/node_modules/vue/dist/vue.runtime.esm-bundler.js");

const __default__ = __vite_ssr_import_2__.defineComponent({});
const __vite_ssr_import_2__ = await __vite_ssr_import__("/node_modules/vue/dist/vue.runtime.esm-bundler.js");

__default__ is trying to use the wrong import. You can point Vite team to this repro. (you need to run node transform.mjs)

[nika-d]

Hello,

here comes a superficial description of how this error may look like, and a dangerous temporary workaround until Vite issue 10444 is fixed .

I post this just to help people find the reason for their "failing" tests quicker. This is not any solution to the underlying Vite issue.

Our dependencies:
Vite 3.2.4
Vitest 0.25.2

// defining file TermineFactory
export class TermineFactory {
	public static create(

// Using file

import { TermineFactory } from './TermineFactory'
// ... later in same file
    return TermineFactory.create(

Vitest output:

Test Files  39 passed (39)
      Tests  109 passed (109)
   Start at  11:42:52
   Duration  11.56s (transform 13.62s, setup 3ms, collect 76.10s, tests 3.68s)

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Errors ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯

Vitest caught 4 unhandled errors during the test run.
This might cause false positive tests. Resolve unhandled errors to make sure your tests are not affected.

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Rejection ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
TypeError: Cannot read properties of undefined (reading 'create')
...
     47|     return TermineFactory.create(
       |                           ^

The error may also have a different look:

// When we reassign the static function to an exported variable in the defining file like this:

export const createTermine = TermineFactory.create


// ... and refactor the usages 

return createTermine(

... then the error changes to

Vitest caught 4 unhandled errors during the test run.
This might cause false positive tests. Resolve unhandled errors to make sure your tests are not affected.

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Unhandled Rejection ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯
TypeError: createTermine is not a function
...
     47|     return createTermine(
       |            ^

Workaround is to use the vitest parameter --dangerouslyIgnoreUnhandledErrors for running our tests. This keeps Vitest exit code 1 for expect-failures, but ignores the type errors and makes our npm test script end with 0 when all expect-statements succeed.

Happy hacking! 🙂

[sheremet-va]

The hoisting was fixed some time ago, so I think this issue can be closed.