chore: update to vitest v0.24.3

We were blocked by vitest-dev/vitest#1978
but thanks to @sheremet-va help (see vitest-dev/vitest#1978 (comment))
we now have a way to use the latest vitest releases.

It turns out that we needed to:
- alias `@vue/compat` to its ESM bundle
- use `Vue.extend` instead of `extend` in the `compat.spec.ts` file, as `extend` is not a named export

Author: cexbrayat

package.json

@@ -55,7 +55,7 @@
     "unplugin-vue-components": "0.22.8",
     "vite": "3.1.8",
     "vitepress": "0.22.4",
-    "vitest": "0.22.1",
+    "vitest": "0.24.3",
     "vue": "3.2.41",
     "vue-class-component": "8.0.0-rc.1",
     "vue-router": "4.1.5",

pnpm-lock.yaml

@@ -3,7 +3,7 @@ import * as mockVue from '@vue/compat'
 import { mount } from '../../src'
 
 vi.mock('vue', () => mockVue)
-const { configureCompat, extend, defineComponent, h } = mockVue
+const { configureCompat, defineComponent, h } = mockVue
 // @ts-expect-error @vue/compat does not expose default export in types
 const Vue = mockVue.default
 
@@ -46,7 +46,7 @@ describe('@vue/compat build', () => {
   it('finds components declared with legacy Vue.extend', () => {
     configureCompat({ MODE: 3, GLOBAL_EXTEND: 'suppress-warning' })
 
-    const LegacyComponent = extend({
+    const LegacyComponent = Vue.extend({
       template: '<div>LEGACY</div>'
     })
 
@@ -97,7 +97,7 @@ describe('@vue/compat build', () => {
       COMPONENT_FUNCTIONAL: 'suppress-warning'
     })
 
-    const Component = extend({
+    const Component = Vue.extend({
       functional: true,
       render: () => h('div', 'test')
     })
@@ -112,7 +112,7 @@ describe('@vue/compat build', () => {
       GLOBAL_EXTEND: 'suppress-warning'
     })
 
-    const Foo = extend({
+    const Foo = Vue.extend({
       name: 'Foo',
       template: '<div>original</div>'
     })
@@ -147,7 +147,7 @@ describe('@vue/compat build', () => {
       template: '<div>original</div>'
     }
 
-    const FooStub = extend({ template: '<div>stubbed</div>' })
+    const FooStub = Vue.extend({ template: '<div>stubbed</div>' })
 
     const Component = {
       components: { NamedAsNotFoo: Foo },
@@ -172,7 +172,7 @@ describe('@vue/compat build', () => {
       GLOBAL_MOUNT: 'suppress-warning'
     })
 
-    const Component = extend({
+    const Component = Vue.extend({
       data() {
         return { foo: 'bar' }
       },

tests/features/compat.spec.ts

@@ -35,6 +35,9 @@ export default defineConfig({
   },
   resolve: {
     extensions: ['.vue', '.js', '.json', '.jsx', '.ts', '.tsx', '.node'],
-    dedupe: ['vue', '@vue/compat']
+    dedupe: ['vue', '@vue/compat'],
+    alias: {
+      '@vue/compat': '@vue/compat/dist/vue.esm-bundler.js'
+    }
   }
 })