10.0.0

Released Released on May 31, 2022

Summary:

Component testing is now beta! We've also reworked the Cypress app from the ground up to modernize the interface, streamline workflows and integrate better into your overall development experience. Read more about 10.0 in our blog post.

Breaking Changes:

Please run cypress open to go through our interactive migration which will guide you in updating your files and configuration options. Read our Migration Guide which explains some breaking changes in more detail.**

  • We introduced several breaking changes to the Cypress configuration file detailed below:

    • Using a cypress.json configuration file is no longer supported. Replace this configuration file with a cypress.config.js, cypress.config.ts, cypress.config.cjs or cypress.config.mjs file. This change provides better flexibility and extensibility of configuration. An error will be thrown if both a cypress.json file and cypress.config.{cjs,js,mjs,ts} file are found. Addressed in #18221, #18300, #20554, and #20643.

    • A Cypress configuration file is now required and passing the CLI flag --config-file=false will throw an error. Addressed in #20643.

    • A default configuration file will no longer be auto-generated by Cypress when a configuration file doesn't exist. Instead, you can run cypress open and set up your project with a specific testing type to have this file generated. This allows you to customize the configuration setup by testing-type for the language and dependencies leveraged in your project.

    • The configuration file's JSON schema is no longer supported since the configuration can no longer be provided via a JSON format.

  • Cypress has made several configuration option changes including renaming options, removing options, and only allowing some options within a specific testing type. Please run cypress open to have our automated migration update these options for you.

    • Many configuration options are now specific to either end-to-end or component testing. The types have also been updated to match the new structure. Addressed in #20677.

    • The baseUrl and experimentalSessionAndOrigin configuration options are no longer valid as top-level configuration options and can only be defined within the e2e configuration. Addressed in #20589 and #21588.

    • The supportFile and slowTestThreshold options are no longer valid as top-level configuration options and must now be defined within the e2e and/or component configurations.

    • Previously the supportFile option defaulted to cypress/support/index.js. Now the e2e.supportFile option defaults to cypress/support/e2e.{js,jsx,ts,tsx} and the component.supportFile option defaults to cypress/support/component.{js,jsx,ts,tsx}. Addressed in #19776 and #19364.

    • The pluginsFile option was removed. This option should be replaced with the new setupNodeEvents() and devServer() configuration options. Addressed in #18798 and #20560.

    • The testFiles option was removed. This option was replaced with the new specPattern option. Addressed in #19319 and #20565.

    • The integrationFolder and componentFolder options were removed. These options were made obsolete by the new specPattern option. Addressed in #19319.

    • The ignoreTestFiles option was removed. This option was replaced with the new excludeSpecPattern option. Addressed in #19319.

    • The experimentalStudio option was removed with the removal of the experimental Cypress Studio feature. If this option is configured in your project, a warning message will be displayed. Please leave any feedback around Cypress Studio here. Addressed in #20515.

  • During cypress open, the ability to "Run all specs" and "Run filtered specs" has been removed. Please leave feedback around the removal of this feature here. Your feedback will help us make product decisions around the future of this feature.

  • The experimental Cypress Studio feature has been removed. Please leave feedback around the removal of this feature here. Your feedback will help us make product decisions around the future of this feature. Addressed in #20515.

  • You will no longer be able to run your tests during cypress run or cypress open in browser versions that are not supported by Cypress.

  • Generated screenshots and videos will still be created inside their respective folders (screenshotsFolder, videosFolder). However, the paths of generated files inside those folders will be stripped of any common ancestor paths shared between spec files found by the specPattern option and may no longer be deterministic. Addressed in #19319.

Deprecations:

  • The cypress open-ct and cypress run-ct commands have been deprecated. Use cypress open --component and cypress run --component instead. Addresses #18418.

