Parent Elements | Bondar Academy

Lesson Summary

In this lesson, we explore how to find parent elements in Cypress , particularly when unique identifiers are not available. Here are the key points discussed: Identifying Elements When needing to select a specific button (e.g., Sign In ), and multiple buttons share the same color, look for unique elements around the button. Examples of unique elements include: Radio buttons Labels Input fields with unique ID Finding Parent Elements To locate a button based on an input field's ID : cy.get('#inputID').parents('form').find('button') This method travels up to the nearest form parent and then down to the button. Using cy.contains Another approach is using cy.contains to find elements by text. This can also return parent elements: cy.contains('text', { matchCase: false }) Chaining Methods You can chain multiple parent() calls to navigate up the DOM tree: cy.get('element').parent().parent().find('button') Using parentsUntil The parentsUntil method allows you to find all parent elements up to a specified element: cy.get('element').parentsUntil('form') This returns all parent elements before the specified element, which can be useful for complex DOM structures. In summary, use parents to find parent elements, parent for a single level up, and parentsUntil to collect elements up to a certain point in the DOM.