feat: component testing now supports vite 6 [run ci]

cypress-io · Nov 26, 2024 · b2d0c3b · b2d0c3b
1 parent f4aec3e
commit b2d0c3b
Show file tree

Hide file tree

Showing 16 changed files with 2,101 additions and 193 deletions.
diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md
@@ -41,6 +41,7 @@ in this [GitHub issue](https://github.com/cypress-io/cypress/issues/30447). Addr
 
 - Cypress Component Testing now supports `React` version 19. Cypress will allow detected use of the React 19 Release Candidate until React 19 is officially released. Addresses [#29470](https://github.com/cypress-io/cypress/issues/29470).
 - Cypress Component Testing now supports `Next.js` version 15. Addresses [#30445](https://github.com/cypress-io/cypress/issues/30445).
+- Cypress Component Testing now supports `Vite` version 6. Addresses [#30591](https://github.com/cypress-io/cypress/issues/30591).
 
 **Bugfixes:**
 

diff --git a/npm/vite-dev-server/cypress/e2e/react.cy.ts b/npm/vite-dev-server/cypress/e2e/react.cy.ts
@@ -4,7 +4,7 @@ import dedent from 'dedent'
 
 type ProjectDirs = typeof fixtureDirs
 
-const VITE_REACT: ProjectDirs[number][] = ['vite4.5.5-react', 'vite5.4.10-react']
+const VITE_REACT: ProjectDirs[number][] = ['vite4.5.5-react', 'vite5.4.10-react', 'vite6.0.0-react']
 
 // Add to this list to focus on a particular permutation
 const ONLY_PROJECTS: ProjectDirs[number][] = []

diff --git a/npm/vite-dev-server/cypress/e2e/vite-dev-server.cy.ts b/npm/vite-dev-server/cypress/e2e/vite-dev-server.cy.ts
@@ -44,8 +44,8 @@ describe('Config options', () => {
   })
 
   it('supports supportFile = false', () => {
-    cy.scaffoldProject('vite5.4.10-react')
-    cy.openProject('vite5.4.10-react', ['--config-file', 'cypress-vite-no-support.config.ts', '--component'])
+    cy.scaffoldProject('vite6.0.0-react')
+    cy.openProject('vite6.0.0-react', ['--config-file', 'cypress-vite-no-support.config.ts', '--component'])
     cy.startAppServer('component')
 
     cy.visitApp()
@@ -59,8 +59,8 @@ describe('Config options', () => {
   it('supports serving files with whitespace', () => {
     const specWithWhitespace = 'spec with whitespace.cy.jsx'
 
-    cy.scaffoldProject('vite5.4.10-react')
-    cy.openProject('vite5.4.10-react', ['--config-file', 'cypress-vite.config.ts', '--component'])
+    cy.scaffoldProject('vite6.0.0-react')
+    cy.openProject('vite6.0.0-react', ['--config-file', 'cypress-vite.config.ts', '--component'])
     cy.startAppServer('component')
 
     cy.withCtx(async (ctx, { specWithWhitespace }) => {
@@ -77,8 +77,8 @@ describe('Config options', () => {
   })
 
   it('supports @cypress/vite-dev-server', () => {
-    cy.scaffoldProject('vite5.4.10-react')
-    cy.openProject('vite5.4.10-react', ['--config-file', 'cypress-vite-dev-server-function.config.ts', '--component'])
+    cy.scaffoldProject('vite6.0.0-react')
+    cy.openProject('vite6.0.0-react', ['--config-file', 'cypress-vite-dev-server-function.config.ts', '--component'])
     cy.startAppServer('component')
 
     cy.visitApp()
@@ -89,8 +89,8 @@ describe('Config options', () => {
   })
 
   it('supports viteConfig as an async function', () => {
-    cy.scaffoldProject('vite5.4.10-react')
-    cy.openProject('vite5.4.10-react', ['--config-file', 'cypress-vite-async-function-config.config.ts', '--component'])
+    cy.scaffoldProject('vite6.0.0-react')
+    cy.openProject('vite6.0.0-react', ['--config-file', 'cypress-vite-async-function-config.config.ts', '--component'])
     cy.startAppServer('component')
 
     cy.visitApp()
@@ -120,8 +120,8 @@ describe('sourcemaps', () => {
       })
     `
 
-    cy.scaffoldProject('vite5.4.10-react')
-    cy.openProject('vite5.4.10-react', ['--config-file', 'cypress-vite.config.ts', '--component'])
+    cy.scaffoldProject('vite6.0.0-react')
+    cy.openProject('vite6.0.0-react', ['--config-file', 'cypress-vite.config.ts', '--component'])
     cy.startAppServer('component')
 
     cy.withCtx(async (ctx, o) => {

diff --git a/npm/vite-dev-server/package.json b/npm/vite-dev-server/package.json
@@ -29,6 +29,7 @@
     "ts-node": "^10.9.2",
     "vite-4": "npm:vite@^4.5.3",
     "vite-5": "npm:vite@^5.2.8",
+    "vite-6": "npm:vite@^6.0.0",
     "vite-plugin-inspect": "0.8.4"
   },
   "files": [

diff --git a/npm/vite-dev-server/src/devServer.ts b/npm/vite-dev-server/src/devServer.ts
@@ -1,6 +1,6 @@
 import debugFn from 'debug'
 import semverMajor from 'semver/functions/major'
-import type { UserConfig } from 'vite-5'
+import type { UserConfig } from 'vite-6'
 import { getVite, Vite } from './getVite'
 import { createViteDevServerConfig } from './resolveConfig'
 

diff --git a/npm/vite-dev-server/src/getVite.ts b/npm/vite-dev-server/src/getVite.ts
@@ -3,7 +3,7 @@ import type { ViteDevServerConfig } from './devServer'
 
 const debug = debugFn('cypress:vite-dev-server:getVite')
 
-export type Vite = typeof import('vite-5')
+export type Vite = typeof import('vite-6')
 
 // "vite-dev-server" is bundled in the binary, so we need to require.resolve "vite"
 // from root of the active project since we don't bundle vite internally but rather

diff --git a/npm/vite-dev-server/src/resolveConfig.ts b/npm/vite-dev-server/src/resolveConfig.ts
@@ -4,7 +4,7 @@
  * You can find it here https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/node/create.ts
  */
 import debugFn from 'debug'
-import type { InlineConfig } from 'vite-5'
+import type { InlineConfig } from 'vite-6'
 import path from 'path'
 import semverGte from 'semver/functions/gte'
 

diff --git a/npm/vite-dev-server/test/resolveConfig.spec.ts b/npm/vite-dev-server/test/resolveConfig.spec.ts
@@ -2,6 +2,7 @@ import Chai, { expect } from 'chai'
 import { EventEmitter } from 'events'
 import * as vite4 from 'vite-4'
 import * as vite5 from 'vite-5'
+import * as vite6 from 'vite-6'
 import { scaffoldSystemTestProject } from './test-helpers/scaffoldProject'
 import { createViteDevServerConfig } from '../src/resolveConfig'
 import sinon from 'sinon'
@@ -22,7 +23,7 @@ const getViteDevServerConfig = (projectRoot: string) => {
     framework: 'react',
   } as unknown as ViteDevServerConfig
 }
-const MAJOR_VERSIONS: ({version: 4, vite: any } | {version: 5, vite: any })[] = [
+const MAJOR_VERSIONS: ({version: 4, vite: any } | {version: 5, vite: any } | {version: 6, vite: any })[] = [
   {
     version: 4,
     vite: vite4,
@@ -31,6 +32,10 @@ const MAJOR_VERSIONS: ({version: 4, vite: any } | {version: 5, vite: any })[] =
     version: 5,
     vite: vite5,
   },
+  {
+    version: 6,
+    vite: vite6,
+  },
 ]
 
 describe('resolveConfig', function () {

diff --git a/packages/scaffold-config/src/dependencies.ts b/packages/scaffold-config/src/dependencies.ts
@@ -49,7 +49,7 @@ export const WIZARD_DEPENDENCY_VITE = {
   package: 'vite',
   installer: 'vite',
   description: 'Vite is dev server that serves your source files over native ES modules',
-  minVersion: '^4.0.0 || ^5.0.0',
+  minVersion: '^4.0.0 || ^5.0.0 || ^6.0.0',
 } as const
 
 export const WIZARD_DEPENDENCY_NEXT = {