Using Quasar plugins with vitest in vue 3 (compat) breaks tests

346 views Asked by At

I have a Vue 3 project created with Vite and using @vue/compat. I recently added Quasar using the Vite Plugin. For my tests, I use Vitest and Vue Testing Library.

Everything works as intended, except when I add Quasar plugins, like Notify.

I then get this error when running any test:

SyntaxError: Unexpected error
 ❯ Object.createCompileError ../node_modules/@intlify/message-compiler/dist/message-compiler.cjs.js:58:19
 ❯ createI18nError ../node_modules/vue-i18n/dist/vue-i18n.cjs.js:79:21
 ❯ Proxy.beforeCreate ../node_modules/vue-i18n/dist/vue-i18n.cjs.js:1576:23
 ❯ callWithErrorHandling ../node_modules/@vue/compat/dist/vue.cjs.js:1929:36
 ❯ callWithAsyncErrorHandling ../node_modules/@vue/compat/dist/vue.cjs.js:1938:21
 ❯ callWithAsyncErrorHandling ../node_modules/@vue/compat/dist/vue.cjs.js:1948:21
 ❯ callHook$1 ../node_modules/@vue/compat/dist/vue.cjs.js:6501:5
 ❯ applyOptions ../node_modules/@vue/compat/dist/vue.cjs.js:6254:9
 ❯ finishComponentSetup ../node_modules/@vue/compat/dist/vue.cjs.js:10909:9
 ❯ handleSetupResult ../node_modules/@vue/compat/dist/vue.cjs.js:10837:5

If I remove the plugin from both the vite.config.ts and the render function of the test, everything works.

I created a repository to easily reproduce the issue: https://github.com/Jeffs24/stackoverflow-quasar-problem

Did I initialized the Quasar plugin the wrong way? Is there something to add to the Vitest config?

I tried a lot of things in the last couple hours and nothing worked:

  • Updating the version of the problematic plugins
  • Mocking the plugin, which is not a solution in itself
  • Reinstalling Quasar as per the doc
  • Removing vue-i18n
  • A lot of things that I forgot
0

There are 0 answers