Migrating to Cypress V11

Cypress v10 introduce new features, like component testing, along with some breaking changes. Nx can help you migrate from v8 or v9 of Cypress to v10 and then to v11.

Before continuing, make sure you have all your changes committed and have a clean working tree.

You can migrate an E2E project to v11 by running the following command:

Generator Naming Changes

If your nx version is below v15.3.0, this migration is called migrate-to-cypress-10.

From v15.3.0+ this generator is called migrate-to-cypress-11.

As of nx v15.1.0, if your project was already using Cypress v10, then your project will be migrated to Cypress v11 via the standard nx migration process

❯

nx g @nx/cypress:migrate-to-cypress-11

In general, these are the steps taken to migrate your project:

  1. Migrates your existing cypress.json configuration to a new cypress.config.ts configuration file.
    • The pluginsFile option has been replaced for setupNodeEvents. We will import the file and add it to the setupNodeEvents config option. Double-check your plugins are working correctly.
  2. Rename all test files from .spec.ts to .cy.ts
  3. Rename the support/index.ts to support/e2e.ts and update any associated imports
  4. Rename the integrations folder to the e2e folder
Root cypress.json

Keeping a root cypress.json file, will cause issues with Cypress trying to load the project. Instead, you can create a root ts file and import it into each project's cypress config file to share values across projects.

We take the best effort to make this migration seamless, but there can be edge cases we didn't anticipate. So feel free to open an issue if you come across any problems.

You can also consult the official Cypress migration guide if you get stuck and want to manually migrate your projects.