Skip to content
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
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file removed assets/img/guides/retry-ability/v10/two-items.png
Binary file not shown.
320 changes: 172 additions & 148 deletions content/_data/sidebar.json

Large diffs are not rendered by default.

16 changes: 11 additions & 5 deletions content/api/commands/and.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@
title: and
---

Create an assertion. Assertions are automatically retried until they pass or
time out.
Create an assertion. Assertions are automatically retried as part of the
previous command until they pass or time out.

<Alert type="info">

Expand Down Expand Up @@ -33,7 +33,9 @@ An alias of [`.should()`](/api/commands/should)

```javascript
cy.get('.err').should('be.empty').and('be.hidden') // Assert '.err' is empty & hidden

cy.contains('Login').and('be.visible') // Assert el is visible

cy.wrap({ foo: 'bar' })
.should('have.property', 'foo') // Assert 'foo' property exists
.and('eq', 'bar') // Assert 'foo' property is 'bar'
Expand All @@ -42,7 +44,10 @@ cy.wrap({ foo: 'bar' })
**<Icon name="exclamation-triangle" color="red"></Icon> Incorrect Usage**

```javascript
cy.and('eq', '42') // Should not be chained off 'cy'
cy.and('eq', '42') // Can not be chained off 'cy'

cy.get('button').click().and('be.focused') // Should not be chained off
// action commands that may update the DOM
```

### Arguments
Expand All @@ -68,8 +73,9 @@ Whatever was passed to the function is what is yielded.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>In most cases, `.and()` yields the same subject it was given from the
previous command.</li></List>
- In most cases, `.and()` yields the same subject it was given.
- `.and()` is an assertion, and it is _safe_ to chain further commands that use
the subject.

```javascript
cy.get('nav') // yields <nav>
Expand Down
8 changes: 4 additions & 4 deletions content/api/commands/as.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ title: as
---

Assign an alias for later use. Reference the alias later within a
[`cy.get()`](/api/commands/get) or [`cy.wait()`](/api/commands/wait) command
with an `@` prefix.
[`cy.get()`](/api/commands/get) query or [`cy.wait()`](/api/commands/wait)
command with an `@` prefix.

<Alert type="info">

Expand Down Expand Up @@ -46,8 +46,8 @@ using an `@` prefix.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.as()` yields the same subject it was given from the previous
command.</li></List>
- `.as()` yields the same subject it was given.
- It is _safe_ to chain further commands after `.as()`.

## Examples

Expand Down
17 changes: 13 additions & 4 deletions content/api/commands/blur.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,20 @@ title: blur

Blur a focused element.

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.blur()`.

<Alert type="warning">

This element must currently be in focus. If you want to ensure an element is
focused before blurring, try using [`.focus()`](/api/commands/focus) before
`.blur()`.

```javascript
cy.get('button').as('btn').focus()
cy.get('@btn').blur()
```

</Alert>

## Syntax
Expand All @@ -24,8 +32,8 @@ focused before blurring, try using [`.focus()`](/api/commands/focus) before
**<Icon name="check-circle" color="green"></Icon> Correct Usage**

```javascript
cy.get('[type="email"]').type('[email protected]').blur() // Blur email input
cy.get('[tabindex="1"]').focus().blur() // Blur el with tabindex
cy.get('[type="email"]').blur() // Blur email input
cy.get('[tabindex="1"]').blur() // Blur el with tabindex
```

**<Icon name="exclamation-triangle" color="red"></Icon> Incorrect Usage**
Expand All @@ -49,8 +57,9 @@ Pass in an options object to change the default behavior of `.blur`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.blur()` yields the same subject it was given from the previous
command.</li></List>
- `.blur()` yields the same subject it was given.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

quick preview pass through - this should be an action command correct?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://docs.cypress.io/api/commands/blur#Actionability

Blur is not an action command

.blur() is not implemented like other action commands, and does not follow the same rules of waiting for actionability.

.blur() is a helpful command used as a shortcut. Normally there's no way for a user to "blur" an element. Typically the user would have to perform another action like clicking or tabbing to a different element. Needing to perform a separate action like this is very indirect.
Therefore it's often much more efficient to test the blur behavior directly with .blur().

- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.blur()`.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/check.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ title: check