Features:

  • Cypress 10 now includes beta support for component testing. More features around component testing are detailed below:

    • Component testing is now integrated directly into the main app, allowing you to choose which testing experience you want upon launching Cypress. See our current support for frameworks and bundlers. Addressed in #21111.

    • Cypress will now guide you through installing the component testing dependencies and project setup necessary to begin component testing in Cypress. Previously this required manual setup and referencing the documentation.

    • When you use the Cypress app during cypress open to configure your project for CT testing, a cy.mount() command will be automatically scaffolded for you in a ct.supportFile.

    • You can now create an empty component testing spec file from within the Cypress app directly and preview the specfile upon creation.

    • The following component testing plugins are now shipped with Cypress to enable easy cy.mount() implementation. Your local framework dependencies found in node_modules will be referenced to prevent adding additional dependencies or peer-dependencies to your package.json. From now on, the latest plugin version will be shipped with each Cypress release. See our current support for frameworks and bundlers. Addressed in #20930.

  • We've enhanced how you can set and refresh configuration detailed below:

    • Support for cypress.config.js|ts|cjs|mjs configuration files was added. Addressed in #20643.

    • The Cypress app will now refresh when changes are made in the configuration file instead of closing the app. Addressed in #21160.

  • We've added several new configuration options detailed below:

    • The setupNodeEvents() option is a new testing type specific configuration option. It must be defined within the e2e and/or component configurations. This option allows you to modify your loaded configuration, listen to events and register plugins. This option replaces the pluginsFile option. Addressed in #18798 and #20560.

    • The devServer option is a new component testing specific option that must be defined within the component configuration. This option provides a mechanism for starting a component testing dev-server when tests are running.

    • The specPattern option is a new testing-type specific configuration option that must be defined within the e2e and/or component configurations. This option accepts a glob or an array of globs of the spec files to load. This option simplifies the spec discovery by replacing the componentFolder, integrationFolder and testFiles options. Addressed in #19319, #20565 and #20853.

      • The e2e.specPattern default value for new projects is cypress/e2e/**.cy.{js,jsx,ts,tsx}. For existing projects, please run cypress open to have your spec files automatically migrated to match this specPattern. Addressed in #21193.

      • The component.specPattern default value is **/*.cy.{js,jsx,ts,tsx}.

    • The excludeSpecPattern option is a new testing type specific configuration option that must be defined within the e2e and/or component configurations. This option accepts a glob or an array of globs which allows you to ignore spec files that would otherwise be shown in your list of specs. This option replaces the ignoreTestFiles option. Addressed in #19319, #19980, #20763, #20853.

      • The e2e.excludeSpecPattern default value is the same as the replaced ignoreTestFiles glob pattern of *.hot-update.js.

      • The component.excludeSpecPattern default value is ['**/__snapshots__/*','**/__image_snapshots__/*'] plus the e2e.specPattern glob patterns.

      • The **/node_modules/** pattern is automatically added to both e2e.excludeSpecPattern and component.excludeSpecPattern and can't be overridden. This is consistent with <10.0 behavior.

    • Intelligent Code Completion was added with the defineConfig() helper function. This enables configuration auto-completion and in-line documentation in the configuration file in your IDE. While it's not strictly necessary for Cypress to parse your configuration, we recommend wrapping your config object with defineConfig(). Addressed in #18302.

  • We've made some updates to Cypress API commands detailed below:

    • Enhancements were made to provide visual indication of nested commands and logs. With this change, users are now able to click on log groups to print additional log details to the dev tools console.

    • The .within() command was updated to provide visual indication of logs and commands executed in the .within command context. Addresses #20433.

    • The redundant cy.session() log is now removed. Address #7673 in #21457.

    • Users can now add custom cy.hover() and cy.mount() implementation using Cypress.Commands.add() since we don't provide a default implementation. Previously users had to use Cypress.Command.override() to provide the custom implementation. Addresses #18941.

  • We've made some updates to the Cypress CLI detailed below:

    • You can now pass in testing type specific configuration options via the --config CLI flag without nesting JSON. Addressed in #20127.

    • New --e2e and --component CLI flags were added to cypress run and cypress open to allow a user to run or launch Cypress for a specific testing-type. If a testing-type specific CLI flag is not provided when running cypress run, Cypress will run end-to-end tests by default.

    • A warning message is now displayed when cypress open is ran with the --browser CLI flag for a browser that does not exist on the system. Addressed in #18473.

    • If a testing type and browser flag are passed to cypress open when launching a specific project, the browser will automatically launch. Addressed in #21538.

  • The cypress open experience has been updated to take you through our Launchpad with many features detailed below:

    • When you launch Cypress via cypress open you'll be asked whether you want to do end-to-end or component testing and taken through the configuration necessary to set up your project. Addressed in #18924.

    • Having files scaffolded on new projects during end-to-end testing is now opt in and not automatic. Addressed in #18924.

    • When Cypress detects you have a cypress.json during cypress run, it will error and ask you to run cypress open to migrate. When Cypress detects you have a cypress.json during cypress open, it will guide you through project migration to ensure your project continues to work as expected. Addressed in #18924.

  • After launching the browser, there are several new features in our App detailed below:

    • The Cypress app has been redesigned so that the Command Log and all associated navigation display with a dark background.

    • You can now change specs or the browser within the same window as running your tests.

    • Many git details are now shown within your current project in Cypress including the current branch and the last commit details of each spec in the spec explorer. Addressed in #20648, #21139, #21436 and #20744

    • When creating a new spec within Cypress, your project's language is detected to provide the correct file extension and the specPattern is checked to ensure the spec is found by Cypress. After creating the spec, you can preview the spec that was generated with the option to immediately run the spec or create another spec. Addressed in #21225, #20567, #20657, #20962.

    • The Settings page has been redesigned to more clearly distinguish between settings that are specific to the project, your device, and the Dashboard.

Bugfixes:

  • An error message is displayed when you add a command using Cypress.Commands.add() that has the same name as an internal reserved Cypress command. Addresses #6146.

  • A one pixel, left, vertical border was removed that was incorrectly included on screenshot artifacts generated from the cy.screenshot() command in component tests. Addressed in #21019.

  • A memory leak was fixed during cypress run for end-to-end tests launched in Chromium and Firefox browsers that reduces the overall time it takes to run a set of specs and aligns with how the browser is launched once for all specs in component testing. With this change, the before:browser:launch node event will now properly only fire once per run, instead of firing before each spec. Addressed in #19915.

  • The default webpack configuration's host value was changed from localhost to 127.0.0.1 to support the Node 17+ changes with how DNS names are resolved. Addressed in #21430.

  • Cypress will throw a detailed error when some plugin versions are no longer supported in Cypress 10. Addressed in #21169

Dependencies:

Misc:

  • The Plugins concept in Cypress still exists with the intent to tap into, modify or extend the internal behavior(s) of Cypress. It however is expected to be used in conjunction with our new setupNodesEvents configuration option, which was named to reflect that Plugins leverage Cypress's node events.