I have 2 div collapse
<div class="collapse>
<div class="title">Apple</div>
<item>Apple 1</item>
<item>Apple 2</item> // get this item
<item>Apple 3</item>
</div>
<div class="collapse>
<div class="title">Samsung</div>
<item>Samsung 1</item>
<item>Samsung 2</item>
</div>
How I can get item list by class title like this:
cy.get('.collapse').within(() => {
if (cy.contains('.title', 'Apple') {
cy.get(item).eq(1).... // handle item second of apple
}
});
You can specify which .collapse you want by the content of it's children
cy.contains('.collapse', 'Apple') // gets the 1st collapse element where child has "Apple" text
.find('item').eq(1) // within that, get the 2nd <item>
.should('have.text', 'Apple 2')
If your actual HTML is more complicated and you want to start with the title element,
cy.contains('.title', 'Apple') // get the title child with "Apple" text
.parent() // move up to div.collapse
.find('item').eq(1) // within that, get the 2nd <item>
.should('have.text', 'Apple 2')
or siblings navigation
cy.contains('.title', 'Apple') // get the tile child with "Apple" text
.siblings('item').eq(1) // 2nd item sibling
.should('have.text', 'Apple 2')