fix(vitest): install dependencies with the same version when prompted

docs/guide/index.md

@@ -230,6 +230,10 @@ You can specify additional CLI options like `--port` or `--https`. For a full li
 
 Learn more about the [Command Line Interface](/guide/cli)
 
+## Automatic Dependency Installation
+
+Vitest will prompt you to install certain dependencies if they are not already installed. You can disable this behavior by setting the `VITEST_SKIP_INSTALL_CHECKS=1` environment variable.
+
 ## IDE Integrations
 
 We also provided a official extension for Visual Studio Code to enhance your testing experience with Vitest.

packages/vitest/src/node/cli/cli-api.ts

@@ -60,7 +60,7 @@ export async function startVitest(
 
     if (requiredPackages) {
       if (
-        !(await ctx.packageInstaller.ensureInstalled(requiredPackages, root))
+        !(await ctx.packageInstaller.ensureInstalled(requiredPackages, root, ctx.version))
       ) {
         process.exitCode = 1
         return ctx

packages/vitest/src/node/packageInstaller.ts

@@ -7,7 +7,7 @@ import { isCI } from '../utils/env'
 const __dirname = url.fileURLToPath(new URL('.', import.meta.url))
 
 export class VitestPackageInstaller {
-  async ensureInstalled(dependency: string, root: string) {
+  async ensureInstalled(dependency: string, root: string, version?: string) {
     if (process.env.VITEST_SKIP_INSTALL_CHECKS) {
       return true
     }
@@ -49,13 +49,14 @@ export class VitestPackageInstaller {
     })
 
     if (install) {
+      const packageName = version ? `${dependency}@${version}` : dependency
       await (
         await import('@antfu/install-pkg')
-      ).installPackage(dependency, { dev: true })
+      ).installPackage(packageName, { dev: true })
       // TODO: somehow it fails to load the package after installation, remove this when it's fixed
       process.stderr.write(
         c.yellow(
-          `\nPackage ${dependency} installed, re-run the command to start.\n`,
+          `\nPackage ${packageName} installed, re-run the command to start.\n`,
         ),
       )
       process.exit()

packages/vitest/src/node/plugins/index.ts

@@ -34,7 +34,7 @@ export async function VitestPlugin(
   const getRoot = () => ctx.config?.root || options.root || process.cwd()
 
   async function UIPlugin() {
-    await ctx.packageInstaller.ensureInstalled('@vitest/ui', getRoot())
+    await ctx.packageInstaller.ensureInstalled('@vitest/ui', getRoot(), ctx.version)
     return (await import('@vitest/ui')).default(ctx)
   }
 

packages/vitest/src/node/reporters/utils.ts

@@ -42,7 +42,7 @@ function createReporters(
         const [reporterName, reporterOptions] = referenceOrInstance
 
         if (reporterName === 'html') {
-          await ctx.packageInstaller.ensureInstalled('@vitest/ui', runner.root)
+          await ctx.packageInstaller.ensureInstalled('@vitest/ui', runner.root, ctx.version)
           const CustomReporter = await loadCustomReporterModule(
             '@vitest/ui/reporter',
             runner,

packages/vitest/src/node/workspace.ts

@@ -359,7 +359,7 @@ export class WorkspaceProject {
     if (!this.isBrowserEnabled()) {
       return
     }
-    await this.ctx.packageInstaller.ensureInstalled('@vitest/browser', this.config.root)
+    await this.ctx.packageInstaller.ensureInstalled('@vitest/browser', this.config.root, this.ctx.version)
     const { createBrowserServer } = await import('@vitest/browser')
     await this.browser?.close()
     const browser = await createBrowserServer(