Bug: test throws when using resolve.mainFields: module in vitest with Invalid VNode type: Symbol(Fragment)

[liujiayi666]

Describe the bug

can't get v-for elements and got warn!!
[Vue warn]: Invalid VNode type: Symbol(Fragment) (symbol) at <XXXPage ref="VTU_COMPONENT" > at <VTUROOT> [Vue warn]: Invalid VNode type: Symbol(Fragment) (symbol) at <XXX ref="VTU_COMPONENT" > at <VTUROOT>

To Reproduce

Expected behavior

Related information:

• @vue/test-utils version: 2.x.x
• Vue version: 3.2.37
• vitest version: 0.24.5
• @vue/test-utils version: 2.2.1
• node version: v16.15.1
• npm (or yarn) version:8.11.0

Additional context

[cexbrayat]

Hi @liujiayi666

Can you provide us a small repro online using https://stackblitz.com/edit/vitest-dev-vitest-qoiwy3?file=package.json&initialPath=__vitest__ ?

[liujiayi666]

Hi,@cexbrayat, I added mainFields: ['module'] to vitest.config.ts, and the v-for elements is null.
https://stackblitz.com/edit/vitest-dev-vitest-vbsf44?file=test%2Fimports.test.ts

[cexbrayat]

If you use mainFields: ['module'] I think that you get 2 instances of Vue, hence the error about Symbol (as Symbol needs to be unique).

See vuejs/core#2600

I don't think we can do much about this. What are you trying to achieve with mainFields: ['module'] in your tests?

As you can see in the issue I linked, this comment vuejs/core#2064 (comment) mentions that you can dedupe Vue. You can try that if you want to keep mainFields.

[liujiayi666]

@cexbrayat I need to use a Private repository， but got error SyntaxError: Cannot use import statement outside a module. Thank you for your answer