Check checkbox(es) or radio(s).

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.check()`.

<Alert type="warning">

This element must be an `<input>` with type `checkbox` or `radio`.
Expand Down Expand Up @@ -62,8 +65,9 @@ Pass in an options object to change the default behavior of `.check()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.check()` yields the same subject it was given from the previous
command.</li></List>
- `.check()` yields the same subject it was given.
- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.check()`.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/children.md
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,8 @@ Pass in an options object to change the default behavior of `.children()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.children()` yields the new DOM element(s) it found.</li></List>
- `.children()` yields the new DOM element(s) it found.
- `.children()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/clear.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ title: clear

Clear the value of an `input` or `textarea`.

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.clear()`.

<Alert type="info">

An alias for [`.type('{selectall}{backspace}')`](/api/commands/type)
Expand Down Expand Up @@ -52,8 +55,9 @@ Pass in an options object to change the default behavior of `.clear()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.clear()` yields the same subject it was given from the previous
command.</li></List>
- `.clear()` yields the same subject it was given.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why drop from the previous command. from all of the API docs?

Suggested change
- `.clear()` yields the same subject it was given.
- `.clear()` yields the same subject it was given from the previous command.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

"From the previous command, query or assertion" is pretty verbose, and I don't think it actually adds any clarity. Assertions usually don't change the subject, but they can! So even before queries, this wasn't quite accurate.

- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.clear()`.

## Examples

Expand Down
3 changes: 1 addition & 2 deletions content/api/commands/clearcookie.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,7 @@ Pass in an options object to change the default behavior of `cy.clearCookie()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`cy.clearCookie()` yields `null`.</li><li>`cy.clearCookie()` cannot be
chained further.</li></List>
- `cy.clearCookie()` yields `null`.

## Examples

Expand Down
3 changes: 1 addition & 2 deletions content/api/commands/clearcookies.md
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,7 @@ Pass in an options object to change the default behavior of `cy.clearCookies()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`cy.clearCookies()` yields `null`.</li><li>`cy.clearCookies()` cannot
be chained further.</li></List>
- `cy.clearCookies()` yields `null`.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is clearCookies a query or a command?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Command. Also not sure it needs to be called out in the 'Yields' header though - it yields null, that's kind of the end of it. 🤷‍♀️

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

curiosity question, if it yields null how can you continue to chain off it?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Showed an example in a comment here - #4835 (comment)

The problem is that "parent" and "child" commands do not work the way you expect them to from the name.

  • Parent commands are those that don't care about their subject - being a parent does not limit where in a chain a command can be!
  • Dual commands accept both null and a valid subject. They behave differently based on what subject they're given.
  • Child commands require a subject. But this is a rule about the subject they're passed, not about their position. cy.end().click() is invalid because the subject is null, not because .end() can't be chained off of.

This is all existing behavior from Cy1-11, covered by our own tests - the docs have just never explained it clearly.

Copy link
Contributor Author

@BlueWinds BlueWinds Nov 10, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  cy.visit('/fixtures/dom.html')
    .clearCookies('foo')
    .clearCookies('foo')
    .clearCookies('foo')
    .get('form')
    .get('form')
    .get('form')

Seven parent commands chained together. Our own tests do this all the time, as do our example repos. Forcing parents to actually be parents or disallowing chaining after a command that returns null would force people to rewrite tests.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The reason we use the term "yields" and not "returns" is because it's stating which subject is passed to the next command, not what is returned from the command. All commands return a chainer object that allows chaining further commands.

While we do indeed use a lot of unnecessary chaining in our tests, there's at least one legitimate use for chaining after a command that yields null:

cy.clearCookies().then(() => {
  // do something after clearing the cookies has completed
})


## Examples

Expand Down
3 changes: 1 addition & 2 deletions content/api/commands/clearlocalstorage.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,7 @@ Pass in an options object to change the default behavior of

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`cy.clearLocalStorage()` yields
`null`.</li><li>`cy.clearLocalStorage()` cannot be chained further.</li></List>
- `cy.clearLocalStorage()` yields `null`.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/click.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ title: click

Click a DOM element.

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.click()`.

## Syntax

