软件测试|web自动化测试神器playwright教程（二十二）
【摘要】 前言工作和生活中，经常会遇到我们需要进行选择的情况，比如勾选，或者我们选择性别，男女两个性别总是不能同时选中的，比如我们在选择兴趣爱好时，我们可以选择多个自己感兴趣的话题，比如篮球足球电竞等话题。我们在执行自动化测试的过程中，必须要学会处理这样的情况。 页面示例以下面的界面为例：页面代码如下：<!DOCTYPE html><html lang="zh-cn"><head> <meta...
前言
工作和生活中，经常会遇到我们需要进行选择的情况，比如勾选，或者我们选择性别，男女两个性别总是不能同时选中的，比如我们在选择兴趣爱好时，我们可以选择多个自己感兴趣的话题，比如篮球足球电竞等话题。我们在执行自动化测试的过程中，必须要学会处理这样的情况。
页面示例
以下面的界面为例：
页面代码如下：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
</head>
<body>
<fieldset>
<legend>单选按钮radio</legend>
<form action="">
<label for=""><input type="radio" name="brand" value="toyota" id="toyota">丰田</label>
<label for=""><input type="radio" name="brand" value="volkswagen" id="volkswagen">大众</label>
<label for=""><input type="radio" name="brand" value="honda" id="honda">本田</label>
<label for=""><input type="radio" name="brand" value="bmw" id="bmw" checked="">宝马</label>
<label for=""><input type="radio" name="brand" value="benz" id="benz" >奔驰</label>
</form>
</fieldset>
<br>
<fieldset>
<legend>多选按钮checkbox</legend>
<form action="">
<input type="checkbox" name="checkbox" value="动力" id="power">动力<br>
<input type="checkbox" name="checkbox" value="油耗" id="fuel">油耗<br>
<input type="checkbox" name="checkbox" value="舒适" id="comfort" >舒适 <br>
<input type="checkbox" name="checkbox" value="驾驶" id="driving" >驾驶 <br>
</form>
</fieldset>
</body>
</html>
playwright选择操作
上述的就是我们最常见的radio单选框和checkbox多选框，playwright提供了一些处理单选框以及多选框的方法，如下：
- locator.click() 点击操作
- locator.check() 选中
- locator.uncheck() 不选中
- locator.set_checked() 设置选中状态
- locator.is_checked() 判断是否被选中
- radio 单选操作
radio是单选，以我们的html文件为例，如果宝马已经被选了再点击宝马是不会改变状态的，我们只有点击其他的按钮才会改变状态
- click()点击操作
# radio 操作
status1 = page.locator('#bmw').is_checked()
print(status1)
# 选择奔驰
page.locator('#benz').click()
print(page.locator('#benz').is_checked())
- check() 检查操作
# 选择toyota
page.locator('#toyota').check()
print(page.locator('#toyota').is_checked())
- set_checked()
# 选择大众
page.locator('#volkswagen').set_checked(checked=True)
print(page.locator('#volkswagen').is_checked())
注：set_checked()需传checked 参数，参数为布尔值
- 调用page对象
page.check('#honda')
page.set_checked('#honda', checked=True)
需注意的是，如果bmw本身就是选择状态，去设置unchecked 状态，会报错: Clicking the checkbox did not change its state，如下
page.locator('#bmw').uncheck()
报错如下：
result = next(iter(done)).result()
playwright._impl._api_types.Error: Clicking the checkbox did not change its state
=========================== logs ===========================
waiting for locator("#bmw")
- checkbox 复选框
checkbox 复选框跟 radio 操作的区别在于，如果已经被选择了，再点击会被取消选中，所以不会有前面的报错。
- click()，未选中的时候，点击就会被选中。
# checkbox 操作
page.locator('#power').click()
print(page.locator('#power').is_checked())
- check() 或 set_checked() ，如果想让元素必须是选择状态(不管之前有没被选中），可以使用这两种方法
page.locator('#comfort').check()
print(page.locator('#comfort').is_checked())
# checkbox 操作
page.locator('#driving').set_checked(checked=True)
print(page.locator('#driving').is_checked())
- 批量选中checkbox，定位全部CheckBox 批量选中
# checkbox 操作
box = page.locator('[type="checkbox"]')
for item in box.all():
item.check()
总结
本文主要介绍了playwright对选择框的处理，playwright对选择框的处理比selenium更为简单，没有类似selenium的复杂操作，更为直接便捷。
【版权声明】本文为华为云社区用户原创内容，转载时必须标注文章的来源（华为云社区）、文章链接、文章作者等基本信息， 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）