Child Elements | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Locators and Assertions
Instructor: Artem Bondar
Lesson Summary
This lesson covers the process of creating locators in Playwright, specifically focusing on how to target child elements within a parent element using a combination of locators. Key Concepts Regular Locators : Syntax for user-visible locators and how to combine them. Chaining Locators : Using multiple locators to find nested components within an HTML node. Example Structure : The nb-card HTML tag serves as a parent node for various forms. Locator Methods To locate child elements, you can: Start with a parent locator (e.g., nb-card ) and chain to child elements (e.g., nbradio group ). Use the locator method multiple times to navigate through the hierarchy. Combine locators in a single method by separating them with spaces. Using Indexes While you can use indexes to select specific child elements, it is generally not recommended. Instead, aim for unique locators to avoid dependency on the order of elements on the page. Summary In summary, you can: Create chains of locators to target child elements. Combine different locator methods to enhance specificity. Use indexes cautiously, as they can lead to brittle tests. By following these strategies, you can effectively manage element selection in your Playwright tests. See you in the next lesson!