UI自动化测试对页面中定位到的元素对象做相应操作

Posted 温一壶清酒

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了UI自动化测试对页面中定位到的元素对象做相应操作相关的知识,希望对你有一定的参考价值。

 前两天分别讲述了UI自动化测试基础以及对页面元素该如何进行定位,这一篇自然就是对定位到的页面元素对象进行相应操作啦。

阅读目录

1.常用操作元素对象的方法

2.鼠标事件操作

3.键盘事件操作

4.WebElement接口常用方法

5.设置等待时间

6.打印验证信息

7.定位一组对象操作

8.层级定位操作

9.定位frame中对象操作

10.alert/confirm/prompt处理

11.下拉框处理

12.select菜单处理

13.selinium中调用js

1.常用操作元素对象的方法

webdriver中常用的操作元素的方法有如下几个:

  clear : 清除对象的内容

  send_keys : 在对象上模拟按键输入, 注意如果是函数需要增加转义符

  click : 单击对象, 强调对象的独立性

  submit : 提交表单, 要求对象必须是表单, 强调对象必须是表单

代码如下,仅供参考:

 1 package com.ui_auto;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.WebDriver;
 5 import org.openqa.selenium.WebElement;
 6 import org.openqa.selenium.chrome.ChromeDriver;
 7 
 8 public class yihuqingjiu_test_12306 {
 9 
10     public static void main(String[] args) throws Exception {
11         //chrom浏览器驱动的位置
12         System.setProperty("webdriver.chrome.driver","C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
13         //web驱动指向chrom驱动并创建对象driver
14         WebDriver driver=new ChromeDriver();
15         //获取网址
16         driver.get("https://www.baidu.com");
17         //浏览器最大化
18         driver.manage().window().maximize();
19         //kw是输入框的id,12306是在输入框中药输入的内容
20         driver.findElement(By.id("kw")).sendKeys("12306");
21         //su是搜索按钮的id
22         WebElement btn=driver.findElement(By.id("su"));
23         //点击事件
24         btn.submit();
25         //休眠时间
26         Thread.sleep(3000);
27         //关闭页面
28         driver.close();
29     }
30 
31 }

注意:

click():模拟鼠标点击元素
submit():提交表单(按钮),无法点击链接,当按钮无法在页面上点击到时用submit()(按钮被遮挡)

2.鼠标事件操作

在实际的web产品测试中,对于鼠标的操作,不单单只有click(),有时候还要用到右击、双击、拖动等操作,这些操作包含在Actions类中。
Actions类中鼠标操作常用方法:
1. contextClick() :右击
2. doubleClick() :双击
3. dragAndDrop() :拖动
4. moveToElement() :鼠标移动到一个元素上      (悬停)
5. click_and_hold() :按下鼠标左键在一个元素上   (左)
6. release() :鼠标释放
代码举例部分方法,仅供参考:
 1 package com.ui.day1;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.Keys;
 5 import org.openqa.selenium.WebDriver;
 6 import org.openqa.selenium.WebElement;
 7 import org.openqa.selenium.chrome.ChromeDriver;
 8 import org.openqa.selenium.interactions.Actions;
 9 
10 public class yihuqingjiu_test_demo3_mouse {
11 
12     public static void main(String[] args) throws Exception {
13         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
14         WebDriver driver=new ChromeDriver();
15         //浏览器要加载的url
16         driver.get("https://www.baidu.com");
17         //窗口最大化
18         driver.manage().window().maximize();
19         
20         //右击操作
21 //        WebElement e=driver.findElement(By.cssSelector("div#lg>img"));
22 //        Actions action=new Actions(driver);
23 //        action.contextClick(e).perform();
24         //鼠标移动
25         WebElement move=driver.findElement(By.cssSelector("a[name=\'tj_briicon\']"));
26         Actions action=new Actions(driver);
27         action.moveToElement(move).perform();
28         Thread.sleep(2000);
29         driver.findElement(By.cssSelector("a[name=\'tj_mp3\']")).click();
30         driver.close();
31 
32     }
33 
34 }

ActionChains用于生成用户的行为,所有的行为都存储在action对象,通过perform()执行存储的行为perform()执行所有ActionChains存储的行为,perform()同样也是ActionChains类提供的方法,经常结合在一起使用

3.键盘事件操作

在实际的web测试工作中, 需要配合键盘按键来操作, 对于键盘的模拟操作,Actions 类中有提供 keyUp(theKey)、 keyDown(theKey)、 sendKeys(keysToSend)等方法来实现。

在 WebDriver API 中,KeyDown(Keys theKey)、KeyUp(Keys theKey) 方法的参数只能是修饰键Keys.SHIFT、Keys.ALT、Keys.CONTROL, 否者将抛出IllegalArgumentException 异常。其次对于action.keyDown(theKey) 方法的调用,如果没有显示的调用 action.keyUp(theKey) 或者 action.sendKeys(Keys.NULL) 来释放的话, 这个按键将一直保持按住状态。

代码实现如下,仅供参考:

 1 package com.ui.day1;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.Keys;
 5 import org.openqa.selenium.WebDriver;
 6 import org.openqa.selenium.WebElement;
 7 import org.openqa.selenium.chrome.ChromeDriver;
 8 import org.openqa.selenium.interactions.Actions;
 9 
10 public class yihuqingjiu_test_demo3_mouse {
11 
12     public static void main(String[] args) throws Exception {
13         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
14         WebDriver driver=new ChromeDriver();
15         //浏览器要加载的url
16         driver.get("https://www.baidu.com");
17         //窗口最大化
18         driver.manage().window().maximize();
19 
20         //按下tab键
21 //        WebElement tab=driver.findElement(By.cssSelector("#kw"));
22 //        tab.sendKeys(Keys.TAB);
23         //按下退格键
24 //        WebElement tab1=driver.findElement(By.cssSelector("#kw"));
25 //        tab1.sendKeys("12306");
26 //        Thread.sleep(1000);
27 //        tab1.sendKeys(Keys.BACK_SPACE);
28 //        Thread.sleep(1000);
29         //按下组合键
30 //        Actions action=new Actions(driver);
31 //        WebElement ctr1=driver.findElement(By.cssSelector("#kw"));
32 //        action.keyDown(Keys.CONTROL).sendKeys("v").sendKeys(Keys.NULL).keyUp(Keys.CONTROL).perform();
33 
34         //按下ctrl+f4
35 //        WebElement ctr1=driver.findElement(By.cssSelector("#kw"));
36 //        ctr1.sendKeys("12306");
37 //        Thread.sleep(1000);
38 //        Actions action=new Actions(driver);
39 //        action.keyDown(Keys.CONTROL).sendKeys(Keys.F4).keyUp(Keys.CONTROL).perform();
40         //按下ctrl+shift+delete
41         Actions action=new Actions(driver);
42         action.keyDown(Keys.CONTROL).keyDown(Keys.SHIFT).sendKeys(Keys.DELETE).keyUp(Keys.CONTROL).keyUp(Keys.SHIFT).perform();
43         driver.close();
44 
45     }
46 
47 }

4.WebElement接口常用方法

WebElement接口常用方法

getSize(): 返回对象的尺寸

getText(): 获取对象的文本

get_attribute("属性名"): 获取对象的属性值

isDisplayed(): 用来判断对象是否可见, 即css的display属性是否为none

isEnabled(): 判断对象是否被禁用

isSelected(): 判断对象是否被选中

getTagName(): 获取对象标签名称

getLocation(): 获取元素坐标

getCookies()/getCookieNamed(cookie_name): 返回当前会话中的cookies

代码实现举例如下,仅供参考:

 1 package com.ui.day1;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.WebDriver;
 5 import org.openqa.selenium.chrome.ChromeDriver;
 6 
 7 public class yihuqingjiu_test_demo3_WebElement {
 8 
 9     public static void main(String[] args) throws Exception {
10         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
11         WebDriver driver=new ChromeDriver();
12         //浏览器要加载的url
13         driver.get("https://www.baidu.com");
14         //窗口最大化
15         driver.manage().window().maximize();
16 
17         //返回对象尺寸
18 //        int height=driver.findElement(By.cssSelector("#kw")).getSize().height;
19 //        int width=driver.findElement(By.cssSelector("#kw")).getSize().width;
20 //        System.out.println("height:"+height+"..."+"width:"+width);
21         //获取对象文本
22 //        String text=driver.findElement(By.cssSelector("a[name=\'tj_trmap\']")).getText();
23 //        System.out.println(text);
24         //获取对象属性值
25 //        String id=driver.findElement(By.cssSelector("#su")).getAttribute("id");
26 //        System.out.println(id);
27 //        String value=driver.findElement(By.cssSelector("#su")).getAttribute("value");
28 //        System.out.println(value);
29         //判断对象是否可见
30 //        boolean su =driver.findElement(By.cssSelector("#su")).isDisplayed();
31 //        System.out.println(su);
32 //        //判断对象是否被禁用
33 //        boolean su1=driver.findElement(By.cssSelector("#kw")).isEnabled();
34 //        System.out.println(su1);
35 //        //判断对象是否被选中
36 //        boolean su2=driver.findElement(By.cssSelector("#su")).isSelected();
37 //        System.out.println(su2);
38         //获取对象标签名称
39 //        String input=driver.findElement(By.cssSelector("#kw")).getTagName();
40 //        System.out.println(input);
41         //获取元素坐标,获取到的只是左上角的坐标
42         int x=driver.findElement(By.cssSelector("#su")).getLocation().x;
43         System.out.println(x);
44         int y=driver.findElement(By.cssSelector("#su")).getLocation().y;
45         System.out.println(y);
46         String z=driver.findElement(By.cssSelector("#su")).getLocation().toString();
47         System.out.println(z);
48         driver.close();
49         
50         
51     }
52 
53 }

5.设置等待时间

为了保证脚本的稳定性, 这就需要引入等待时间, 等待页面加载元素后再进行操作,不然会出现后者页面元素定位不到,而导致脚本运行出错, selenium提供三种等待时间设置方式。

①Thread.sleep(): 固定休眠时间设置,Java的Thread类里提供了休眠方法sleep,导入包后就能使用;需要注意的是:sleep()方法以毫秒为单位。

Thread.sleep(2000);//固定延时2秒

② implicitlyWait():implicitlyWait()方法比sleep()方法智能,sleep()方法只能在一个固定的时间等待,而implicitlyWait()可以在一个时间范围内等待,称为隐式等待。

       好比如:设置等待时间5s,页面上的元素3s后出现,只等待3s。不会等待5s隐性的等待其实就相当于设置全局的等待,在定位元素时,对所有元素设置超时时间,但对于页面跳转的地方该方法会导致出错,会抛出异常信息,如下所示:

Exception in thread "main" org.openqa.selenium.StaleElementReferenceException: stale element reference: element is not attached to the page document

这是提醒页面元素过期,解决办法,在出错的上一行代码加一个固定等待即可。

隐式等待代码举例如下,仅供参考:

 1 package com.ui.day1;
 2 
 3 import java.util.concurrent.TimeUnit;
 4 
 5 import org.openqa.selenium.By;
 6 import org.openqa.selenium.javascriptExecutor;
 7 import org.openqa.selenium.WebDriver;
 8 import org.openqa.selenium.WebElement;
 9 import org.openqa.selenium.chrome.ChromeDriver;
10 import org.openqa.selenium.support.ui.ExpectedCondition;
11 import org.openqa.selenium.support.ui.WebDriverWait;
12 
13 public class yihuqingjiu_wait {
14 
15     public static void main(String[] args) throws Exception {
16         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
17         WebDriver driver=new ChromeDriver();
18         //浏览器要加载的url
19         driver.get("https://www.baidu.com/");
20         //窗口最大化
21         driver.manage().window().maximize();
22         
23         //隐式等待
24         driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);
25         //定位百度首页输入框
26         driver.findElement(By.cssSelector("#kw")).sendKeys("苏宁易购");
27         //点位搜索按钮
28         WebElement su=driver.findElement(By.cssSelector("#su"));
29         su.click();
30         String cl = driver.findElement(By.cssSelector("#su")).getAttribute("class");
31         System.out.println(cl);
32         //定位苏宁易购的官方网址
33         Thread.sleep(2000);
34         WebElement left=driver.findElement(By.cssSelector("div#content_left a:nth-of-type(1)"));
35         left.click();
36         //高亮代码
37         ((JavascriptExecutor) driver).executeScript(
38                 "arguments[0].style.border=\'5px solid yellow\'", su);
39         ((JavascriptExecutor) driver).executeScript(
40                 "arguments[0].style.border=\'5px solid yellow\'", left);
41         
42     }
43 
44 }

此处的高亮代码指的是,定位到的元素位置用js加个效果,从而实现高亮,效果图如下所示:

③WebDriverWait():显示等待就是明确的要等到某个元素的出现或者是某个元素的可点击等条件,等不到,就一直等,除非在规定的时间之内都没找到,那么就跳出Exception。

显示等待检查机制:每隔500毫秒检查一次页面上的元素是否存在,如果存在则返回
代码举例如下,仅供参考:
 1 package com.ui.day1;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.JavascriptExecutor;
 5 import org.openqa.selenium.WebDriver;
 6 import org.openqa.selenium.WebElement;
 7 import org.openqa.selenium.chrome.ChromeDriver;
 8 import org.openqa.selenium.support.ui.ExpectedCondition;
 9 import org.openqa.selenium.support.ui.WebDriverWait;
10 
11 public class yihuqingjiu_wait {
12 
13     public static void main(String[] args) throws Exception {
14         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
15         WebDriver driver=new ChromeDriver();
16         //浏览器要加载的url
17         driver.get("https://www.baidu.com/");
18         //窗口最大化
19         driver.manage().window().maximize();
20         
21         //显示等待
22         //定位百度首页输入框
23         driver.findElement(By.cssSelector("#kw")).sendKeys("苏宁易购");
24         //点位搜索按钮
25         WebElement su=driver.findElement(By.cssSelector("#su"));
26         su.click();
27         WebDriverWait wait = new WebDriverWait(driver, 10);
28         WebElement wt = wait.until(new ExpectedCondition<WebElement>() {
29             public WebElement apply(WebDriver d) {
30             return d.findElement(By.cssSelector("div#content_left a:nth-of-type(1)"));
31             }
32             });
33         String cl = driver.findElement(By.cssSelector("#su")).getAttribute("class");
34         System.out.println(cl);
35         ((JavascriptExecutor) driver).executeScript(
36                 "arguments[0].style.border=\'5px solid yellow\'", wt);
37     }
38 
39 }

显示等待是使用了一个匿名函数来实现,代码中,driver会传给d,d就相当于浏览器的驱动,然后再去查找需要的元素,其中只有十秒钟的时间,时间可更改。

6.验证信息

通过获取页面的title、URL地址,页面上的标识信息来判断用例是否执行成功。

代码试下如下,仅供参考:

 1 package com.ui_auto;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.WebDriver;
 5 import org.openqa.selenium.WebElement;
 6 import org.openqa.selenium.chrome.ChromeDriver;
 7 
 8 public class yihuqingjiu_test_12306 {
 9 
10     public static void main(String[] args) throws Exception {
11         //chrom浏览器驱动的位置
12         System.setProperty("webdriver.chrome.driver","C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
13         //web驱动指向chrom驱动并创建对象driver
14         WebDriver driver=new ChromeDriver();
15         //获取网址
16         driver.get("https://www.baidu.com");
17         //浏览器最大化
18         driver.manage().window().maximize();
19         //kw是输入框的id,12306是在输入框中药输入的内容
20         driver.findElement(By.id("kw")).sendKeys("12306");
21         //su是搜索按钮的id
22         WebElement btn=driver.findElement(By.id("su"));
23         //点击事件
24         btn.submit();
25         //休眠时间
26         Thread.sleep(3000);
27         String title = driver.getTitle();
28       if((title.compareTo("百度一下, 你就知道"))==0)
29           System.out.println("title is correct!!");
30       else
31           System.out.println("title is error!!");
32 
33                 //关闭页面
34         driver.close();
35     }
36 
37 }
38         

7.定位一组对象操作

webdriver使用findElement方法定位一个特定的对象,不过我们有时需定位一组对象, webdriver同样提供了定位一组元素的方法叫findElements。

定位一组对象一般用于如下两个场景:
①批量操作对象,比如将页面上的checkbox都勾选上。
②先获取一组对象,再在这组对象中过滤需要具体定位的一些对象。
代码实现方式多样,可使用for循环,集合列表,多个节点,遍历,迭代器等方式实现,试下部分代码如下,仅供参考:
//单个元素定位
// driver.findElement(By.cssSelector("#web")).click();
// driver.findElement(By.cssSelector("#training")).click();
// driver.findElement(By.cssSelector("#friend")).click();
// driver.findElement(By.cssSelector("#other")).click();
//单个元素for循环定位
// for(int i=1;i<5;i++)
//节点
// driver.findElement(By.cssSelector("div#checkbox > input:nth-of-type("+"i"+")")).click();
//集合
List<WebElement> lt=driver.findElements(By.cssSelector("input[type=\'checkbox\']"));
for(int i=0;i<lt.size();i++)
lt.get(i).click();
Thread.sleep(2000);

//for循环遍历
for(WebElement e:lt)
e.click();
Thread.sleep(2000);
//迭代器
Iterator<WebElement> itr=lt.iterator();
while(itr.hasNext())
itr.next().click();
Thread.sleep(2000);
driver.quit();

8.层级定位操作

经常会遇到无法直接定位到需要选取的元素, 但是其父元素比较容易定位, 通过定位父元素再遍历其子元素选择需要的目标元素,或者需要定位某个元素下所有的子元素。层级定位的思想是先定位父对象,然后再从父对象中精确定位出其我们需要选取的后代元素。

以登录百度账号为例,代码实现如下,仅供参考:

 1 package com.ui.day2;
 2 
 3 import java.util.List;
 4 import java.util.concurrent.TimeUnit;
 5 
 6 import org.openqa.selenium.By;
 7 import org.openqa.selenium.WebDriver;
 8 import org.openqa.selenium.WebElement;
 9 import org.openqa.selenium.chrome.ChromeDriver;
10 
11 public class yihuqingjiu_tese_baidu_login {
12 
13     public static void main(String[] args) throws Exception {
14         System.setProperty("webdriver.chrome.driver","C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
15         WebDriver driver=new ChromeDriver();
16 
17         driver.get("https://www.baidu.com");
18         driver.manage().window().maximize();
19         //定位登录按钮
20         //driver.findElement(By.cssSelector("div#u1 a[name=\'tj_login\']")).click();
21         //列表定位
22         List<WebElement> list=driver.findElements(By.cssSelector("a[name=\'tj_login\']"));
23         list.get(1).click();
24         //需要等待时间,不然定位不到
25         Thread.sleep(1000);
26         driver.findElement(By.id("TANGRAM__PSP_10__userNameWrapper")).findElement(By.id("TANGRAM__PSP_10__userName")).sendKeys("223456789@qq.com");
27         //Thread.sleep(1000);
28         driver.findElement(By.id("TANGRAM__PSP_10__passwordWrapper")).findElement(By.id("TANGRAM__PSP_10__password")).sendKeys("1234567890");
29         
30     }
31 
32 }
33         

9.定位frame中对象操作

在web应用中经常会出现frame嵌套的应用,假设页面上有A,B两个frame,其中B在A内,那么定位B中的内容则需要先到A,再到B。switchTo().frame方法可以把当前定位的主题切换到frame里,在frame里实际是嵌套了另外一个页面,而webdriver每次只能在一个页面识别,所以需要用switchTo().frame方法去获取frame中嵌套的页面。
代码实现以禅道提Bug中的重现操作步骤为例,仅供参考:
 1 package com.ui.day1;
 2 
 3 import org.openqa.selenium.By;
 4 import org.openqa.selenium.JavascriptExecutor;
 5 import org.openqa.selenium.Keys;
 6 import org.openqa.selenium.WebDriver;
 7 import org.openqa.selenium.WebElement;
 8 import org.openqa.selenium.chrome.ChromeDriver;
 9 
10 public class yihuqingjiu_test_demo3_chandao {
11 
12     public static void main(String[] args) throws Exception {
13         System.setProperty("webdriver.chrome.driver", "C:\\\\Program Files (x86)\\\\Google\\\\Chrome\\\\Application\\\\chromedriver.exe");
14         WebDriver driver=new ChromeDriver();
15         driver.get("http://127.0.0.1/zentao/my/");
16         driver.manage().window().maximize();
17  

以上是关于UI自动化测试对页面中定位到的元素对象做相应操作的主要内容,如果未能解决你的问题,请参考以下文章

java selenium 元素定位大全

UI自动化测试浏览器操作及对元素的定位方法(xpath定位和css定位详解)

web自动化测试-第二讲: 页面元素定位操作

UI自动化项目分层设计思想(po模式)

UI自动化测试中的页面定位问题,年薪50W软件测试工程师为你解答

UI 自动化测试框架:PO 模式+数据驱动