Click Radio Button Playwright

Profile picture for user devraj

To select or assert radio buttons in Playwright, we can use the same methods we used for the checkbox. It doesn't make sense to uncheck the radio button since it automatically unchecks when you select any other value. You will get an error if you try to uncheck the radio buttons. 

Table of Content

  1. Demo Website
  2. Select Radio Button using Click Method
  3. Select Radio Button using Check Method
  4. Verify Radio Button is Selected
  5. Verify Radio Button is Not Selected
  6. Video Tutorial

1. Demo Website

Demo Link: http://autopract.com/selenium/form5/

how to automate radio button in playwright

Here United States is selected by Default.

2. Select Radio Button using Click Method

You can use either of below commands to Select Radio Button India

await page.click("input[value='IN']")
// or
await page.locator("input[value='IN']").click()

3. Select Radio Button using Check Method

You can use either of below commands to Select Radio Button India

await page.check("input[value='IN']")
// or
await page.locator("input[value='IN']").check()

4. Verify Radio Button is Selected

Use either of below command to verify radio button is selected

expect(await page.locator("input[value='US']").isChecked()).toBeTruthy()
// or
await expect(page.locator("input[value='US']")).toBeChecked()

5. Verify Radio Button is Not Selected

Use below command to to verify checkbox is not selected

expect(await page.locator("input[value='IN']").isChecked()).toBeFalsy()

Video Tutorial: Playwright Select Radio Button