chore(vue-query-devtools): set up vitest environment with production fallback test (#10629)

* test(vue-query-devtools): set up vitest environment with production fallback test

* chore(vue-query-devtools): unify 'defineConfig' and 'mergeConfig' import from 'vitest/config'

Author: sukvvon

packages/vue-query-devtools/package.json

@@ -19,6 +19,8 @@
     "compile": "vue-tsc --build",
     "test:eslint": "eslint --concurrency=auto ./src",
     "test:types": "vue-tsc --build",
+    "test:lib": "vitest",
+    "test:lib:dev": "pnpm run test:lib --watch",
     "test:build": "publint --strict && attw --pack",
     "build": "pnpm run compile && vite build"
   },

packages/vue-query-devtools/src/__tests__/VueQueryDevtools.test.ts

@@ -0,0 +1,16 @@
+import { describe, expect, it, vi } from 'vitest'
+
+describe('VueQueryDevtools', () => {
+  it('should return null in non-development environments', async () => {
+    vi.stubEnv('NODE_ENV', 'production')
+    vi.resetModules()
+
+    try {
+      const { VueQueryDevtools } = await import('..')
+      expect((VueQueryDevtools as unknown as () => null)()).toBeNull()
+    } finally {
+      vi.unstubAllEnvs()
+      vi.resetModules()
+    }
+  })
+})

packages/vue-query-devtools/src/__tests__/VueQueryDevtoolsPanel.test.ts

@@ -0,0 +1,16 @@
+import { describe, expect, it, vi } from 'vitest'
+
+describe('VueQueryDevtoolsPanel', () => {
+  it('should return null in non-development environments', async () => {
+    vi.stubEnv('NODE_ENV', 'production')
+    vi.resetModules()
+
+    try {
+      const { VueQueryDevtoolsPanel } = await import('..')
+      expect((VueQueryDevtoolsPanel as unknown as () => null)()).toBeNull()
+    } finally {
+      vi.unstubAllEnvs()
+      vi.resetModules()
+    }
+  })
+})

packages/vue-query-devtools/vite.config.ts

@@ -1,7 +1,9 @@
-import { defineConfig, mergeConfig } from 'vite'
+import { defineConfig, mergeConfig } from 'vitest/config'
 import vue from '@vitejs/plugin-vue'
 import { tanstackViteConfig } from '@tanstack/vite-config'
 
+import packageJson from './package.json'
+
 const config = defineConfig({
   plugins: [vue()],
   // fix from https://github.com/vitest-dev/vitest/issues/6992#issuecomment-2509408660
@@ -15,6 +17,20 @@ const config = defineConfig({
       },
     },
   },
+  test: {
+    name: packageJson.name,
+    dir: './src',
+    watch: false,
+    environment: 'jsdom',
+    coverage: {
+      enabled: true,
+      provider: 'istanbul',
+      include: ['src/**/*'],
+      exclude: ['src/__tests__/**'],
+    },
+    typecheck: { enabled: true },
+    restoreMocks: true,
+  },
 })
 
 export default mergeConfig(