11.0.0

Released Released on November 7, 2022

Summary:

Component Testing is now generally available for projects using React, Next.js, Angular, and Vue!

Component tests allow you to see and test your application's components in a real browser as you work. You can use your favorite Cypress commands and features to develop your components without running your whole app. Learn more in our blog post.

We have also massively improved our startup performance by shipping a snapshot of our binary instead of the source files. The performance boost applies to the time it takes from running a cypress command (e.g. cypress open) to when the Cypress app is opened. Results will vary based on your situation, but we saw up to 84% faster startup times!

Breaking Changes:

Read our Migration Guide which explains the breaking changes in more detail.

Component Testing:

  • Removed cssFile, cssFiles, style, styles, stylesheet, and stylesheets from the options argument to the cy.mount() function. We recommend writing test-specific styles in a separate css file you import in your test, or in your supportFile. See migration guide. Addresses #24328.

  • Subsequent cy.mount calls within the same test will remove the last mounted component from the DOM. Addresses #24329.

  • mountHook from cypress/react has been removed. We recommend replacing it with mount and a component. See migration guide. Addresses #24328.

  • unmount from cypress/react has been removed. We recommend using the API React provides for unmounting components, unmountComponentAtNode. See migration guide. Addresses #24328.

  • mountCallback from cypress/vue has been removed. We recommend using mount. See migration guide. Addresses #24328.

  • mount from cypress/vue now returns an object with both the VueWrapper (wrapper) and the component instance (component). Addresses #24342.

  • When providing an inline viteConfig inside of cypress.config, any vite.config.js file is not automatically merged. See migration guide. Addresses #24133.

  • Angular providers passed as part of the mounting options will be assigned at the module level using the TestBed.configureTestingModule API. This means that module-level providers (resolved from imports or @Injectable({ providedIn: 'root' }) can be overridden, but providers specified in @Component({ providers: [...] }) will not be overridden when using cy.mount(MyComponent, { providers: [...] }). To override component-level providers, use the TestBed.overrideComponent API. See migration guide. Addresses #24047 and #23427.

General:

  • Communication with the Cypress Dashboard will now verify CAs and reject any unauthorized calls. If you use a self-signed CA you will need to set npm_config_ca, npm_config_cafile, or NODE_EXTRA_CA_CERTS. Addresses #23980.

Experimental:

Features:

  • Incorporated V8 snapshots into the build process of the Electron binary to improve startup time and reduce the time to download and unzip the binary during installation. Startup time is the time from running a command to when Cypress's window is first opened. Addresses #18480.

  • cy.getCookie(), cy.getCookies(), cy.setCookie(), cy.clearCookie(), and cy.clearCookies() now accept a domain option. Addresses #24264.

Bugfixes:

  • Fix types associated with cy.mount() that were incorrectly typed as any. Fixes #24330.

  • The cy.mount() snapshot now shows the mounted component instead of a blank page. Fixes #24138.

  • "Open in IDE" is no longer displayed in the command log for component tests. Fixes #24366.

  • Cypress now correctly handles CSVs and other non-html MIME types. Fixes #24297.

  • Cypress now supports project directories mounted on read-only file systems. Fixes #2064.

  • Snapshots now capture the AUT correctly when it has navigated away. Fixes #24506.

  • cy.pause() now functions correctly when called within the cy.origin() callback. Fixes #21495.

  • When utilizing dependencies within the cy.origin() callback, errors now show the correct code frame. Fixes #23365.

  • The select dropdown (in Front-end Framework, Bundler, Organization, Project, Preferred Editor) now highlights and adds a checkmark to the selected option. Fixes #21768.

  • The failure icon in the reporter header now displays correctly when there are a large number of successful tests. Fixes #21838.

  • Cypress now allows more than twenty sessions to be created in a single test. Fixed in #24379.