chore(vitest): move vue config into vitest project (#5546)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>

Author: OrbisK

.github/workflows/module.yml

@@ -52,9 +52,6 @@ jobs:
       - name: Test
         run: pnpm run test run
 
-      - name: Test (vue)
-        run: pnpm run test:vue run
-
       - name: Build
         run: pnpm run build
 

.github/workflows/release.yml

@@ -45,9 +45,6 @@ jobs:
       - name: Test
         run: pnpm run test run
 
-      - name: Test (vue)
-        run: pnpm run test:vue run
-
       - name: Publish
         run: ./scripts/release.sh
         env:

package.json

@@ -115,7 +115,8 @@
     "lint:fix": "eslint . --fix",
     "typecheck": "vue-tsc --noEmit && nuxt typecheck playgrounds/nuxt && nuxt typecheck docs && cd playgrounds/vue && vue-tsc --noEmit",
     "test": "vitest",
-    "test:vue": "vitest -c vitest.vue.config.ts",
+    "test:vue": "vitest --project vue",
+    "test:nuxt": "vitest --project nuxt",
     "release": "release-it"
   },
   "dependencies": {

vitest.config.ts

@@ -1,18 +1,86 @@
 import { fileURLToPath } from 'node:url'
-import { defineVitestConfig } from '@nuxt/test-utils/config'
+import { defineVitestProject } from '@nuxt/test-utils/config'
+import { defineConfig } from 'vitest/config'
+import vue from '@vitejs/plugin-vue'
+import ui from './src/vite'
+import { resolve } from 'pathe'
+import { glob } from 'tinyglobby'
 
-export default defineVitestConfig({
+const components = await glob('./src/runtime/components/*.vue', { absolute: true })
+const vueComponents = await glob('./src/runtime/vue/components/*.vue', { absolute: true })
+
+export default defineConfig({
   test: {
-    testTimeout: 1000,
+    testTimeout: 5000,
     globals: true,
     silent: true,
-    include: ['./test/components/**/**.spec.ts', './test/composables/**.spec.ts', './test/utils/**/**.spec.ts'],
-    environment: 'nuxt',
-    environmentOptions: {
-      nuxt: {
-        rootDir: fileURLToPath(new URL('test/nuxt/', import.meta.url))
+    resolveSnapshotPath(path, extension, { config }) {
+      if (config.name === 'vue') {
+        return path.replace(/\/([^/]+)\.spec\.ts$/, `/__snapshots__/$1-vue.spec.ts${extension}`)
+      } else {
+        return path.replace(/\/([^/]+)\.spec\.ts$/, `/__snapshots__/$1.spec.ts${extension}`)
       }
     },
-    setupFiles: fileURLToPath(new URL('test/nuxt/setup.ts', import.meta.url))
+    projects: [
+      await defineVitestProject({
+        extends: true,
+        test: {
+          name: 'nuxt',
+          include: ['./test/components/**/**.spec.ts', './test/composables/**.spec.ts', './test/utils/**/**.spec.ts'],
+          environment: 'nuxt',
+          environmentOptions: {
+            nuxt: {
+              rootDir: fileURLToPath(new URL('test/nuxt/', import.meta.url))
+            }
+          },
+          setupFiles: fileURLToPath(new URL('test/nuxt/setup.ts', import.meta.url))
+        }
+      }),
+      {
+        extends: true,
+        test: {
+          name: 'vue',
+          environment: 'happy-dom',
+          include: ['./test/components/**.spec.ts', './test/composables/**.spec.ts'],
+          setupFiles: ['./test/utils/setup.ts']
+        },
+        plugins: [
+          vue(),
+          ui({ dts: false }),
+          {
+            name: 'nuxt-ui-test:components',
+            enforce: 'pre',
+            resolveId(id) {
+              if (id === '@nuxt/test-utils/runtime') {
+                return resolve('./test/utils/mount')
+              }
+            }
+          },
+          {
+            name: 'nuxt-ui-test:components',
+            enforce: 'pre',
+            resolveId(id) {
+              if (id === '#components') {
+                return '#components'
+              }
+            },
+            load(id) {
+              if (id === '#components' || id === '?#components') {
+                const resolvedComponents = [...vueComponents, ...components]
+                const renderedComponents = new Set<string>()
+                return resolvedComponents.map((file) => {
+                  const componentName = file.split('/').pop()!.replace('.vue', '')
+                  if (renderedComponents.has(componentName)) {
+                    return ''
+                  }
+                  renderedComponents.add(componentName)
+                  return `export { default as U${componentName} } from '${file}'`
+                }).join('\n')
+              }
+            }
+          }
+        ]
+      }
+    ]
   }
 })