3.2 KiB
title, comments, description
| title | comments | description |
|---|---|---|
| children | true |
Get the children of each DOM element within a set of DOM elements.
Syntax
.children()
.children(selector)
.children(options)
.children(selector, options)
Usage
.children() requires being chained off another cy command that yields a DOM element.
{% fa fa-check-circle green %} Valid Usage
cy.get('nav').children() // Yield children of nav
{% fa fa-exclamation-triangle red %} Invalid Usage
cy.children() // Errors, cannot be chained off 'cy'
cy.location().children() // Errors, 'location' does not yield DOM element
Arguments
{% fa fa-angle-right %} selector (String selector)
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.
| Option | Default | Notes |
|---|---|---|
log |
true |
whether to display command in command log |
timeout |
defaultCommandTimeout |
Total time to retry getting the element(s) |
Yields
.children() yields the new DOM elements found by the command.
Timeout
.children() will continue to look for the children elements for the duration of the defaultCommandTimeout
Examples
Children
Get the children of the "secondary-nav"
<ul class="primary-nav">
<li class="about">About</li>
<li class="services">Services
<ul class="secondary-nav">
<li class="services-1">Web Design</li>
<li class="services-2">Print Design
<ul class="tertiary-nav">
<li class="item-1">Signage</li>
<li class="item-2">T-Shirt</li>
<li class="item-3">Business Cards</li>
</ul>
</li>
<li class="services-3">Logo Design</li>
</ul>
</li>
<li class="Contact">Contact</li>
</ul>
// yields [
// <li class="services-1"></li>,
// <li class="services-2"></li>,
// <li class="services-3"></li>
// ]
cy.get('ul.secondary-nav').children()
Selector
Get the children with class 'active'
<div>
<ul>
<li class="active">Unit Testing</li>
<li>Integration Testing</li>
</ul>
</div>
// yields [<li class="active">Unit Testing</li>]
cy.get('ul').children('.active')
Command Log
Assert that there should be 8 children elements in a nav
cy.get('.left-nav>.nav').children().should('have.length', 8)
The commands above will display in the command log as:
When clicking on the children command within the command log, the console outputs the following:
