《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

时间:2021-07-02 07:13:30

1.简介

在实际自动化测试过程中,我们也避免不了会遇到下拉选择的测试,因此宏哥在这里直接分享和介绍一下,希望小伙伴或者童鞋们在以后工作中遇到可以有所帮助。

2.select 下拉框

2.1Select类

1.在Selenium中,针对html的标签select多选下拉列表有几种方法:

selectByIndex(index);  //根据索引选择
selectByValue(value); //根据value属性选择
selectByVisibleText(text); //根据选项文字选择
注意的是:
*index是从0开始的
**Value是option标签的一个属性值,并不是显示在下拉框中的值
***VisibleText是在option标签中间的值,是显示在下拉框的值

2.四种取消方法:

deselectByIndex(0);
deselectByValue(value);
deselectByVisibleText(Text);
deselectAll(); //取消所有选中

3.下拉选的处理类:Select 如果页面元素是一个下拉框,我们可以将此web元素封装成Select对象。

Select select = new Select(WebElement element);
//Select select = new Select(driver.findElement(By.id("xxx")));
//获取所有选项的方法
select.getOptions();
//根据索引选中对应的元素
select.selectByIndex(index);
//根据value值选中对应的选项
select.selectByValue(value);
//根据文本值选中对应的选项
select.selectByVisibleText(text);
//判断是不是多选的选择框返回boolean值
select.isMultiple();
//取消所有的选中
select.deselectAll();

3.select.html

1.准备测试练习select.html,如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试Select</title>
<style type="text/css">
.button1 {
background-color: #f44336;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 28px;
margin-bottom: 100px;
text-decoration:none;
color: white;
}
#myAnchor
{
text-decoration:none;
color: white;
}
</style>
</head>
<body>
<button class="button1"><a id="myAnchor" href="https://www.cnblogs.com/du-hong/">北京-宏哥</a></button></br>
快递邮寄地址:
<select id="select_id" name="select_name" class ="select_cls">
<option value="0">请选择</option>
<option value="1">山西</option>
<option value="2">陕西</option>
<option value="3">山东</option>
<option value="4">四川</option>
<option value="5">河北</option>
</select>省_XXX_市_ XXX_街道
</body>
</html>

2.页面效果,如下图所示:

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

4.代码实战练习

4.1代码设计

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

4.2参考代码

package lessons;

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import org.junit.Test; /**
* @author 北京-宏哥
*
* 《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)
*
* 2021年10月16日
*/
public class SelectTest { @Test
public void test() throws InterruptedException { System.setProperty("webdriver.gecko.driver", ".\\Tools\\chromedriver.exe"); WebDriver driver =null;
driver =new ChromeDriver();
driver.get("file:///C:/Users/DELL/Desktop/test/select.html");
//Select select = new Select(WebElement element);
Select select = new Select(driver.findElement(By.id("select_id")));
//获取所有选项的方法
List<WebElement> lst = select.getOptions();
for (WebElement webElement : lst) {
System.out.println("获取所有选项的方法依次输出文本值:"+webElement.getText());
}
//根据索引选中对应的元素
select.selectByIndex(1);
Thread.sleep(5000);
//根据value值选中对应的选项
select.selectByValue("4");
Thread.sleep(5000);
//根据文本值选中对应的选项
select.selectByVisibleText("山东");
Thread.sleep(5000);
//判断是不是多选的选择框返回boolean值
System.out.println(select.isMultiple());
//取消所有的选中
select.deselectAll();
Thread.sleep(5000);
}
}

4.3运行代码

1.运行代码,右键Run AS->Junit Test,控制台输出,如下图所示:

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

2.运行代码后电脑端的浏览器的动作,从视频中可以看到选择的值不断地在修改变化(山西->四川->山东),如下小视频所示:

5.新的select

宏哥发现随着技术的更新换代,现在好多下拉选择都很少用以前那种的方式,而是采用一种类似pop弹出的效果,直接弹出一个一个页面选择,如下图所示:

12306网站:

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

快递:

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

5.1项目实战

宏哥这里就以12306网站的“出发地”选择框给小伙伴们或者童鞋们来打个样。

具体步骤:
1.首先访问12306网站;

2.定位到出发站,点击;

3.弹出选项,定位要选择的选项,点击即可。

5.2代码设计

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

5.3参考代码

package lessons;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver; /**
* @author 北京-宏哥
*
* 《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)
*
* 2021年10月16日
*/
public class Select { public static void main(String[] args) throws InterruptedException { System.setProperty("webdriver.gecko.driver", ".\\Tools\\chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.manage().window().maximize(); driver.get("https://www.12306.cn/"); Thread.sleep(5000); //By id 定位
WebElement fromStationText = driver.findElement(By.id( "fromStationText" ));
fromStationText.click();
Thread.sleep(2000); WebElement fromStation = driver.findElement(By.xpath("//div/ul/li[text()='北京']"));
fromStation.click(); }
}

5.4运行代码

1.运行代码,右键Run AS->java Application,控制台输出,如下图所示:

《手把手教你》系列技巧篇(三十二)-java+ selenium自动化测试-select 下拉框(详解教程)

2.运行代码后电脑端的浏览器的动作,从视频中可以看到宏哥成功的将“出发站”选择为“北京”,如下小视频所示:

6.小结

其实无论哪种你只要定位到就可以操作实现自动化,只不过是以前的selenium封装好select类,直接调用比较方便而已,好了时间不早了,今天就分享到这里!!!