Click Radio Button Playwright

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()
Fri, 08/19/2022 - 08:33

Authored by

Tarun Goswami, works as a Technical Lead at the well-known IT services company. With Over 11+ years of experience in Quality Assurance, he writes engaging and informative blogs in his spare time.

Video Tutorial: Select Radio Button Playwright

Tags