Vitest bails with an odd "TypeError: re.test is not a function"

[WebMechanic]

Hello,

I'm using Vitest, Vue Testutils and happy-dom (all latest) for my unit and component tests.
Some component tests don't run and bail right at the start with a TypeError: re.test is not a function.

I'm wondering if anybody else faced this issue which seems rather odd.
It took ma a while to find that this TypeError only shows up when SFC components

• also import a Vuetensils component such as VBtn or VTooltip
• contain a <style scoped>

If I i.e. comment out the VBtn import and tag the tests work... for what's left of my own code.
The style issue is bizzare but less of an issue 'cos we primarily use global Stylesheets and some CSS-Modules. Scoped styles are usually only present during prototyping a new component.

Any ideas welcome incl. if the "culprit" is know to be some other lib.

Thanks!

[AustinGil]

This is very unusual. I can't see how it could be related to Vuetensils components given the error, but the debugging suggests that it may be. Could you create a reproduction in Stackblitz or Codesandbox so I can get a better idea?

[WebMechanic]

Thanks, @AustinGil. I'll try to whip something up by the weekend.
Will a test repo be fine, too? Stackblitz was a little pita to find a proper starter pack.

[AustinGil]

Yeah, anything with a minimal recreation of the problem will be great. Sometimes that can even help isolate the actual issue.

[WebMechanic]

just FYI: I created a minimal project containing two of the SFCs in question and of course it all worked well 🙄
and now the digging begins for a lovely edge case...

Since in the original project Vitest also bails for several components not using Vuetensils but containing non empty <style> elements, the origin might well be located in the CSS pipeline caused by a PostCSS or Rollup plugin, so: 🤷‍♂️
However, they all die with the same error re.test is not a function which for now lead me to some chunk in Vitest's node_module/vite folder.

I now need to add the other dependencies one by one to see when it breaks. There are several so it might take a while 'til I come back to this to report my findings.

[AustinGil]

Alright, well it seems like a helpful, albeit annoying step. Sounds like you've got a good idea around the empty style blocks and a rollup plugin. I have some experience with transpiler plugins, but probably not enough to be helpful here.

[WebMechanic]

I guess I found the source...

When I copied the various config setting over, it broke with Vitest's css directive being a glob pattern and not a RexEg -- hence the not a function failure...

I somehow overlooked the fact that your components also contain "style" elements, which is why the tests for our components that don't have any also failed.

Thanks & have a nice day.

[AustinGil]

Yeah, that's a tricky one. Probably would have taken me longer to sort out.

Glad you got to the bottom of it and took the time to update here :)