《刚刚问世》系列初窥篇-Java+Playwright自动化测试

1.简介

我们可能会遇到一直测试单选和复选按钮的测试场景，如果就十几道选择题，那就手工点击，马上完事，但是如果是让你测试题库呢？那不得那鼠标点击冒烟了，手指点到抽筋了。尤其是做教育类的软件测试，这些就是家常便饭了。因此今天这一篇宏哥主要是讲解一下，如何使用Playwright来遍历单选和多选按钮。让电脑自己点击，让机器干活。大致内容：宏哥在本地弄的一个小demo，然后遍历demo里的单选和多选按钮进行实战。
2.demo准备

2.1demo页面的HTML代码

1.这里宏哥为了省事节约时间就直接用上一篇中那个radio.html。如下：

1.   测试单选 北京-宏哥
2. [size=4]复选框 checkbox[/size]
4. 请选择喜欢的打野英雄：
6. 李白
8. 韩信
10. 公孙离
12. 露娜
13. [size=4]单选框 radio[/size]
15. 选择喜欢的打野英雄：
17. 李白
19. 韩信
21. 露娜
23. 孙尚香

复制代码

2.页面效果，如下图所示：

3.遍历单选框

遍历思路：
1.首先找到所有单选按钮的共同点。
2.使用共同点来定位单选按钮，将其放在变量中List radios。
3.利用for循环将其从容其中一一遍历出来，并且挨个点击。
3.1代码设计

根据上边的遍历思路进行代码设计。如下图所示：

3.2参考代码

