Filter Elements Using jQuery Pseudo-Classes
How do you pick one element from the list of elements returned by the cy.get command? How do you pick several? In this video, I will use jQuery pseudo-classes like :odd, :even, :eq(index), :gt(index), :lt(index) to pick multiple elements
// using the cy.eq command to pick one element
cy.get('li').eq(2).should('have.text', 'Pears')
// using jQuery :odd pseudo-class
cy.get('li')
.filter(':odd')
.should('have.length', 2)
// using jQuery odd() method
cy.get('li')
.invoke('odd')
.should('have.length', 2)
// using jQuery :even pseudo-class
cy.get('li')
.filter(':even')
.should('have.length', 2)
// select the 2nd and the 3rd elements
// using jQuery :eq(index) pseudo-class
cy.get('li')
.filter(':eq(1), :eq(2)')
.should('have.length', 2)
// select the elements after the first two
// using jQuery :gt(index) pseudo-class
cy.get('li')
.filter(':gt(1)')
.should('have.length', 2)
// select the middle two elements out of 4
// using a combination of :gt() and :lt()
cy.get('li')
.filter(':gt(0)')
.should('have.length', 3)
.filter(':lt(2)')
.should('have.length', 2)
Find the full recipe at https://glebbahmutov.com/cypress-exam...
