mirror/cypress
1
0
Fork 0
mirror of https://github.com/cypress-io/cypress.git synced 2026-05-24 17:38:52 -05:00
Code Issues Packages Projects Releases Wiki Activity

docs: Cleaning up API

Browse Source
This commit is contained in:
Jennifer Shehane
2017-06-01 12:03:29 -04:00
parent 98e804990c
commit da36309c93
20 changed files with 239 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/source/api/commands/and.md
+7 -7
View File
@@ -10,8 +10,8 @@ Make an assertion.
An alias of [`.should()`](https://on.cypress.io/api/and)
{% endnote %}
{% note info New to Cypress? %}
[Read about Making Assertions first.](https://on.cypress.io/guides/making-assertions)
{% note info %}
**Note:** `.and()` assumes you are already familiar with core concepts such as [assertions](https://on.cypress.io/guides/making-assertions)
{% endnote %}
# Syntax
@@ -20,7 +20,7 @@ An alias of [`.should()`](https://on.cypress.io/api/and)
.and(chainers)
.and(chainers, value)
.and(chainers, method, value)
.and(function() {})
.and(callbackFn)
```
## Usage
@@ -30,8 +30,8 @@ An alias of [`.should()`](https://on.cypress.io/api/and)
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('.error').should('be.empty').and('be.hidden') // Yields '.error' el
cy.contains('Login').and('be.visible') // Yields el containing Login
cy.get('.error').should('be.empty').and('be.hidden') // Assert '.error' is empty & hidden
cy.contains('Login').and('be.visible') // Assert el is visible
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -54,7 +54,7 @@ Value to assert against chainer.
A method to be called on the chainer.
**{% fa fa-angle-right %} function** ***(Function)***
**{% fa fa-angle-right %} callbackFn** ***(Function)***
Pass a function that can have any number of explicit assertions within it. Whatever was passed to the function is what is yielded.
@@ -236,5 +236,5 @@ When clicking on `assert` within the command log, the console outputs the follow
# See also
- [should](https://on.cypress.io/api/should)
- [Making Assertions](https://on.cypress.io/guides/making-assertions)
- [should](https://on.cypress.io/api/should)
docs/source/api/commands/as.md
+10 -11
View File
@@ -4,10 +4,10 @@ comments: true
description: ''
---
Assign an alias to a route or DOM element for later use. Reference the alias later within a [`.get()`](https://on.cypress.io/api/get) or [`.wait()`](https://on.cypress.io/api/wait) command with a `@` prefix.
Assign an alias for later use. Reference the alias later within a [`.get()`](https://on.cypress.io/api/get) or [`.wait()`](https://on.cypress.io/api/wait) command with a `@` prefix.
{% note info New to Cypress? %}
[Read about Using Aliases first.](https://on.cypress.io/guides/using-aliases)
{% note info %}
**Note:** `.as()` assumes you are already familiar with core concepts such as [aliases](https://on.cypress.io/guides/using-aliases)
{% endnote %}
# Syntax
@@ -18,22 +18,21 @@ Assign an alias to a route or DOM element for later use. Reference the alias lat
## Usage
`.as()` requires being chained off another cy command that *yields* a DOM element, [`.stub()`](https://on.cypress.io/api/stub), [`.spy()`](https://on.cypress.io/api/spy) or [`.route()`](https://on.cypress.io/api/route).
`.as()` should be chained off another cy command.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('.main-nav').find('li').first().as('firstNav')
cy.route('PUT', 'users', 'fx:user').as('putUser')
cy.stub(api, 'onUnauth').as('unauth')
cy.spy(win, 'fetch').as('winFetch')
cy.get('.main-nav').find('li').first().as('firstNav') // Alias first 'li' as @firstNav
cy.route('PUT', 'users', 'fx:user').as('putUser') // Alias 'route' as @putUser
cy.stub(api, 'onUnauth').as('unauth') // Alias 'stub' as @unauth
cy.spy(win, 'fetch').as('winFetch') // Alias 'spy' as @winFetch
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
```javascript
cy.as('foo') // Errors, cannot be chained off 'cy'
cy.title().as('pageTitle') // Errors, 'title' yields a string
cy.as('foo') // Errors, cannot be chained off 'cy'
```
## Arguments
@@ -98,5 +97,5 @@ Aliases of routes display in the routes instrument panel:
# See also
- [get](https://on.cypress.io/api/get)
- [wait](https://on.cypress.io/api/wait)
- [Using Aliases](https://on.cypress.io/guides/using-aliases)
- [wait](https://on.cypress.io/api/wait)
docs/source/api/commands/blur.md
+11 -11
View File
@@ -15,15 +15,13 @@ Make a focused DOM element blur.
## Usage
`.blur()` requires being chained off another cy command that *yields* a DOM element that is currently in focus.
If you want to ensure an element is focused before blurring, try using [`.focus()`](https://on.cypress.io/focus) before `.blur()`
`.blur()` requires being chained off another cy command that *yields* a DOM element that is currently in focus. If you want to ensure an element is focused before blurring, try using [`.focus()`](https://on.cypress.io/focus) before `.blur()`.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('[type="email"]').type('me@email.com').blur() // Blurs email input
cy.get('[tabindex="1"]').focus().blur() // Blurs el with tabindex
cy.get('[type="email"]').type('me@email.com').blur() // Blur email input
cy.get('[tabindex="1"]').focus().blur() // Blur el with tabindex
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -42,15 +40,15 @@ Pass in an options object to change the default behavior of `.blur`.
Option | Default | Notes
--- | --- | ---
`force` | `false` | Forces blur, disables checking if el is focusable or focused
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
## Yields
`.blur()` yields the DOM element from the previous command.
`.blur()` yields the DOM element that was blurred.
## Timeout
`.blur()` will continue to look for the focusable element to blur for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`.blur()` will continue to look for the focusable element to blur for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
@@ -62,9 +60,11 @@ Option | Default | Notes
cy.get('[name="comment"]').type('Nice Product!').blur()
```
# Options
## Options
**Blur the first input, ignoring whether the input is currently focused.**
**Blur the first input**
Setting `force` to `true` in the options disables checking whether the input is focusable or currently has focus.
```javascript
cy.get('input:first').blur({ force: true })
@@ -94,5 +94,5 @@ When clicking on the `blur` command within the command log, the console outputs
# See also
- [focused](https://on.cypress.io/api/focused)
- [focus](https://on.cypress.io/api/focus)
- [focused](https://on.cypress.io/api/focused)
docs/source/api/commands/check.md
+12 -13
View File
@@ -24,8 +24,8 @@ Check checkbox(es) or radio(s).
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('[type="checkbox"]').check() // Yields checkbox element
cy.get('[type="radio"]').first().check() // Yields first radio element
cy.get('[type="checkbox"]').check() // Check checkbox element
cy.get('[type="radio"]').first().check() // Check first radio element
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -51,14 +51,14 @@ Pass in an options object to change the default behavior of `.check()`.
Option | Default | Notes
--- | --- | ---
`interval` | `16` | Interval which to retry a check
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry the check
`force` | `false` | Forces check, disables error checking prior to check
`log` | `true` | whether to display command in command log
`interval` | `16` | Interval which to retry a check
`log` | `true` | Whether to display command in Command Log
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry the check
## Yields
`.check()` yields the DOM element from the previous command.
`.check()` yields the DOM element(s) that were checked.
## Timeout
@@ -80,7 +80,7 @@ cy.get('[type="checkbox"]').check()
cy.get('[type="radio"]').check()
```
**Check the element with id of `saveUserName`**
**Check the element with id of 'saveUserName'**
```javascript
cy.get('#saveUserName').check()
@@ -96,7 +96,7 @@ cy.get('[type="radio"]').check('US')
## Values
**Check the checkboxes with the value of 'ga' and 'ca'**
**Check the checkboxes with the values 'ga' and 'ca'**
```javascript
cy.get('[type="checkbox"]').check(['ga', 'ca'])
@@ -106,12 +106,11 @@ cy.get('[type="checkbox"]').check(['ga', 'ca'])
**Check an invisible checkbox**
You can ignore Cypress' default behavior of checking that the element is visible, clickable and not disabled by passing `force: true` in the `.check()` options.
You can ignore Cypress' default behavior of checking that the element is visible, clickable and not disabled by setting `force` to `true` in the options.
```javascript
cy
.get('.action-checkboxes').should('not.be.visible') // Passes
.check({force: true}).should('be.checked') // Passes
cy.get('.action-checkboxes').should('not.be.visible') // Passes
.check({ force: true }).should('be.checked') // Passes
```
# Command Log
@@ -132,5 +131,5 @@ When clicking on `check` within the command log, the console outputs the followi
# See also
- [uncheck](https://on.cypress.io/api/uncheck)
- [click](https://on.cypress.io/api/click)
- [uncheck](https://on.cypress.io/api/uncheck)
docs/source/api/commands/children.md
+6 -6
View File
@@ -22,7 +22,7 @@ Get the children of each DOM element within a set of DOM elements.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('nav').children() // Yield children of nav
cy.get('nav').children() // Yield children of nav
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -40,20 +40,20 @@ A selector used to filter matching DOM elements.
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `cy.children`.
Pass in an options object to change the default behavior of `.children()`.
Option | Default | Notes
--- | --- | ---
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry getting the element(s)
## Yields
`.children()` yields the new DOM elements found by the command.
`.children()` yields the new DOM element(s) found by the command.
## Timeout
`.children()` will continue to look for the children elements for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`.children()` will continue to look for the children elements for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
@@ -126,7 +126,7 @@ When clicking on the `children` command within the command log, the console outp
# See also
- [next](https://on.cypress.io/api/next)
- [parent](https://on.cypress.io/api/parent)
- [parents](https://on.cypress.io/api/parents)
- [next](https://on.cypress.io/api/next)
- [siblings](https://on.cypress.io/api/siblings)
docs/source/api/commands/clear.md
+11 -11
View File
@@ -4,7 +4,11 @@ comments: true
description: ''
---
Clears the value of an `input` or `textarea`. An alias for `cy.type('{selectall}{backspace}')`
Clear the value of an `input` or `textarea`.
{% note info %}
An alias for [`cy.type('{selectall}{backspace}')`](https://on.cypress.io/api/type)
{% endnote %}
# Syntax
@@ -37,14 +41,14 @@ cy.url().clear() // Errors, 'url' doesn't yield DOM element
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `.clear`.
Pass in an options object to change the default behavior of `.clear()`.
Option | Default | Notes
--- | --- | ---
`force` | `false` | Forces clear, disables error checking prior to clear
`force` | `false` | Force clear, disables error checking prior to clear
`interval` | `16` | Interval which to retry clear
`log` | `true` | Whether to display command in Command Log
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry the clear
`log` | `true` | whether to display command in command log
## Yields
@@ -52,7 +56,7 @@ Option | Default | Notes
## Timeout
`.clear()` will continue to look for the `input` or `textarea` for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`.clear()` will continue to look for the `input` or `textarea` for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
@@ -62,17 +66,13 @@ Option | Default | Notes
Prior to clearing, if the element isn't currently focused, Cypress issues a [.click()](https://on.cypress.io/api/click) on the element, which causes the element to receive focus.
```html
<input name="name" value="John Doe" />
```
```javascript
cy.get('input[name="name"]').clear().type('Jane Lane')
cy.get('textarea').clear().type('Hello, World')
```
# Command Log
## Clear the input and type a new value
**Clear the input and type a new value**
```javascript
cy.get('input[name="name"]').clear().type('Jane Lane')
docs/source/api/commands/clearcookie.md
+15 -16
View File
@@ -12,19 +12,20 @@ Cypress automatically clears all cookies *before* each test to prevent state fro
# Syntax
```javascript
.clearCookie(name)
.clearCookie(name, options)
cy.clearCookie(name)
cy.clearCookie(name, options)
```
## Usage
`.clearCookie()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
`cy.clearCookie()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.clearCookie('authId')
cy.clearCookie('authId') // clear the 'authId' cookie
```
## Arguments
@@ -35,20 +36,20 @@ The name of the cookie to be cleared.
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `.clearCookie`.
Pass in an options object to change the default behavior of `cy.clearCookie()`.
Option | Default | Notes
--- | --- | ---
`timeout` | [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to wait for the `.clearCookie()` command to be processed
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
`timeout` | [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to wait for the `cy.clearCookie()` command to be processed
## Yields
`.clearCookie()` yields `null`
`cy.clearCookie()` yields `null`.
## Timeout
`.clearCookie()` will wait up for the duration of [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) for the automation server to process this command.
`cy.clearCookie()` will wait up for the duration of [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) for the automation server to process the command.
# Examples
@@ -56,10 +57,9 @@ Option | Default | Notes
**Clear a cookie after logging in**
In this example, on first login our server sends us back a session cookie. After invoking `cy.clearCookie('session_id')` this clears the session cookie, and upon navigating to an unauthorized page, we asset that our server has redirected us back to login.
In this example, on first login, our server sends us back a session cookie. After invoking `cy.clearCookie('session_id')`, this clears the session cookie. Then upon navigating to an unauthorized page, we asset that our server has redirected us back to login.
```javascript
cy
// assume we just logged in
cy.contains('Login').click()
cy.url().should('include', 'profile')
@@ -73,10 +73,9 @@ cy.url().should('include', 'login')
**Clearing a cookie after setting a cookie**
```javascript
cy
.setCookie('foo', 'bar')
.clearCookie('foo')
.getCookie('foo').should('be.null')
cy.setCookie('foo', 'bar')
cy.clearCookie('foo')
cy.getCookie('foo').should('be.null')
```
The commands above will display in the command log as:
@@ -90,7 +89,7 @@ When clicking on `clearCookie` within the command log, the console outputs the f
# See also
- [clearCookies](https://on.cypress.io/api/clearcookies)
- [Cypress Cookies API](https://on.cypress.io/api/cookies)
- [getCookie](https://on.cypress.io/api/getcookie)
- [getCookies](https://on.cypress.io/api/getcookies)
- [setCookie](https://on.cypress.io/api/setcookie)
- [Cypress Cookies API](https://on.cypress.io/api/cookies)
docs/source/api/commands/clearcookies.md
+20 -22
View File
@@ -13,38 +13,38 @@ Cypress automatically clears all cookies *before* each test to prevent state fro
# Syntax
```javascript
.clearCookies()
.clearCookies(options)
cy.clearCookies()
cy.clearCookies(options)
```
## Usage
`.clearCookies()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
`cy.clearCookies()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.clearCookies()
cy.clearCookies() // clear all cookies
```
## Arguments
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `cy.clearCookies`.
Pass in an options object to change the default behavior of `cy.clearCookies()`.
Option | Default | Notes
--- | --- | ---
`timeout` | [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to wait for the `.clearCookies()` command to be processed
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
`timeout` | [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to wait for the `cy.clearCookies()` command to be processed
## Yields
`.clearCookies()` yields `null`
`cy.clearCookies()` yields `null`.
## Timeout
`.clearCookies()` will wait up for the duration of [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) for the automation server to process this command.
`cy.clearCookies()` will wait up for the duration of [`responseTimeout`](https://on.cypress.io/guides/configuration#timeouts) for the automation server to process this command.
# Examples
@@ -52,16 +52,15 @@ Option | Default | Notes
**Clear all cookies after logging in**
In this example, on first login our server sends us back a session cookie. After invoking `cy.clearCookies` this clears the session cookie, and upon navigating to an unauthorized page, our server should have redirected us back to login.
In this example, on first login our server sends us back a session cookie. After invoking `cy.clearCookies()` this clears the session cookie, and upon navigating to an unauthorized page, our server should have redirected us back to login.
```javascript
cy
// assume we just logged in
.contains('Login').click()
.url().should('include', 'profile')
.clearCookies()
.visit('/dashboard') // we should be redirected back to login
.url().should('include', 'login')
// assume we just logged in
cy.contains('Login').click()
cy.url().should('include', 'profile')
cy.clearCookies()
cy.visit('/dashboard') // we should be redirected back to login
cy.url().should('include', 'login')
```
# Command Log
@@ -69,10 +68,9 @@ cy
**Clear cookies after getting cookies**
```javascript
cy
.getCookies().should('have.length', 1)
.clearCookies()
.getCookies().should('be.empty')
cy.getCookies().should('have.length', 1)
cy.clearCookies()
cy.getCookies().should('be.empty')
```
The commands above will display in the command log as:
@@ -86,7 +84,7 @@ When clicking on `clearCookies` within the command log, the console outputs the
# See also
- [clearCookie](https://on.cypress.io/api/clearcookie)
- [Cypress Cookies API](https://on.cypress.io/api/cookies)
- [getCookie](https://on.cypress.io/api/getcookie)
- [getCookies](https://on.cypress.io/api/getcookies)
- [setCookie](https://on.cypress.io/api/setcookie)
- [Cypress Cookies API](https://on.cypress.io/api/cookies)
docs/source/api/commands/clearlocalstorage.md
+6 -7
View File
@@ -13,18 +13,18 @@ Cypress automatically runs this command *before* each test to prevent state from
# Syntax
```javascript
.clearLocalStorage()
.clearLocalStorage(keys)
cy.clearLocalStorage()
cy.clearLocalStorage(keys)
```
## Usage
`.clearLocalStorage()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
`cy.clearLocalStorage()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.clearLocalStorage()
cy.clearLocalStorage() // clear all local storage
```
## Arguments
@@ -35,11 +35,11 @@ Specify keys to be cleared in local storage.
## Yields
`.clearLocalStorage()` yields the remove local storage object.
`cy.clearLocalStorage()` yields the remove local storage object.
## Timeout
`.clearLocalStorage()` will wait up for the duration of [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) to process this command.
`cy.clearLocalStorage()` will wait up for the duration of [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) to process this command.
# Examples
@@ -65,7 +65,6 @@ cy.clearLocalStorage('appName')
cy.clearLocalStorage(/app-/)
```
# Command Log
```javascript
docs/source/api/commands/click.md
+23 -25
View File
@@ -24,9 +24,9 @@ Click a DOM element.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('button').click() // Clicks on button
cy.focused().click() // Clicks on el with focus
cy.contains('Welcome').click() // Clicks on first el containing 'Welcome'
cy.get('button').click() // Click on button
cy.focused().click() // Click on el with focus
cy.contains('Welcome').click() // Click on first el containing 'Welcome'
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -40,37 +40,37 @@ cy.window().click() // Errors, 'window' does not yield DOM element
**{% fa fa-angle-right %} position** ***(String)***
Clicks the element at the specified position. The `center` position is the default position. Valid positions are `topLeft`, `top`, `topRight`, `left`, `center`, `right`, `bottomLeft`, `bottom`, and `bottomRight`.
The position where the click should be issued. The `center` position is the default position. Valid positions are `topLeft`, `top`, `topRight`, `left`, `center`, `right`, `bottomLeft`, `bottom`, and `bottomRight`.
![cypress-command-positions-diagram](https://cloud.githubusercontent.com/assets/1271364/25048528/fe0c6378-210a-11e7-96bc-3773f774085b.jpg)
**{% fa fa-angle-right %} x** ***(Number)***
The distance in pixels from element's left to issue the click.
The distance in pixels from the element's left to issue the click.
**{% fa fa-angle-right %} y** ***(Number)***
The distance in pixels from element's top to issue the click.
The distance in pixels from the element's top to issue the click.
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `.click`.
Pass in an options object to change the default behavior of `.click()`.
Option | Default | Notes
--- | --- | ---
`force` | `false` | Forces click, disables error checking prior to click
`multiple` | `false` | Enables serially clicking multiple elements
`force` | `false` | Force click, disables error checking prior to click
`interval` | `16` | Interval which to retry a click
`log` | `true` | Whether to display command in Command Log
`multiple` | `false` | Enable serially clicking multiple elements
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry the click
`log` | `true` | whether to display command in command log
## Yields
`.click()` yields the DOM subject chained from the previous command.
`.click()` yields the element that was clicked.
## Timeout
`.click()` will wait until the element is in a 'clickable' state for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) or the duration of the `timeout` specified in the command's options
`.click()` will wait until the element is in a 'clickable' state for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) or the duration of the `timeout` specified in the command's options.
# Examples
@@ -79,7 +79,6 @@ Option | Default | Notes
**Click the button**
```javascript
// yields <button>Save</button>
cy.get('button').click()
```
@@ -110,7 +109,6 @@ cy.get('button').click(15, 40)
Forcing a click is useful when you want the click issued no matter what. Forcing a click disables checking that this element is visible and in a clickable state before clicking.
```javascript
cy.get('button').click({ force: true })
```
@@ -132,7 +130,7 @@ cy.get('button').click(5, 60, { force: true })
**Hover and clicking hidden elements**
{% note info %}
[Check out our example recipe on testing hover and working with hidden elements](https://github.com/cypress-io/cypress-example-recipes/blob/master/cypress/integration/hover_hidden_elements.js)
[Check out our example recipe on testing hover and working with hidden elements.](https://github.com/cypress-io/cypress-example-recipes/blob/master/cypress/integration/hover_hidden_elements.js)
{% endnote %}
**Click all buttons found on the page**
@@ -155,15 +153,15 @@ cy.get('button').click()
The events are fired to spec, including the coordinates of where the event took place.
At the moment, `mouseover` and `mouseout` events are *not* fired but this will be done soon.
At the moment, `mouseover` and `mouseout` events are *not* fired. [Open an issue](https://github.com/cypress-io/cypress/issues/new) if you need this to be fixed.
Additionally if the `mousedown` event causes the element to be removed from the DOM, the remaining events should continue to be fired, but to the resulting element left below the removed element. This has also not been implemented but will be implemented at some point.
Additionally if the `mousedown` event causes the element to be removed from the DOM, the remaining events should continue to be fired, but to the resulting element left below the removed element. This has also not been implemented. [Open an issue](https://github.com/cypress-io/cypress/issues/new) if you need this to be fixed.
**Focus is given to the first focusable element**
Just like real browsers, clicking a `<span>`, for example, inside of a `<button>` will properly give the focus to the button, since that's what would happen in a real user scenario.
Clicking a `<span>`, for example, inside of a `<button>` gives the focus to the button, since that's what would happen in a real user scenario.
However, Cypress additionally handles situations where a child descendent is clicked inside of a focusable parent, but actually isn't visually inside the parent (per the CSS Object Model). In those cases if no focusable parent is found the window is given focus instead (which matches a real browser).
However, Cypress additionally handles situations where a child descendent is clicked inside of a focusable parent, but actually isn't visually inside the parent (per the CSS Object Model). In those cases if no focusable parent is found the window is given focus instead (which matches real browser behavior).
**Mousedown cancellation will not cause focus**
@@ -171,7 +169,7 @@ If the mousedown event has its default action prevented (`e.preventDefault()`) t
**Coordinates of a click**
The coordinates of the click will be recorded the exact moment the click happens. When hovering over the `click` command, Cypress will display a red "hitbox" indicator on the snapshot showing you where the click event occurred on the page.
The coordinates of the click will be recorded the exact moment the click happens. When hovering over the `click` command, Cypress displays a red "hitbox" indicator on the snapshot showing you where the click event occurred on the page.
**pointer-events: none**
@@ -183,13 +181,13 @@ The spec states what should happen if the element clicked is removed from the DO
**Animations**
Unlike other testing frameworks, like Selenium, Cypress has built in logic for dealing with both CSS and JavaScript animations. Cypress will detect if an element is animating and will wait until the element reaches a clickable state. You will never deal with a situation where Cypress accidentally clicks the *wrong* element.
Unlike most testing frameworks, Cypress has built in logic for dealing with CSS and JavaScript animations. Cypress detects if an element is animating and waits until the element reaches a clickable state. You will never deal with a situation where Cypress accidentally clicks the *wrong* element.
However, sometimes when dealing with 3rd party plugins that animate using JavaScript, Cypress logic to scroll an element into view can be affected. Cypress (acting like a real user) will attempt to position the element onscreen by scrolling all parent elements that need to be scrolled (just like a real user) prior to making a click. This *may* have an adverse affect if a 3rd party plugin is bound to the `scroll` event. Cypress is so fast that sometimes there are timing issues where 3rd party plugins have incorrectly calculated animations and sometimes even prevent an element from displaying altogether.
However, sometimes when dealing with 3rd party plugins that animate, Cypress' logic to scroll an element into view can be affected.
These situations are rare, but if you're having a difficult time getting an element to click or experiencing seemingly *random* failures, you will save *yourself hours of debugging and headache* by simply issuing the `{force: true}` option to the click or by inserting a small delay prior to the click with [`cy.wait(ms)`](https://on.cypress.io/api/wait). It is almost never worth your time trying to debug finicky animation issues caused by 3rd party plugins.
Cypress attempts to position the element onscreen by scrolling all parent elements that need to be scrolled (just like a real user) prior to making a click. This *may* have an adverse affect if a 3rd party plugin is bound to the `scroll` event.
So far the only library we've seen cause issues with is animating KendoUI's `dropdownlist`. By using `{force: true}` or inserting a small `wait` prior to a click, these issues completely go away.
These situations are rare, but if you're having a difficult time clicking an element or experiencing seemingly *random* failures, you will save *yourself hours of debugging and headache* by simply issuing the `{force: true}` option to the click or by inserting a small delay prior to the click with [`cy.wait(ms)`](https://on.cypress.io/api/wait). It is almost never worth your time trying to debug finicky animation issues caused by 3rd party plugins.
# Command Log
@@ -209,7 +207,7 @@ When clicking on `click` within the command log, the console outputs the followi
# See also
- [dblclick](https://on.cypress.io/api/dblclick)
- [check](https://on.cypress.io/api/check)
- [dblclick](https://on.cypress.io/api/dblclick)
- [select](https://on.cypress.io/api/select)
- [submit](https://on.cypress.io/api/submit)
docs/source/api/commands/clock.md
+20 -18
View File
@@ -4,7 +4,7 @@ comments: true
description: ''
---
`.clock()` overrides native global functions related to time allowing them to be controlled synchronously via [`.tick()`](https://on.cypress.io/api/tick) or the yielded `clock` object. This includes controlling:
`cy.clock()` overrides native global functions related to time allowing them to be controlled synchronously via [`cy.tick()`](https://on.cypress.io/api/tick) or the yielded `clock` object. This includes controlling:
- `setTimeout`
- `clearTimeout`
@@ -51,19 +51,19 @@ Pass in an options object to change the default behavior of `cy.clock()`.
Option | Default | Notes
--- | --- | ---
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
## Yields
`cy.clock()` yields a `clock` object with the following methods.
`cy.clock()` yields a `clock` object with the following methods:
**`clock.tick(milliseconds)`**
- **`clock.tick(milliseconds)`**
Move the clock the specified number of `milliseconds`. Any timers within the affected range of time will be called.
Move the clock the specified number of `milliseconds`. Any timers within the affected range of time will be called.
**`clock.restore()`**
- **`clock.restore()`**
Restore all overridden native functions. This is automatically called between tests, so should not generally be needed.
Restore all overridden native functions. This is automatically called between tests, so should not generally be needed.
You can also access the `clock` object via `this.clock` in a [`.then()`](https://on.cypress.io/api/then) callback.
@@ -95,7 +95,7 @@ cy.get('#seconds-elapsed').should('have.text', '2 seconds')
**Access the clock object to synchronously move time**
In most cases, it's easier to [`.tick()`](https://on.cypress.io/api/tick) to move time, but you can also use the `clock` object yielded by `cy.clock()`.
In most cases, it's easier to use [`cy.tick()`](https://on.cypress.io/api/tick) to move time, but you can also use the `clock` object yielded by `cy.clock()`.
```javascript
cy.clock().then(function (clock) {
@@ -103,7 +103,7 @@ cy.clock().then(function (clock) {
})
```
You can call `.clock()` again for this purpose later in a chain if necessary.
You can call `cy.clock()` again for this purpose later in a chain if necessary.
```javascript
cy.clock()
@@ -113,7 +113,7 @@ cy.clock().then(function (clock) {
})
```
The clock object is also available via `this.clock` in any `.then` callback.
The clock object is also available via `this.clock` in any [`.then()`](https://on.cypress.io/api/then) callback.
```javascript
cy.clock()
@@ -125,7 +125,7 @@ cy.get('form').then(function ($form) {
**Access the clock object to restore native functions**
In general, it should not be necessary to manually restore the native functions that `cy.clock()` overrides, since this is done automatically between tests. But if you need to, the `clock` object yielded has a `.restore` method.
In general, it should not be necessary to manually restore the native functions that `cy.clock()` overrides since this is done automatically between tests. But if you need to, the `clock` object yield has a `.restore()` method.
```javascript
cy.clock().then(function (clock) {
@@ -170,19 +170,21 @@ This example below will only override `setTimeout` and `clearTimeout` and leave
cy.clock(null, ['setTimeout', 'clearTimeout'])
```
{% note info Using cy.clock and cy.tick %}
[Check out our example recipe testing spying, stubbing and time](https://github.com/cypress-io/cypress-example-recipes/blob/master/cypress/integration/spy_stub_clock_spec.js)
**Using cy.clock() and cy.tick()**
{% note info %}
[Check out our example recipe testing spying, stubbing and time.](https://github.com/cypress-io/cypress-example-recipes/blob/master/cypress/integration/spy_stub_clock_spec.js)
{% endnote %}
# Notes
**iframes not supported**
Note that this only applies to the `top` window on a web page. It will not override the time functions on any `iframe` embedded on the web page.
Note that `cy.clock()` only applies to the `top` window on a web page. It will not override the time functions of any `iframe` embedded on the page.
**clock behavior before `.visit()`**
**clock behavior before `cy.visit()`**
If you call `cy.clock` before visiting a page with [`cy.visit`](https://on.cypress.io/api/visit), the page's native global functions will be overridden on window load, before any of your app code runs, so even if `setTimeout`, for example, is called on page load, it can still be controlled via [`cy.tick`](https://on.cypress.io/api/tick). This also applies if, during the course of a test, the page under test is reloaded or changed.
If you call `cy.clock()` before visiting a page with [`cy.visit()`](https://on.cypress.io/api/visit), the page's native global functions will be overridden on window load, before any of your app code runs, so even if `setTimeout`, for example, is called on page load, it can still be controlled via [`cy.tick()`](https://on.cypress.io/api/tick). This also applies if, during the course of a test, the page under test is reloaded or changed.
# Command Log
@@ -204,7 +206,7 @@ When clicking on the `clock` command within the command log, the console outputs
# See also
- [Guide: Stubs, Spies and Clocks ](https://on.cypress.io/guides/stubs-spies-clocks)
- [Recipe: Controlling Behavior with Spies, Stubs, and Clocks](https://github.com/cypress-io/cypress-example-recipes#controlling-behavior-with-spies-stubs-and-clocks)
- [tick](https://on.cypress.io/api/tick)
- [spy](https://on.cypress.io/api/spy)
- [stub](https://on.cypress.io/api/stub)
- [Recipe: Controlling Behavior with Spies, Stubs, and Clocks](https://github.com/cypress-io/cypress-example-recipes#controlling-behavior-with-spies-stubs-and-clocks)
- [tick](https://on.cypress.io/api/tick)
docs/source/api/commands/closest.md
+5 -5
View File
@@ -51,21 +51,21 @@ Option | Default | Notes
## Timeout
`.closest()` will continue to look for the closest element for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`.closest()` will continue to look for the closest element for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
## Closest
**Find the closest element of the current subject with the class `nav`**
**Find the closest element of the 'error' with the class 'banner'**
```javascript
cy.get('li.active').closest('.nav')
cy.get('p.error').closest('.banner')
```
# Command Log
**Find the closest element of the current subject with the class `nav`**
**Find the closest element of 'active li' with the class 'nav'**
```javascript
cy.get('li.active').closest('.nav')
@@ -81,10 +81,10 @@ When clicking on the `closest` command within the command log, the console outpu
# See also
- [first](https://on.cypress.io/api/first)
- [parent](https://on.cypress.io/api/parent)
- [parents](https://on.cypress.io/api/parents)
- [parentsUntil](https://on.cypress.io/api/parentsUntil)
- [prev](https://on.cypress.io/api/prev)
- [prevAll](https://on.cypress.io/api/prevAll)
- [prevUntil](https://on.cypress.io/api/prevUntil)
- [first](https://on.cypress.io/api/first)
docs/source/api/commands/contains.md
+32 -52
View File
@@ -4,14 +4,14 @@ comments: true
description: ''
---
Get the DOM element containing the text. DOM elements can contain *more* than the desired text and still match. Additionally, Cypress will [prefer some DOM elements](#notes) over the deepest element found.
Get the DOM element containing the text. DOM elements can contain *more* than the desired text and still match. Additionally, Cypress [prefers some DOM elements](#Notes) over the deepest element found.
# Syntax
```javascript
cy.contains(content)
cy.contains(selector, content)
cy.contains(selector, content, options)
.contains(content)
.contains(selector, content)
.contains(selector, content, options)
```
## Usage
@@ -21,8 +21,8 @@ cy.contains(selector, content, options)
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('.nav').contains('About') // Yields el in .nav containing 'About'
cy.contains('Hello') // Yields first el in document containing 'Hello'
cy.get('.nav').contains('About') // Yield el in .nav containing 'About'
cy.contains('Hello') // Yield first el in document containing 'Hello'
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -36,11 +36,11 @@ cy.getCookies().contains('_key') // Errors, 'getCookies' does not yield DOM
**{% fa fa-angle-right %} content** ***(String, Number, RegExp)***
Get the deepest DOM element containing the content.
Get the DOM element containing the content.
**{% fa fa-angle-right %} selector** ***(String selector)***
Specify a selector to filter DOM elements containing the text. Cypress will *ignore* it's [default preference order](#notes) for the specified selector. Using a selector allows you to return more *shallow* elements in the tree which contain the specific text.
Specify a selector to filter DOM elements containing the text. Cypress will *ignore* it's [default preference order](#Notes) for the specified selector. Using a selector allows you to return more *shallow* elements in the tree that contain the specific text.
**{% fa fa-angle-right %} options** ***(Object)***
@@ -48,7 +48,7 @@ Pass in an options object to change the default behavior of `cy.contains`.
Option | Default | Notes
--- | --- | ---
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
`timeout` | [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts) | Total time to retry finding an element containing the content
## Yields
@@ -57,11 +57,11 @@ Option | Default | Notes
## Timeout
`cy.contains()` will try to find the content within the DOM for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`cy.contains()` will try to find the content within the DOM for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
## String Content
## String
**Find the first element containing some text**
@@ -103,9 +103,9 @@ Get the form element and search in its descendants for the content "submit the f
cy.get('form').contains('submit the form!').click()
```
**Favor of `button` over other deeper elements**
**Favor of `<button>` over other deeper elements**
Even though the `<span>` is the deepest element that contains "Search", Cypress will yield `button` elements over spans.
Even though the `<span>` is the deepest element that contains "Search", Cypress yields `<button>` elements over spans.
```html
<form>
@@ -121,9 +121,9 @@ Even though the `<span>` is the deepest element that contains "Search", Cypress
cy.contains('Search').children('i').should('have.class', 'fa-search')
```
**Favor of `a` over other deeper elements**
**Favor of `<a>` over other deeper elements**
Even though the `<span>` is the deepest element that contains "Sign Out", Cypress will yield anchor elements over spans.
Even though the `<span>` is the deepest element that contains "Sign Out", Cypress yields anchor elements over spans.
```html
<nav>
@@ -141,11 +141,9 @@ Even though the `<span>` is the deepest element that contains "Sign Out", Cypres
cy.get('nav').contains('Sign Out').should('have.attr', 'href', '/signout')
```
**Favor of `label` over other deeper elements**
**Favor of `<label>` over other deeper elements**
Even though the `<span>` is the deepest element that contains "Age", Cypress will yield `label` elements over `span`.
Additionally we don't need to look for content "Age:" omit as long as the element at least contains the text "Age", it will be yielded.
Even though the `<span>` is the deepest element that contains "Age", Cypress yields `<label>` elements over `<span>`.
```html
<form>
@@ -194,11 +192,11 @@ If you wanted to select the `<span>` instead, you could narrow the elements yiel
cy.get('#main').contains('Jane Lane')
```
## Number Content
## Number
**Find the first element containing some number**
**Find the first element containing a number**
Even though the `<span>` is the deepest element that contains a "4", Cypress will automatically yield `button` elements higher in the chain
Even though the `<span>` is the deepest element that contains a "4", Cypress automatically yields `<button>` elements over spans.
```html
<button class="btn btn-primary" type="button">
@@ -211,7 +209,7 @@ Even though the `<span>` is the deepest element that contains a "4", Cypress wil
cy.contains(4)
```
## Regular Expression Content
## Regular Expression
**Find the first element with text matching the regular expression**
@@ -236,7 +234,7 @@ Technically the `<html>`, `<body>`, `<ul>`, and first `<li>` in the example belo
Normally Cypress would return the first `<li>` since that is the *deepest* element that contains: "apples"
To override the element that is yielded, we can pass `ul` as the selector.
To override the element that is yielded, we can pass 'ul' as the selector.
```html
<html>
@@ -264,11 +262,9 @@ cy.contains('ul', 'apples')
- `a`
- `label`
**Dual command can be either parent or child**
**Can be chained off of `cy` or another cy command**
`cy.contains` is a dual command. This means it can act as both a `parent` and a `child` command. Read more about [issuing commands](https://on.cypress.io/guides/issuing-commands) if this is unfamiliar.
Because it is a dual command it can either *begin* a chain of commands or work off of an *existing* subject.
`cy.contains()` can either *begin* a chain of commands or work off of an *existing* cy command.
***Start a chain of commands***
@@ -288,32 +284,18 @@ cy.get('#main').find('aside').contains('Add a user')
***Be wary of chaining multiple contains***
Let's imagine a scenario where you click button to delete a user and a dialog appears asking you to confirm this deletion.
The following will not work:
Let's imagine a scenario where you click a button to delete a user and a dialog appears asking you to confirm this deletion.
```javascript
cy
.contains('Delete User').click()
.contains('Yes, Delete!').click()
// This doesn't work as intended
cy.contains('Delete User').click().contains('Yes, Delete!').click()
```
Because the second `.contains()` is chained off of the existing button subject, Cypress will look inside of the existing button subject for the new content.
Because the second `.contains()` is chained off of a command that yielded the `<button>`, Cypress will look inside of the `<button>` for the new content.
In other words, Cypress will look inside of the button containing "Delete User" for the content: "Yes, Delete!"
In other words, Cypress will look inside of the `<button>` containing "Delete User" for the content: "Yes, Delete!", which is not what we intended.
***End previous chains to get back to the root scope***
If you explicitly [`.end()`](https://on.cypress.io/api/end) the previous chain, Cypress within the `document` for the content.
```javascript
cy
.contains('Delete User').click().end()
.contains('Yes, Delete!').click()
```
Alternatively, you could call `cy` again which automatically creates a new chain from the `document`.
What you want to do is call `cy` again, which automatically creates a new chain from the `document`.
```javascript
cy.contains('Delete User').click()
@@ -323,9 +305,8 @@ cy.contains('Yes, Delete!').click()
You could also chain the second contains off of a parent command (such as [`.get()`](https://on.cypress.io/api/get). This automatically changes the subject to `#dialog` which contains the content we're looking for.
```javascript
cy
.contains('Delete User').click()
.get('#dialog').contains('Yes, Delete!').click()
cy.contains('Delete User').click()
cy.get('#dialog').contains('Yes, Delete!').click()
```
# Command Log
@@ -348,4 +329,3 @@ When clicking on the `contains` command within the command log, the console outp
- [get](https://on.cypress.io/api/get)
- [within](https://on.cypress.io/api/within)
- [root](https://on.cypress.io/api/root)
docs/source/api/commands/dblclick.md
+7 -13
View File
@@ -20,9 +20,9 @@ Double-click a DOM element.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('button').dblclick() // Double clicks on button
cy.focused().dblclick() // Double clicks on el with focus
cy.contains('Welcome').dblclick() // Double clicks on first el containing 'Welcome'
cy.get('button').dblclick() // Double click on button
cy.focused().dblclick() // Double click on el with focus
cy.contains('Welcome').dblclick() // Double click on first el containing 'Welcome'
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -36,21 +36,19 @@ cy.window().click() // Errors, 'window' does not yield DOM element
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `.dblclick()`.
Option | Default | Notes
--- | --- | ---
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
## Yields
`.dblclick()` yields the DOM subject chained from the previous command.
`.dblclick()` yields the DOM element that was double clicked.
## Timeout
`.dblclick()` will wait for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`.dblclick()` will wait for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
@@ -58,12 +56,8 @@ Option | Default | Notes
**Double click an anchor link**
```html
<a href="#nav1">Menu</a>
```
```javascript
cy.get('#nav1').dblclick() // yields the <a>
cy.get('a#nav1').dblclick() // yields the <a>
```
# Command Log
docs/source/api/commands/debug.md
+3 -3
View File
@@ -25,7 +25,7 @@ You need to have your Developer Tools open for `.debug()` to hit the breakpoint.
```javascript
cy.debug().getCookie('app') // Pause to debug at beginning of commands
cy.get('nav').debug() // Debug the `get` commands yield
cy.get('nav').debug() // Debug the `get` command's yield
```
## Arguments
@@ -36,7 +36,7 @@ Pass in an options object to change the default behavior of `.debug()`.
Option | Default | Notes
--- | --- | ---
`log` | `true` | whether to display command in command log
`log` | `true` | Whether to display command in Command Log
## Yields
@@ -48,7 +48,7 @@ Option | Default | Notes
## Debug
**Pause with debugger after `get()`**
**Pause with debugger after `.get()`**
```javascript
cy.get('a').debug().should('have.attr', 'href')
docs/source/api/commands/document.md
+8 -8
View File
@@ -9,25 +9,25 @@ Get the document.
# Syntax
```javascript
.document()
.document(options)
cy.document()
cy.document(options)
```
## Usage
`.document()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
`cy.document()` cannot be chained off any other cy commands, so should be chained off of `cy` for clarity.
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.document()
cy.document() // yield the window.document object
```
## Arguments
**{% fa fa-angle-right %} options** ***(Object)***
Pass in an options object to change the default behavior of `.document()`.
Pass in an options object to change the default behavior of `cy.document()`.
Option | Default | Notes
--- | --- | ---
@@ -35,11 +35,11 @@ Option | Default | Notes
## Yields
`.as()` yields the `window.document` object.
`cy.document()` yields the `window.document` object.
## Timeout
`.document()` will retry for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts)
`cy.document()` will retry for the duration of the [`defaultCommandTimeout`](https://on.cypress.io/guides/configuration#timeouts).
# Examples
@@ -50,7 +50,7 @@ Option | Default | Notes
```javascript
cy.document().then(function(document) {
// work with document element
});
})
```
**Make an assertion about the document**
docs/source/api/commands/each.md
+12 -8
View File
@@ -6,16 +6,10 @@ description: ''
Iterate through an array like structure (arrays or objects with a `length` property).
Each time the callback function runs, it is invoked with three arguments:
- `value`
- `index`
- `collection`
# Syntax
```javascript
.each(function(value, index, collection) {})
.each(callbackFn)
```
## Usage
@@ -37,6 +31,16 @@ cy.each(function(){...}) // Errors, cannot be chained off 'cy'
cy.location().each(function(){...}) // Errors, 'location' doesn't yield an array
```
## Arguments
**{% fa fa-angle-right %} callbackFn** ***(Function)***
Pass a function that is invoked with the following arguments:
- `value`
- `index`
- `collection`
## Yields
`.each()` yields the original array.
@@ -83,7 +87,7 @@ cy
**Promises are awaited**
If your callback function returns a `Promise` it will be awaited before iterating over the next element in the collection.
If your callback function returns a `Promise`, it will be awaited before iterating over the next element in the collection.
```javascript
cy
docs/source/api/commands/should.md
+4 -4
View File
@@ -20,7 +20,7 @@ An alias of [`.and()`](https://on.cypress.io/api/and)
.should(chainers)
.should(chainers, value)
.should(chainers, method, value)
.should(function() {})
.should(callbackFn)
```
@@ -31,8 +31,8 @@ An alias of [`.and()`](https://on.cypress.io/api/and)
**{% fa fa-check-circle green %} Valid Usage**
```javascript
cy.get('.error').should('be.empty') // Yields '.error' el
cy.contains('Login').should('be.visible') // Yields el containing Login
cy.get('.error').should('be.empty') // Assert that '.error' is empty
cy.contains('Login').should('be.visible') // Assert that el is visible
```
**{% fa fa-exclamation-triangle red %} Invalid Usage**
@@ -56,7 +56,7 @@ Value to assert against chainer.
A method to be called on the chainer.
**{% fa fa-angle-right %} function** ***(Function)***
**{% fa fa-angle-right %} callbackFn** ***(Function)***
Pass a function that can have any number of explicit assertions within it. Whatever was passed to the function is what is yielded.
docs/themes/cypress/source/css/_partial/highlight.scss
Vendored
+2 -5
View File
@@ -1,16 +1,13 @@
code {
margin: 0;
padding: 0;
border: 1px solid #E9E9EF;
border-radius: 4px;
border: 0;
outline: 0;
font-weight: bold;
font-weight: 600;
font-family: inherit;
font-size: 0.9em;
vertical-align: baseline;
color: #46af91;
background: #F7F7F9;
padding: 0 5px;
font-family: $font-mono;
}
docs/themes/cypress/source/css/_partial/page.scss
Vendored
+25 -13
View File
@@ -83,7 +83,7 @@
ul {
margin: 1em 0;
margin-left: 20px;
margin-left: 40px;
list-style: disc;
ul {
@@ -124,10 +124,11 @@
border: 1px solid #e8e8e8;
th {
font-weight: bold;
padding: 5px 15px;
font-weight: 500;
padding: 2px 15px;
text-align: left;
border-bottom: 1px solid #e8e8e8;
font-size: 0.9em;
&:empty {
padding: 0;
@@ -136,6 +137,7 @@
td {
padding: 5px 15px;
font-size: 0.9em;
}
tr:nth-child(2n) {
@@ -174,29 +176,35 @@
margin: 1em 0;
}
h1 {
font-size: 1.7em;
line-height: 1.5em;
line-height: 1em;
font-weight: 500;
margin: 1.5em 0 0.5em 0;
padding: 0;
font-family: $font-title;
border-top: 2px solid #eee;
padding-top: 1.5em;
border-top: 1px solid #eee;
padding-top: 1em;
&>a {
font-weight: 500;
}
&+h2 {
margin-top: 0;
border-top: 0;
padding-top: 0;
}
}
h2 {
font-size: 1.3em;
line-height: 1.5em;
line-height: 1em;
font-weight: 500;
margin: 2em 0 0.5em 0;
margin: 1.5em 0 0.5em 0;
padding-top: 1.5em;
font-family: $font-title;
border-top: 1px solid #eee;
code {
font-weight: bold;
@@ -235,7 +243,7 @@
&>p>strong {
display: inline-block;
margin-top: 1.5em;
margin-top: 1em;
}
&>h2+p>strong, &>h1+p>strong {
@@ -254,7 +262,7 @@
}
strong {
font-weight: bold;
font-weight: 500;
}
em {
@@ -304,6 +312,10 @@
padding: 1em;
border-left: 4px solid #999;
strong {
font-weight: 500;
}
&.warning {
border-left-color: #f0ad4e;
background-color: #fcf8f2;
@@ -404,7 +416,7 @@
}
.article-header {
padding-bottom: 20px;
padding: 20px 0;
&:before {
content: "";
display: table;