title |
---|
each |
Iterate through an array like structure (arrays or objects with a length
property).
.each(callbackFn)
{% fa fa-check-circle green %} Correct Usage
cy.get('ul>li').each(function () {...}) // Iterate through each 'li'
cy.getCookies().each(function () {...}) // Iterate through each cookie
{% fa fa-exclamation-triangle red %} Incorrect Usage
cy.each(function () {...}) // Errors, cannot be chained off 'cy'
cy.location().each(function () {...}) // Errors, 'location' doesn't yield an array
{% fa fa-angle-right %} callbackFn (Function)
Pass a function that is invoked with the following arguments:
value
index
collection
{% yields same_subject .each %}
Iterate over an array of DOM elements
cy
.get('ul>li')
.each(($el, index, $list) => {
// $el is a wrapped jQuery element
if ($el.someMethod() === 'something') {
// wrap this element so we can
// use cypress commands on it
cy.wrap($el).click()
} else {
// do something else
}
})
The original array is always yielded
No matter what is returned in the callback function, .each()
will always yield the original array.
cy
.get('li').should('have.length', 3)
.each(($li, index, $lis) => {
return 'something else'
})
.then(($lis) => {
expect($lis).to.have.length(3) // true
})
Promises are awaited
If your callback function returns a Promise
, it will be awaited before iterating over the next element in the collection.
cy.wrap([1, 2, 3]).each((num, i, array) => {
return new Cypress.Promise((resolve) => {
setTimeout(() => {
resolve()
}, num * 100)
})
})
Stop each
prematurely
You can stop the .each()
loop early by returning false
in the callback function.
{% requirements child .each %}
{% assertions once .each %}
{% timeouts promises .each %}
cy.each()
does not log in the Command Log
- {% url
.spread()
spread %} - {% url
.then()
then %}