Category:
Cypress
Get the Next Sibling in Cypress
The .next() function returns the next sibling in Cypress as seen below
cy.get('#my_ele').next();
Get the next sibling which is an input tag:
cy.get('#my_ele').next('input');
Get the Previous Sibling in Cypress
The .prev() function returns the previous sibling in Cypress as seen below
cy.get('#my_ele').prev();
Get the previous sibling which is an input tag, use the following command:
cy.get('#my_ele').prev('input');
Get All Next Siblings in Cypress
The .nextAll() function returns the next sibling in Cypress as seen below
cy.get('#my_ele').nextAll();
Get All Previous Sibling in Cypress
The .prevAll() function returns the previous sibling in Cypress as seen below
cy.get('#my_ele').prevAll();
Get Any Siblings
The .siblings() function is used to find the siblings in Cypress as seen below
cy.get('li').siblings('.active')
Or
cy.get('li').siblings()
Get The Siblings Until in Cypress
The functions .nextUntil() and .prevUntil() allows you to get all the siblings before or after a certain condition.
For example, to get all the next sibling elements until the element class name is ‘my_class_name’, use the command as seen below:
cy.get('li').nextUntil('.my_class_name')
Get previous sibling element until the element class name is ‘my_class_name’, use the command as seen below:
cy.get('li').prevUntil('.my_class_name')
Within Command in Cypress
The .within() function scopes all subsequent cy commands within this element as seen in the example below:
For HTML Code
The following command will search for the elements only within the form, instead of searching the whole code, and returns only the relevant elements within the form,
cy.get('form').within(($form) => {
// cy.get() will only search for elements within form,
// not within the entire document
cy.get('input[name="email"]').type('eaxample@email.com')
cy.get('input[name="password"]').type('mypassword')
cy.root().submit()
})