1. package com.bjhg.playwright; import java.util.List; import com.microsoft.playwright.Browser; import com.microsoft.playwright.BrowserContext; import com.microsoft.playwright.BrowserType; import com.microsoft.playwright.Locator; import com.microsoft.playwright.Page; import com.microsoft.playwright.Playwright; /** * @author 北京-宏哥 * * @公众号:北京宏哥（微信搜索，关注宏哥，提前解锁更多测试干货） * * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-28- 操作单选和多选按钮 - 中篇（详细教程） * * 2025年01月26日 */ public class Test_Radio { public static void main(String[] args) { try (Playwright playwright = Playwright.create()) { //1.使用chromium浏览器，# 浏览器配置，设置以GUI模式启动Chrome浏览器（要查看浏览器UI，在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。 Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(3000)); //2.创建context BrowserContext context = browser.newContext(); //创建page Page page = context.newPage(); //3.浏览器访问demo page.navigate("file:///C:/Users/duhon/Desktop/radio.html"); //4.定位所有单选按钮 List radios = page.locator("[name='radio']").all(); //遍历单选按钮 for(Locator radio:radios){ //点击选中单选按钮 radio.click(); } System.out.println("Test Pass"); //5.关闭page page.close(); //6.关闭browser browser.close(); } } }

复制代码

3.3运行代码

1.运行代码，右键Run As->Java Application，就可以看到控制台输出，如下图所示：

2.运行代码后电脑端的浏览器的动作（可以看到所有单选按钮，都点了，包括默认选中的）。如下图所示：

4.遍历单选按钮（默认选中不点击）

细心地小伙伴或者童鞋们，可能会发现上边的代码将默认选中的单选按钮，也点击了。那么如何让其不点击呢？加判断呗。
遍历思路：
1.首先找到所有单选按钮的共同点。
2.使用共同点来定位单选按钮，将其放在变量中List radios。
3.利用for循环将其从容其中一一遍历出来，并且挨个点击默认不选中的单选按钮。
4.1代码设计

根据上边的遍历思路进行代码设计。如下图所示：

4.2参考代码

1. package com.bjhg.playwright; import java.util.List; import com.microsoft.playwright.Browser; import com.microsoft.playwright.BrowserContext; import com.microsoft.playwright.BrowserType; import com.microsoft.playwright.Locator; import com.microsoft.playwright.Page; import com.microsoft.playwright.Playwright; /** * @author 北京-宏哥 * * @公众号:北京宏哥（微信搜索，关注宏哥，提前解锁更多测试干货） * * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-28- 操作单选和多选按钮 - 中篇（详细教程） * * 2025年01月26日 */ public class Test_Radio { public static void main(String[] args) { try (Playwright playwright = Playwright.create()) { //1.使用chromium浏览器，# 浏览器配置，设置以GUI模式启动Chrome浏览器（要查看浏览器UI，在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。 Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(3000)); //2.创建context BrowserContext context = browser.newContext(); //创建page Page page = context.newPage(); //3.浏览器访问demo page.navigate("file:///C:/Users/duhon/Desktop/radio.html"); //4.定位所有单选按钮 List radios = page.locator("[name='radio']").all(); //遍历单选按钮 for(Locator radio:radios){ //判断未选中才点击 if(!radio.isChecked()){ //点击选中单选按钮 radio.click(); } } System.out.println("Test Pass"); //5.关闭page page.close(); //6.关闭browser browser.close(); } } }

复制代码

4.3运行代码

1.运行代码，右键Run As->Java Application，就可以看到控制台输出，如下图所示：

2.运行代码后电脑端的浏览器的动作（可以看到所有单选按钮，都点了，不包括默认选中的）。如下图所示：

5.遍历复选框

遍历思路：
1.首先找到所有复选按钮的共同点。
2.使用共同点来定位复选按钮，将其放在变量中List radios。
3.利用for循环将其从容其中一一遍历出来，并且挨个点击。
5.1代码设计

根据上边的遍历思路进行代码设计。如下图所示：

5.2参考代码

1. package com.bjhg.playwright; import java.util.List; import com.microsoft.playwright.Browser; import com.microsoft.playwright.BrowserContext; import com.microsoft.playwright.BrowserType; import com.microsoft.playwright.Locator; import com.microsoft.playwright.Page; import com.microsoft.playwright.Playwright; /** * @author 北京-宏哥 * * @公众号:北京宏哥（微信搜索，关注宏哥，提前解锁更多测试干货） * * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-28- 操作单选和多选按钮 - 中篇（详细教程） * * 2025年01月26日 */ public class Test_Radio { public static void main(String[] args) { try (Playwright playwright = Playwright.create()) { //1.使用chromium浏览器，# 浏览器配置，设置以GUI模式启动Chrome浏览器（要查看浏览器UI，在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。 Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(3000)); //2.创建context BrowserContext context = browser.newContext(); //创建page Page page = context.newPage(); //3.浏览器访问demo page.navigate("file:///C:/Users/duhon/Desktop/radio.html"); //4.定位所有单选按钮 List checkboxs = page.locator("[type='checkbox']").all(); //遍历单选按钮 for(Locator checkbox:checkboxs){ //点击复选按钮 checkbox.click(); } System.out.println("Test Pass"); //5.关闭page page.close(); //6.关闭browser browser.close(); } } }

复制代码

5.3运行代码

1.运行代码，右键Run As->Java Application，就可以看到控制台输出，如下图所示：

2.运行代码后电脑端的浏览器的动作（可以看到复选框默认选中“公孙离”，之后会因为点击而变成未选中）。如下图所示：

6.遍历复选按钮（默认选中不点击）

遍历思路：
1.首先找到所有复选按钮的共同点。
2.使用共同点来定位复选按钮，将其放在变量中List radios。
3.利用for循环将其从容其中一一遍历出来，并且挨个点击默认不选中的单选按钮。
6.1代码设计

根据上边的遍历思路进行代码设计。如下图所示：

6.2参考代码

1. package com.bjhg.playwright; import java.util.List; import com.microsoft.playwright.Browser; import com.microsoft.playwright.BrowserContext; import com.microsoft.playwright.BrowserType; import com.microsoft.playwright.Locator; import com.microsoft.playwright.Page; import com.microsoft.playwright.Playwright; /** * @author 北京-宏哥 * * @公众号:北京宏哥（微信搜索，关注宏哥，提前解锁更多测试干货） * * 《刚刚问世》系列初窥篇-Java+Playwright自动化测试-28- 操作单选和多选按钮 - 中篇（详细教程） * * 2025年01月26日 */ public class Test_Radio { public static void main(String[] args) { try (Playwright playwright = Playwright.create()) { //1.使用chromium浏览器，# 浏览器配置，设置以GUI模式启动Chrome浏览器（要查看浏览器UI，在启动浏览器时传递 headless=false 标志。您还可以使用 slowMo 来减慢执行速度。 Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false).setSlowMo(3000)); //2.创建context BrowserContext context = browser.newContext(); //创建page Page page = context.newPage(); //3.浏览器访问demo page.navigate("file:///C:/Users/duhon/Desktop/radio.html"); //4.定位所有单选按钮 List checkboxs = page.locator("[type='checkbox']").all(); //遍历单选按钮 for(Locator checkbox:checkboxs){ //判断未选中才点击 if(!checkbox.isChecked()){ //点击选中单选按钮 checkbox.click(); } } System.out.println("Test Pass"); //5.关闭page page.close(); //6.关闭browser browser.close(); } } }

复制代码

6.3运行代码

1.运行代码，右键Run As->Java Application，就可以看到控制台输出，如下图所示：

2.运行代码后电脑端的浏览器的动作（可以看到复选框全部选中，因为默认选中没有点击，也是选中的，如果点击了，就会变成未选中）。如下图所示：

6.小结

今天主要是讲解了如何遍历单选和多选按钮，掌握了其实非常简单主要秘诀就是：要找到其共同属性，然后挨个遍历出来，缺点就是单选只能选中最后一个。多选就全部选中。
好了，今天时间也不早了，宏哥就讲解和分享到这里，感谢您耐心的阅读，希望对您有所帮助。
公众号(关注宏哥)                      微信群(扫码进群)                             客服微信

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！