`e2e-cypress` extension incompatible with `@quasar/app-vite@2.4.0`

[FelixNumworks]

If I bump @quasar/app-vite to 2.4.0, I get this error when running my component tests:

Could not find "vite" in your project's dependencies. Please install "vite" to fix this error.

Error [ERR_REQUIRE_ESM]: require() of ES Module ~~/myQuasarProject/node_modules/vite/dist/node/index.js from ~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/getVite.js not supported.
Instead change the require of index.js in ~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/getVite.js to a dynamic import() which is available in all CommonJS modules.
Error: Could not find "vite" in your project's dependencies. Please install "vite" to fix this error.

Error [ERR_REQUIRE_ESM]: require() of ES Module ~~/myQuasarProject/node_modules/vite/dist/node/index.js from ~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/getVite.js not supported.
Instead change the require of index.js in ~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/getVite.js to a dynamic import() which is available in all CommonJS modules.
    at getVite (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/getVite.js:17:15)
    at devServer (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/node_modules/@cypress/vite-dev-server/dist/devServer.js:13:40)
    at Object.handler (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_require_async_child.js:166:24)
    at invoke (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:189:18)
    at ~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:59:14
    at tryCatcher (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/util.js:16:23)
    at Promise.attempt.Promise.try (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/node_modules/bluebird/js/release/method.js:39:29)
    at Object.wrapChildPromise (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:58:23)
    at Object.wrap (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/dev-server.js:18:8)
    at RunPlugins.execute (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:159:26)
    at EventEmitter.<anonymous> (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/child/run_plugins.js:56:12)
    at EventEmitter.emit (node:events:518:28)
    at process.<anonymous> (~/Library/Caches/Cypress/14.5.4/Cypress.app/Contents/Resources/app/packages/server/lib/plugins/util.js:33:22)
    at process.emit (node:events:518:28)
    at emit (node:internal/child_process:949:14)
    at process.processTicksAndRejections (node:internal/process/task_queues:91:21)

If I bump cypress to cypress@15.1.0 (and add an override in my package.json), I now have this error at each test file:

<<<CYPRESS.STDERR.START>>>11:06:27 AM [vite] Internal server error: [sass] Cannot read properties of undefined (reading 'initAsyncCompiler')
  Plugin: vite:css
  File: ~/myQuasarProject/node_modules/quasar/src/css/index.sass
      at Object.run (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32875:29)
      at async Object.process (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32938:20)
      at async compileCSSPreprocessors (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32357:27)
      at async compileCSS (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32385:30)
      at async TransformPluginContext.handler (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:31924:54)
      at async EnvironmentPluginContainer.transform (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:31325:14)
      at async loadAndTransform (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:26407:26)
      at async viteTransformMiddleware (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:27492:20)
<<<CYPRESS.STDERR.END>>><<<CYPRESS.STDERR.START>>>11:06:27 AM [vite] Internal server error: [sass] Cannot read properties of undefined (reading 'initAsyncCompiler')
  Plugin: vite:css
  File: ~/myQuasarProject/src/css/app.scss
      at Object.run (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32875:29)
      at async process (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32938:20)
      at async compileCSSPreprocessors (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32357:27)
      at async compileCSS (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:32385:30)
      at async TransformPluginContext.handler (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:31924:54)
      at async EnvironmentPluginContainer.transform (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:31325:14)
      at async loadAndTransform (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:26407:26)
      at async viteTransformMiddleware (~/myQuasarProject/node_modules/vite/dist/node/chunks/dep-M_KD0XSK.js:27492:20)
<<<CYPRESS.STDERR.END>>>

I guess this will be fixed when #401 will be

[FelixNumworks]

I think the problem is mainly coming from Cypress itself (and even Vite)

See cypress-io/cypress#32362

[IlCallo]

About the first error you reported

Cypress 14 supports up to Vite 6
@quasar/app-vite v2.4 uses Vite 7, so you need to use Cypress v15 for that

Viceversa, @quasar/app-vite v1 only supports Vite 3, and Vite 4/5 using a workaround, while Cypress v15 requires at least Vite 5
The first @quasar/app-vite version supporting Vite > 5 is v2

I'll add a couple checks to make sure that execution fails if:

• you're using @quasar/app-vite v2.4, but Cypress 14 or lower is used
• you're using Cypress v15, but @quasar/app-vite v1 is used

---

For the second one, I published my findings in #401

[FelixNumworks]

quasar/app-vite now uses Vite 8, which is supported by Cypress 15.14+