fix: print unexpected error message if peer dependencies have a diffe…

…rent version (#6446)

packages/browser/package.json

@@ -90,6 +90,7 @@
     "magic-string": "^0.30.11",
     "msw": "^2.3.5",
     "sirv": "^2.0.4",
+    "tinyrainbow": "^1.2.0",
     "ws": "^8.18.0"
   },
   "devDependencies": {

packages/browser/src/node/index.ts

@@ -1,6 +1,8 @@
 import type { WorkspaceProject } from 'vitest/node'
 import type { Plugin } from 'vitest/config'
 import { createServer } from 'vitest/node'
+import c from 'tinyrainbow'
+import { version } from '../../package.json'
 import { setupBrowserRpc } from './rpc'
 import { BrowserServer } from './server'
 import BrowserPlugin from './plugin'
@@ -14,6 +16,16 @@ export async function createBrowserServer(
   prePlugins: Plugin[] = [],
   postPlugins: Plugin[] = [],
 ) {
+  if (project.ctx.version !== version) {
+    project.ctx.logger.warn(
+      c.yellow(
+        `Loaded ${c.inverse(c.yellow(` vitest@${project.ctx.version} `))} and ${c.inverse(c.yellow(` @vitest/browser@${version} `))}.`
+        + '\nRunning mixed versions is not supported and may lead into bugs'
+        + '\nUpdate your dependencies and make sure the versions match.',
+      ),
+    )
+  }
+
   const server = new BrowserServer(project, '/')
 
   const configPath = typeof configFile === 'string' ? configFile : false

packages/ui/node/index.ts

@@ -3,10 +3,22 @@ import { basename, resolve } from 'pathe'
 import sirv from 'sirv'
 import type { Plugin } from 'vite'
 import { coverageConfigDefaults } from 'vitest/config'
-import type { Vitest } from 'vitest'
+import type { Vitest } from 'vitest/node'
 import { toArray } from '@vitest/utils'
+import c from 'tinyrainbow'
+import { version } from '../package.json'
 
 export default (ctx: Vitest): Plugin => {
+  if (ctx.version !== version) {
+    ctx.logger.warn(
+      c.yellow(
+        `Loaded ${c.inverse(c.yellow(` vitest@${ctx.version} `))} and ${c.inverse(c.yellow(` @vitest/ui@${version} `))}.`
+        + '\nRunning mixed versions is not supported and may lead into bugs'
+        + '\nUpdate your dependencies and make sure the versions match.',
+      ),
+    )
+  }
+
   return <Plugin>{
     name: 'vitest:ui',
     apply: 'serve',