```javascript
Expand Down Expand Up @@ -70,8 +73,9 @@ Pass in an options object to change the default behavior of `.click()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.click()` yields the same subject it was given from the previous
command.</li></List>
- `.click()` yields the same subject it was given.
- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.click()`.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/closest.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,8 @@ Pass in an options object to change the default behavior of `.closest()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.closest()` yields the new DOM element(s) it found.</li></List>
- `.closest()` yields the new DOM element(s) it found.
- `.closest()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/contains.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,8 @@ Pass in an options object to change the default behavior of `.contains()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.contains()` yields the new DOM element it found.</li></List>
- `.contains()` yields the new DOM element it found.
- `.contains()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/dblclick.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ title: dblclick

Double-click a DOM element.

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.dblclick()`.

## Syntax

```javascript
Expand Down Expand Up @@ -70,8 +73,9 @@ Pass in an options object to change the default behavior of `.dblclick()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.dblclick()` yields the same subject it was given from the previous
command.</li></List>
- `.dblclick()` yields the same subject it was given.
- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.dblclick()`.

## Examples

Expand Down
4 changes: 2 additions & 2 deletions content/api/commands/debug.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,8 @@ Pass in an options object to change the default behavior of `.debug()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.debug()` yields the same subject it was given from the previous
command.</li></List>
- `.debug()` yields the same subject it was given from the previous command.
- `.debug()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/document.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,8 @@ Pass in an options object to change the default behavior of `cy.document()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`cy.document()` 'yields the `window.document` object' </li></List>
- `cy.document()` 'yields the `window.document` object.
- `cy.document()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/each.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@ title: each
Iterate through an array like structure (arrays or objects with a `length`
property).

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.each()`.

## Syntax

```javascript
Expand Down Expand Up @@ -40,8 +43,9 @@ Pass a function that is invoked with the following arguments:

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.each()` yields the same subject it was given from the previous
command.</li></List>
- `.each()` yields the same subject it was given.
- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.each()`.

## Examples

Expand Down
5 changes: 2 additions & 3 deletions content/api/commands/end.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,13 +21,12 @@ cy.contains('ul').end() // Yield 'null' instead of 'ul' element
**<Icon name="exclamation-triangle" color="red"></Icon> Incorrect Usage**

```javascript
cy.end() // Does not make sense to chain off 'cy'
cy.end()
```

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.end()` yields `null`.</li><li>`.end()` cannot be chained
further.</li></List>
- `.end()` yields `null`.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/eq.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,8 @@ Pass in an options object to change the default behavior of `.eq()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.eq()` yields the new DOM element(s) it found.</li></List>
- `.eq()` yields the new DOM element it found.
- `.eq()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/filter.md
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,8 @@ Pass in an options object to change the default behavior of `.filter()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.filter()` yields the new DOM element(s) it found.</li></List>
- `.filter()` yields the new DOM element(s) it found.
- `.filter()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/find.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,8 @@ Pass in an options object to change the default behavior of `.find()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.find()` yields the new DOM element(s) it found.</li></List>
- `.find()` yields the new DOM element(s) it found.
- `.find()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
3 changes: 2 additions & 1 deletion content/api/commands/first.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,8 @@ Pass in an options object to change the default behavior of `.first()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.first()` yields the new DOM element(s) it found.</li></List>
- `.first()` yields the new DOM element it found.
- `.first()` is a query, and it is _safe_ to chain further commands.

## Examples

Expand Down
5 changes: 3 additions & 2 deletions content/api/commands/fixture.md
Original file line number Diff line number Diff line change
Expand Up @@ -71,8 +71,9 @@ Pass in an options object to change the default behavior of `cy.fixture()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

`cy.fixture()` yields the contents of the file. Formatting is determined by its
file extension.
- `cy.fixture()` yields the contents of the file. Formatting is determined by
its file extension.
- The yielded subject is **not** updated if the contents change on disk.

## Examples

Expand Down
8 changes: 6 additions & 2 deletions content/api/commands/focus.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,9 @@ title: focus

Focus on a DOM element.

It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried) to
chain further commands that rely on the subject after `.focus()`.

## Syntax

```javascript
Expand Down Expand Up @@ -39,8 +42,9 @@ Pass in an options object to change the default behavior of `.focus()`.

### Yields [<Icon name="question-circle"/>](/guides/core-concepts/introduction-to-cypress#Subject-Management)

<List><li>`.focus()` yields the same subject it was given from the previous
command.</li></List>
- `.focus()` yields the same subject it was given.
- It is [unsafe](/guides/core-concepts/retry-ability#Only-queries-are-retried)
to chain further commands that rely on the subject after `.focus()`.

## Examples

Expand Down
Loading