Radio Buttons | Bondar Academy
Course: Playwright UI Testing with TypeScript
Module: Mastering UI Elements
Instructor: Artem Bondar
Lesson Summary
In this lesson, we will discuss how to interact with radio buttons , automate their selection, and perform assertions to check their status (selected or not). Key Concepts Locating radio buttons using different methods. Using the check method to select radio buttons. Bypassing visibility checks when radio buttons are visually hidden. Validating the selection status of radio buttons. Locating Radio Buttons To select radio buttons, we can use the following locators: By Label: Use the label text (e.g., "option one") with the check method. By Role: Use the role of the radio button with the get by role method. Handling Visually Hidden Elements When radio buttons are visually hidden, the default check command may fail. To bypass this, use: check({ force: true }) Validating Selection Status To validate if a radio button is selected: Use a generic assertion with is checked to return a Boolean value. Use a locator assertion with to be checked . Example Assertions To check if a radio button is selected or not: expect(radioStatus).toBeTruthy(); For a locator assertion: await expect(locator).toBeChecked(); Summary The recommended method for selecting radio buttons is to use get by role and the check method. If the radio button is hidden, use force: true to bypass visibility checks. To validate the selection, use either generic or locator assertions to check if the radio button is selected or not. Thank you for watching, and see you in the next lesson!