Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

12.2.0 release #4932

Merged
merged 6 commits into from
Dec 20, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
51 changes: 51 additions & 0 deletions content/_changelogs/12.2.0.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
## 12.2.0

_Released 12/20/2022_

**Features:**

- Added the ability to match on `resourceType` with
[`cy.intercept()`](https://docs.cypress.io/api/commands/intercept), and to see
the resource type of an intercepted request as `req.resourceType`. Addresses
[#14525](https://github.com/cypress-io/cypress/issues/14525).
- Users working in React Component Testing projects can now generate a basic
spec file from the components that exist in their project. Addresses
[#24008](https://github.com/cypress-io/cypress/issues/24008).

**Performance:**

- Fixed a regression introduced in the Electron browser in
[Cypress 10.8.0](#10-8-0) where the `CYPRESS_EVERY_NTH_FRAME` environment
variable was not being set appropriately causing all frames to be captured
which slowed down tests. Fixes
[#23830](https://github.com/cypress-io/cypress/issues/23830).

**Bugfixes:**

- Fixed an issue where the `query` object was not available on requests from
[`cy.intercept()`](/api/commands/intercept) once they were yielded. Fixes
[#25088](https://github.com/cypress-io/cypress/issues/25088).
- Fixed an issue with Angular Component Testing where urls within SASS/SCSS
files were not being correctly resolved which could result in incomplete
styling. Fixes [#24272](https://github.com/cypress-io/cypress/issues/24272).
- Fixed a regression introduced in [Cypress 12](#12-0-0) where
[`cy.get()`](/api/commands/get) would ignore a `null` value for the
`withinSubject` option. Fixes
[#25104](https://github.com/cypress-io/cypress/issues/25104).
- Fixed an issue where an unhandled promise rejection would display an
incomplete error message in the command log. Fixes
[#24915](https://github.com/cypress-io/cypress/issues/24915).
- Fixed an issue where the incorrect Cypress version could be shown in the
migration wizard. Fixes
[#25138](https://github.com/cypress-io/cypress/issues/25138).
- Fixed an issue where the Cypress migration wizard would fail to run in
[global mode](/guides/guides/command-line#cypress-open-global) on newer
versions of Cypress. Addressed in
[#25138](https://github.com/cypress-io/cypress/issues/25138).
- Fixed an issue with Angular Component Testing where a custom
[`sourceRoot`](https://angular.io/guide/workspace-config#project-configuration-options)
configuration would not be respected. Fixes
[#24827](https://github.com/cypress-io/cypress/issues/24827).
- Fixed Typescript typings for [`cy.nextUntil()`](/api/commands/nextuntil) to
include the `filter` parameter. Fixes
[#24772](https://github.com/cypress-io/cypress/issues/24772).
58 changes: 32 additions & 26 deletions content/api/commands/intercept.md
Original file line number Diff line number Diff line change
Expand Up @@ -114,20 +114,21 @@ glob-matched against the request using
[`Cypress.minimatch`](/api/utilities/minimatch) with the `{ matchBase: true }`
minimatch option applied.

| Option | Description |
| ---------- | ----------------------------------------------------------------------------------------------- |
| auth | HTTP Basic Authentication (`object` with keys `username` and `password`) |
| headers | HTTP request headers (`object`) |
| hostname | HTTP request hostname |
| https | `true`: only secure (https://) requests, `false`: only insecure (http://) requests |
| method | HTTP request method (matches any method by default) |
| middleware | `true`: match route first and in defined order, `false`: match route in reverse order (default) |
| path | HTTP request path after the hostname, including query parameters |
| pathname | Like `path`, but without query parameters |
| port | HTTP request port(s) (`number` or `Array`) |
| query | Parsed query string (`object`) |
| times | Maximum number of times to match (`number`) |
| url | Full HTTP request URL |
| Option | Description |
| ------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- |
| auth | HTTP Basic Authentication (`object` with keys `username` and `password`) |
| headers | HTTP request headers (`object`) |
| hostname | HTTP request hostname |
| https | `true`: only secure (https://) requests, `false`: only insecure (http://) requests |
| method | HTTP request method (matches any method by default) |
| middleware | `true`: match route first and in defined order, `false`: match route in reverse order (default) |
| path | HTTP request path after the hostname, including query parameters |
| pathname | Like `path`, but without query parameters |
| port | HTTP request port(s) (`number` or `Array`) |
| query | Parsed query string (`object`) |
| resourceType | The resource type of the request. See ["Request object properties"](#Request-object-properties) for a list of possible values for `resourceType`. |
| times | Maximum number of times to match (`number`) |
| url | Full HTTP request URL |

See [examples](#With-RouteMatcher) below.

Expand Down Expand Up @@ -964,9 +965,7 @@ From here, you can do several things with the intercepted request:

### Request object properties

The request object (`req`) has several properties from the HTTP request itself.
All of the following properties on `req` can be modified except for
`httpVersion`:
The request object (`req`) has several properties from the HTTP request itself:

```ts
{
Expand Down Expand Up @@ -997,6 +996,12 @@ All of the following properties on `req` can be modified except for
* The HTTP version used in the request. Read only.
*/
httpVersion: string
/**
* The resource type of the request. Read only.
*/
resourceType: 'document' | 'fetch' | 'xhr' | 'websocket' | 'stylesheet'
| 'script' | 'image' | 'font' | 'cspviolationreport' | 'ping'
| 'manifest' | 'other'
}
```

Expand Down Expand Up @@ -1562,15 +1567,16 @@ information about the request and response to the console:

## History

| Version | Changes |
| ------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [7.6.0](/guides/references/changelog#7-0-0) | Added `query` option to `req` (The incoming request object yielded to request handler functions). |
| [7.0.0](/guides/references/changelog#7-0-0) | Removed `matchUrlAgainstPath` option from `RouteMatcher`, reversed handler ordering, added request events, removed substring URL matching, removed `cy.route2` alias, added `middleware` RouteMatcher option, renamed `res.delay()` to `res.setDelay()` and `res.throttle()` to `res.setThrottle()`. |
| [6.4.0](/guides/references/changelog#6-4-0) | Renamed `delayMs` property to `delay` (backwards-compatible). |
| [6.2.0](/guides/references/changelog#6-2-0) | Added `matchUrlAgainstPath` option to `RouteMatcher`. |
| [6.0.0](/guides/references/changelog#6-0-0) | Renamed `cy.route2()` to `cy.intercept()`. |
| [6.0.0](/guides/references/changelog#6-0-0) | Removed `experimentalNetworkStubbing` option and made it the default behavior. |
| [5.1.0](/guides/references/changelog#5-1-0) | Added experimental `cy.route2()` command under `experimentalNetworkStubbing` option. |
| Version | Changes |
| --------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [12.2.0](/guides/references/changelog#12-2-0) | Added `resourceType` property to `req` and `RouteMatcher`. |
| [7.6.0](/guides/references/changelog#7-0-0) | Added `query` option to `req` (The incoming request object yielded to request handler functions). |
| [7.0.0](/guides/references/changelog#7-0-0) | Removed `matchUrlAgainstPath` option from `RouteMatcher`, reversed handler ordering, added request events, removed substring URL matching, removed `cy.route2` alias, added `middleware` RouteMatcher option, renamed `res.delay()` to `res.setDelay()` and `res.throttle()` to `res.setThrottle()`. |
| [6.4.0](/guides/references/changelog#6-4-0) | Renamed `delayMs` property to `delay` (backwards-compatible). |
| [6.2.0](/guides/references/changelog#6-2-0) | Added `matchUrlAgainstPath` option to `RouteMatcher`. |
| [6.0.0](/guides/references/changelog#6-0-0) | Renamed `cy.route2()` to `cy.intercept()`. |
| [6.0.0](/guides/references/changelog#6-0-0) | Removed `experimentalNetworkStubbing` option and made it the default behavior. |
| [5.1.0](/guides/references/changelog#5-1-0) | Added experimental `cy.route2()` command under `experimentalNetworkStubbing` option. |

## See also

Expand Down
24 changes: 19 additions & 5 deletions content/guides/component-testing/react/quickstart.md
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,8 @@ any yet. However, we don't currently have a component, either. Let's change
that!

<DocsImage
src="/img/guides/component-testing/create-your-first-spec.jpg"> </DocsImage>
src="/img/guides/component-testing/create-your-first-spec-cfc.jpg">
</DocsImage>

### Creating a Component

Expand Down Expand Up @@ -159,17 +160,30 @@ mount without any issues.

### Your First Component Test

To get started, create a spec file in the same directory as the **Stepper.jsx**
file and name it **Stepper.cy.jsx**. Then paste the following into it:
To get started, go back to the Cypress test app and, in the "Create your first
spec" screen, click "Create from component".

A modal will pop up listing all the component files that are found in your app
(Cypress will exclude **\*.config.{js,ts}** and **\*.{cy,spec}.{js,ts,jsx,tsx}**
files from this list). Expand the row for **Stepper.jsx** and select the
**Stepper** component:

<DocsImage
src="/img/guides/component-testing/create-from-component-react.jpg">
</DocsImage>

A spec file was created at **src/component/Stepper.cy.jsx**:

<code-group>
<code-block label="src/components/Stepper.cy.jsx" active>

```js
import React from 'react'
import Stepper from './Stepper'

describe('<Stepper>', () => {
it('mounts', () => {
describe('<Stepper />', () => {
it('renders', () => {
// see: https://on.cypress.io/mounting-react
cy.mount(<Stepper />)
})
})
Expand Down
10 changes: 5 additions & 5 deletions content/guides/component-testing/vue/quickstart.md
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@ any yet. However, we don't currently have a component, either. Let's change
that!

<DocsImage
src="/img/guides/component-testing/create-your-first-spec-vue.jpg">
src="/img/guides/component-testing/create-your-first-spec-cfc.jpg">
</DocsImage>

### Creating a Component
Expand Down Expand Up @@ -158,10 +158,10 @@ mount without any issues.
### Your First Component Test

To get started, go back to the Cypress test app and, in the "Create your first
spec" screen, click "Create from Vue component".
spec" screen, click "Create from component".

A modal will pop up listing all the components that is found in your app. Select
the **Stepper.vue** component:
A modal will pop up listing all the components that are found in your app.
Select the **Stepper.vue** component:

<DocsImage
src="/img/guides/component-testing/create-from-component-vue.jpg">
Expand All @@ -177,7 +177,7 @@ import Stepper from './Stepper.vue'

describe('<Stepper />', () => {
it('renders', () => {
// see: https://test-utils.vuejs.org/guide/
// see: https://on.cypress.io/mounting-vue
cy.mount(Stepper)
})
})
Expand Down