feat: support Cypress 15, fix #401

packages/e2e-cypress/README.md

@@ -104,6 +104,22 @@ You can either apply [this workaround](https://github.com/istanbuljs/nyc/issues/
 
 [nyc-config-preset]: https://github.com/quasarframework/quasar-testing/blob/dev/packages/e2e-cypress/nyc-config-preset.json
 
+### Upgrade from Cypress AE v6.2 to v6.3 onwards
+
+> If you're coming from v6.1, follow the migration guide in the next section first.
+
+Here's all the steps you need to take while upgrading from v6.2 to v6.3:
+
+- If you're using `@quasar/app-vite` v2.4 onwards, you need to upgrade Cypress to v15, as described in the following bullet point. Cypress v14 and below aren't compatible with Vite 7, which is used by `@quasar/app-vite` v2.4 onwards.
+- (**optional, unless you're using `@quasar/app-vite` v2.4 onwards**) Upgrade Cypress to v15 and check out its [migration guide](https://docs.cypress.io/app/references/migration-guide#Migrating-to-Cypress-150).
+- (**optional, unless you're using `@quasar/app-vite` v2.4 onwards and using TypeScript**) Upgrade TypeScript to at least v5.6, since Vite 7 requires [some packages](https://github.com/vitejs/vite-plugin-vue/issues/616) which require that minimum version.
+- (**optional, unless you're using Cypress v15 onwards**) If you upgrade Cypress to v15, you should also upgrade `@quasar/app-vite` to v2.4. `@quasar/app-vite` v1 uses Vite 3 and Cypress v15 requires Vite 7.2 onwards for our setup due to some [Sass problems](https://github.com/cypress-io/cypress/issues/32362).
+- (**optional**) Migrate your project to use ESLint v9 and `eslint-plugin-cypress` v5, as the next major version of Cypress AE won't support ESLint v8 anymore. You'll also need to update your ESLint config, so check the new installation instruction for ESLint v9 at the top of this page.
+
+In v6.3 we removed both test project for `@quasar/app-vite` v1, testing respectively Vite 4 and Vite 5 setups, and the test project for `@quasar/app-webpack` v3.
+Cypress v15 support made them incompatible with our pre-release automated test system.
+Tests for those setups are still available in a [dedicated branch](https://github.com/quasarframework/quasar-testing/tree/cypress-v14).
+
 ### Upgrade from Cypress AE v6.1 to v6.2 onwards
 
 > If you're coming from v5.1, follow the migration guide in the next section first.

packages/e2e-cypress/package.json

@@ -32,21 +32,21 @@
     "yarn": ">= 1.17.3"
   },
   "dependencies": {
-    "@cypress/code-coverage": "^3.12.26",
+    "@cypress/code-coverage": "^3.14.7",
     "cross-env": "^7.0.3",
     "lodash": "^4.17.21",
-    "nyc": "^15.1.0",
-    "start-server-and-test": "^2.0.3",
-    "vite-plugin-istanbul": "^7.0.0"
+    "nyc": "^17.1.0",
+    "start-server-and-test": "^2.1.2",
+    "vite-plugin-istanbul": "^7.2.0"
   },
   "devDependencies": {
-    "@types/lodash": "^4.14.202",
-    "cypress": "^14.2.1",
+    "@types/lodash": "^4.17.20",
+    "cypress": "^15.7.0",
     "eslint-plugin-cypress": "^3.6.0",
     "rimraf": "^5.0.5"
   },
   "peerDependencies": {
-    "cypress": "^12.2.0 || ^13.2.0 || ^14.0.0",
+    "cypress": "^12.2.0 || ^13.2.0 || ^14.0.0 || ^15.0.0",
     "eslint-plugin-cypress": ">=2.0.0"
   },
   "peerDependenciesMeta": {

packages/e2e-cypress/src/helpers/commands/cypress-overrides.ts

@@ -93,8 +93,6 @@ export function registerCypressOverwrites() {
     },
   );
 
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-expect-error
   chai.Assertion.overwriteProperty('checked', (_super: () => void) => {
     return function (
       this: typeof chai.Assertion & { __flags: { negate?: boolean } },

packages/e2e-cypress/src/index.js

@@ -5,12 +5,14 @@
  * API: https://github.com/quasarframework/quasar/blob/master/app/lib/app-extension/IndexAPI.js
  */
 
-const { enforcedDevServerPort } = require('./shared');
+const { enforcedDevServerPort, enforcedCypress15Vite7Compatibility } = require('./shared');
 
 module.exports = async function (api) {
   api.compatibleWith('quasar', '^2.0.0');
   if (api.hasVite) {
     api.compatibleWith('@quasar/app-vite', '^1.0.0 || ^2.0.0');
+
+    enforcedCypress15Vite7Compatibility(api);
   } else if (api.hasWebpack) {
     api.compatibleWith('@quasar/app-webpack', '^3.0.0 || ^4.0.0');
   }

packages/e2e-cypress/src/install.js

@@ -6,7 +6,7 @@
 
 const { appendFileSync } = require('fs');
 const { join } = require('path');
-const { enforcedDevServerPort } = require('./shared');
+const { enforcedDevServerPort, enforcedCypress15Vite7Compatibility } = require('./shared');
 
 /**
  * Performs a deep merge of objects and returns new object. Does not modify
@@ -61,13 +61,17 @@ let extendPackageJson = {
 
 // TODO: remove this and roll back to use `getCompatibleDevDependencies` for next Cypress AE major version,
 // which will drop support for ESLint v8 and require a migration of this monorepo to ESLint v9
+// TODO: note that in this monorepo ESLint v8 is used at root level, but test projects use ESLint v9
+// This breaks the resolution logic of `api.hasPackage('eslint', '^9.0.0')` in the context of the AE install script within test projects
+// You'll need to manually set `eslint-plugin-cypress` to v4 in that case when running `sync:invoke:cypress` script
 function getEslintPluginCypressDependency(api) {
   return {
     devDependencies: {
       // eslint-plugin-cypress v3 doesn't support ESLint v9 and eslint-plugin-cypress v4 only supports ESLint v9,
       // So if the user has ESLint v9 installed, then we will scaffold with eslint-plugin-cypress v4, otherwise we will use v3
+      // We cannot use v5.x of eslint-plugin-cypress because it drops support for non-flat ESLint configs
       'eslint-plugin-cypress': api.hasPackage('eslint', '^9.0.0')
-        ? '^4.2.1'
+        ? '^4.3.0'
         : '^3.6.0',
     },
   };
@@ -77,7 +81,9 @@ module.exports = async function (api) {
   api.compatibleWith('quasar', '^2.0.0');
   if (api.hasVite) {
     // PromptsAPI and hasTypescript are only available from v1.6.0 onwards
-    api.compatibleWith('@quasar/app-vite', '^v1.6.0 || ^2.0.0');
+    api.compatibleWith('@quasar/app-vite', '^1.6.0 || ^2.0.0');
+
+    enforcedCypress15Vite7Compatibility(api);
   } else if (api.hasWebpack) {
     // PromptsAPI and hasTypescript are only available from v3.11.0 onwards
     api.compatibleWith('@quasar/app-webpack', '^3.11.0 || ^4.0.0');

packages/e2e-cypress/src/shared.js

@@ -1 +1,18 @@
 module.exports.enforcedDevServerPort = 8080;
+
+// TODO: app-vite doesn't yet force Vite 7.2+, we should release a new version that does and add update it here and above
+const quasarAppViteUsingVite7 = "^2.4.0";
+
+module.exports.enforcedCypress15Vite7Compatibility = (api) => {
+    // app-vite v2.4.0 switches to Vite 7, which requires Cypress v15
+    if (api.hasPackage('@quasar/app-vite', quasarAppViteUsingVite7)) {
+        api.compatibleWith('cypress', '^15.0.0');
+    }
+
+    // Cypress v15 drops support for Vite versions below v5, but it actually requires Vite 7.2+
+    // So if the user has Cypress v15, we need to ensure they are also using a proper @quasar/app-vite version
+    // See https://github.com/quasarframework/quasar-testing/issues/401
+    if (api.hasPackage('cypress', '^15.0.0')) {
+        api.compatibleWith('@quasar/app-vite', quasarAppViteUsingVite7);
+    }
+};