Cypress v7.0.0 — Release Notes & Engineering Impact

_Released 04/05/2021_ **Summary:** 🎉 Introducing the **Cypress Component Test Runner** - now in alpha. Today's release includes a brand new test runner designed to replace your Node-based component tests. Our Component Test Runner tests your components in the browser, just like a user would. And, since it runs in the browser, you get to debug your components using your favorite developer tools. Read our [Component Testing Guide](https://on.cypress.io/component-testing) for more details. **Breaking Changes:** **<Icon name="exclamation-triangle" color="red"></Icon> Please read our [Migration Guide](https://on.cypress.io/migration-guide) which explains the changes in more detail and how to change your code to migrate to Cypress 7.0.** - We introduced several breaking changes to [cy.intercept()](https://on.cypress.io/intercept). See the [cy.intercept()](/api/commands/intercept) docs for full usage examples. Breaking changes: - Request handlers supplied to `cy.intercept()` are now matched starting with the most recently defined request interceptor. This allows users to override request handlers by calling `cy.intercept()` again. This matches the previous behavior that was default in `cy.route()`. Addresses [#9302](https://github.com/cypress-io/cypress/issues/9302). - `cy.intercept()` now automatically parses more JSON MIME types, including 'application/vnd.api+json'. You can now remove `JSON.parse(req.body)` or `JSON.parse(res.body)` from some tests that previously required it. Addresses [#14763](https://github.com/cypress-io/cypress/issues/14763). - Falsy values (with the exception of `undefined`) supplied as the body of a `StaticResponse` to `cy.intercept()` will now be JSONified and sent as the body. Previously, an empty string was sent instead. Addresses [#15234](https://github.com/cypress-io/cypress/issues/15234) and [#14205](https://github.com/cypress-io/cypress/issues/14205). - The `matchUrlAgainstPath` `RouteMatcher` property has been removed from `cy.intercept()`. - The "substring match" from `cy.intercept()` URL matching has been removed. Previously, a URL would match if it contained the supplied string anywhere. Now, the URL (including querystring) only matches if it is an equality match or a minimatch. - The `delay` option for StaticResponses used with `cy.intercept()` has been removed. Please go back to using the `delayMS` option. Addresses [#15255](https://github.com/cypress-io/cypress/issues/15255). - `cy.route2()` was previously aliased to `cy.intercept()`. Now the alias `cy.route2()` has been removed. Please update usage of `cy.route2()` to `cy.intercept()`. Addressed in [#14709](https://github.com/cypress-io/cypress/pull/14709). - Component tests have been migrated to use a dedicated test runner and are bundled differently. See the [Migration Guide](https://on.cypress.io/migration-guide) for full examples on how to migrate. Addressed in [#14479](https://github.com/cypress-io/cypress/pull/14479). - Component tests will not be executed when running `cypress open` or `cypress run`. Now, they need to be executed by running `cypress open-ct` or `cypress run-ct`. Addressed in [#15701](https://github.com/cypress-io/cypress/pull/15701). - `experimentalComponentTesting` must be removed from yoru configuration file, `cypress.json` by default, or it will throw an error. Addressed in [#15701](https://github.com/cypress-io/cypress/pull/15701). - The `file:preprocessor` event is no longer used to compile component tests. Now, a `dev-server:start` event must be registered. - Cypress now catches uncaught errors and fails the test even if the application under test has defined `window.onerror`. Addresses [#8802](https://github.com/cypress-io/cypress/pull/8802). - Cypress now fails tests if there is an unhandled promise rejection in the application under test. Unhandled rejections will trigger the `uncaught:exception` event with the promise as the third argument. Addresses [#243](https://github.com/cypress-io/cypress/issues/243). - Cypress now throws an error if the application under test redirects more than 20 times. The number of times allowed to redirect is configurable via the [`redirectionLimit`](https://on.cypress.io/configuration#Global) config. Addresses [#14445](https://github.com/cypress-io/cypress/issues/14445). - The default preprocessor now targets a more modern version of ECMAScript. Addressed in [#15274](https://github.com/cypress-io/cypress/issues/15274). - We now enable [`contextIsolation`](https://www.electronjs.org/docs/tutorial/context-isolation) by default in the Electron browser. You can override this option if needed within the `before:browser:launch` API. Addressed in [#15493](https://github.com/cypress-io/cypress/pull/15493). - `Cypress.moment()` has been removed. Please migrate to a different datetime formatter. See [our recipe](https://github.com/cypress-io/cypress-example-recipes/tree/master/examples/blogs__dayjs) for example replacements. Addresses [#8714](https://github.com/cypress-io/cypress/issues/8714). - The bundled Node.js version was upgraded from `12.18.3` to `14.16.0`. This could change the behavior of code within the `pluginsFile` when using the [bundled Node.js version](https://on.cypress.io/configuration#Node-version) of Cypress. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292). - Installing Cypress on your system now requires Node.js 12+. Addresses [#9545](https://github.com/cypress-io/cypress/issues/9545). - The default headless browser window size has been increased to 1920x1080 pixels to capture [High-definition videos and screenshots](https://www.cypress.io/blog/2021/03/01/generate-high-resolution-videos-and-screenshots/). Addresses [#15752](https://github.com/cypress-io/cypress/issues/15752), [#15730](https://github.com/cypress-io/cypress/issues/15730), and [#15481](https://github.com/cypress-io/cypress/issues/15481). **Features:** - A command log entry is now displayed when there is an uncaught exception or unhandled rejection. Addresses [#8236](https://github.com/cypress-io/cypress/issues/8236). - We added several features to [cy.intercept()](/api/commands/intercept). See the [cy.intercept()](https://on.cypress.io/intercept) docs for full usage examples. Addressed in [#14543](https://github.com/cypress-io/cypress/pull/14543). New features: - There are new events on the req object for `cy.intercept()` including `before:response`, `response`, and `after:response`. - Response handlers (supplied via event handlers or via `req.continue(cb)`) supplied to `cy.intercept()` will be called in reverse order until `res.send` is called or until there are no more response handlers. - A new option, `middleware`, has been added to the `RouteMatcher` type. If true, the supplied request handler will be called before any non-middleware request handlers. - A new function, `req.continue(cb)`, is available on request objects yielded by `cy.intercept()`. It is functionally the same as `req.reply(cb)` - the request will stop propagating to other event handlers, will be sent outgoing, and the response will be handled by cb. - `cy.intercept()` can now be called with a new overload: `cy.intercept(url, routeMatcher, handler)`. `routeMatcher` will be merged with `url`, and the handler is required. - [`cy.visit()`](https://on.cypress.io/visit) can now visit pages with `application/xhtml*` content-type. Addresses [#15738](https://github.com/cypress-io/cypress/issues/15738). - You can now pass runner specific configuration in order to pass different configuration values to `component` tests versus `e2e` tests. Addressed in [#15526](https://github.com/cypress-io/cypress/pull/15526). - There's a new keyboard shortcut (`ctrl/cmd + f`) to search spec files in the Test Runner based on your OS. Addresses [#6229](https://github.com/cypress-io/cypress/issues/6229). - You can now create a new spec file directly from the Test Runner in the Desktop. Addressed in [#15335](https://github.com/cypress-io/cypress/issues/15335). - [`cy.tick()`](https://on.cypress.io/tick) now accepts a `log` option. Addresses [#15180](https://github.com/cypress-io/cypress/issues/15180). - The Cypress proxy now adds a `keep-alive` header to all proxy responses. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292) - Cypress no longer forces specific `NODE_OPTIONS`. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292) **Bugfixes:** - The `response.body` of [`cy.intercept()`](https://on.cypress.io/intercept) is now correct after stubbing a response using `res.send({ fixture })` in a `req.continue` callback or a `before:response` or `response` handler. Addressed in [#14543](https://github.com/cypress-io/cypress/pull/14543). - Fixed an issue where only the first matching alias for a route would yield a response object on [`cy.wait()`](https://on.cypress.io/wait). Fixes [#14522](https://github.com/cypress-io/cypress/issues/14522). - [`.click()`](https://on.cypress.io/click) will no longer fail with "coordsHistory must be at least 2 sets of coords" when specifying `{ multiple: true }`. Fixes [#3738](https://github.com/cypress-io/cypress/issues/3738). - Cypress now checks visibility correctly when an element has CSS "position: sticky". Fixes [#14938](https://github.com/cypress-io/cypress/issues/14938). - After selecting a project in global mode and clicking the back button, Cypress will no longer crash. Fixes [#15089](https://github.com/cypress-io/cypress/issues/15089). - Errors `Refused to apply style` are gone from the console in `open-ct` during Component Testing. Addressed in [#15661](https://github.com/cypress-io/cypress/issues/15661). - Some memory leaks were fixed in `@cypress/vue`. Addressed in [#15275](https://github.com/cypress-io/cypress/issues/15275). **Misc:** - The types for `set-cookie` allow `string[]`, so the header's type has been changed to reflect this. Addresses [#15419](https://github.com/cypress-io/cypress/pull/15419). - The type definition for [`cy.writeFile()`](https://on.cypress.io/writefile) now allows 4 arguments. Addresses [#15353](https://github.com/cypress-io/cypress/issues/15353). - [`.then()`](https://on.cypress.io/then) will show the correct type when raw HTMLElements are provided. Addresses [#14875](https://github.com/cypress-io/cypress/issues/14875) - The Cypress Studio icon now displays properly for tests with long titles. Addresses [#15182](https://github.com/cypress-io/cypress/issues/15182). - There were some minor improvements made to the UI when setting up a project in the Test Runner. Addressed in [#15665](https://github.com/cypress-io/cypress/pull/15665). **Dependency Updates** - Upgraded Chrome browser version used during `cypress run` and when selecting Electron browser in `cypress open` from `87` to `89`. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292). - Upgraded bundled Node.js version from `12.18.3` to `14.16.0`. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292). - Upgraded `electron` from `11.3.0` to `12.0.0`. Addressed in [#15292](https://github.com/cypress-io/cypress/pull/15292).