Web UI自动化测试主要就是元素定位+操作元素,Webdriver根据网页中页面元素拥有不同的标签名和属性值等特性来定位不同的页面元素,并完成对已定位的页面元素的各种操作。
WebDriver属于Selenium体系中设计出来的操作浏览器的一套API,它针对多种编程语言都实现了一遍这套API,所以它可以支持多种编程语言;webdriver是Python的一个用于实现web自动化的第三方库。
入门Selenium自动化测试的关键除了之前的测试框架之外就是 WebDriver API。
1 元素定位的基础知识:
1.1 网页文本特性:
首先我们用selenium做自动化,都是针对网页产品来做的,在做元素定位之前可以简单了解一下网页文本的特性:
- 它们由标签对所组成;
2)标签可以有各种属性;
3)标签对之间可以有文本数据;
4)标签之间有层级关系
1.2 元素定位
从上面的特性可以得知,可以通过很多途径进行元素定位,在定位是可以用绝对路径也可以用的相对路径。
在WebDriver里,有个WebElement类,它里面定义好了元素定位的方法。从定位元素个数的角度,元素定位的方法可分为两个系列:
1.find_element系列:用于定位单个的页面元素。一共提供了8种元素定位的方法:
1)id定位:通过元素的id属性的取值来定位元素
find_element_by_id(“xx”)
2)name定位:通过元素的name属性来定位元素。
find_element_by_name(“xx”)
3)class 定位:通过元素的class属性来定位元素。
find_element_by_class_name(“xx”)
4)tag name定位:通过元素的标签名来定位元素
find_element_by_tag_name(“xx”)
5)link text定位:通过链接文本信息来定位元素
find_element_by_link_text(“xx”)
6)partial link text定位:是对link text的补充,有些文本链接比较长,或者有些文本链接其中一部分是动态生成的,这个时候,我们可以选择取该文本链接的一部分定位,只要保证这部分信息可以唯一的标识这个链接。
find_element_by_partial_link_text(“xx”)
如果把定位元素比喻成找人,那么上面的定位方法可以说是通过你的身份证号、姓名等属性找到你,而下面所说的xpath和css定位,与前面6种相比,提供了更加灵活的定位策略,可以通过不同的方式定位到想要的元素。我理解的就是可以通过定位你的位置找到你。
7)xpath定位:
find_element_by_xpath(“xpath表达式”)
xpath是一种在xml文档种定位元素的语言。因为HTML可以看作是XML的一种实现,所以我们可以使用xpath语言在web种做元素定位。
(1)使用绝对路径的方式定位
/html/body/div[2]/form/input[3]
其中,第一个 / 表示的是根目录,使用中括号可以选择分支,div[2]代表当前层级下的第二个div标签。
一般绝对路径用的比较少,因为绝对路径一般都比较长不太好维护,还有一点就是如果开发过程中改了代码,可能就会定位失效。
(2)使用相对路径的方式定位
//input[@id=‘kw’]
注解:
——示例的含义:在当前页面找到任意目录下,元素名称为input且该元素有id属性,且id属性取值为kw的元素。
——//表示的是任意目录下
——属性以@开头
——所选取的属性可以是任意属性,只要它有利于标识这个元素即可。
(3)层级与属性结合来定位(使用得最多)
//span[@class=‘tgs’]/input
注解:
——示例的含义:任意目录下的span标签,该标签有class属性取值为tgs,我们找到折耳根标签下的input标签所对应的元素
——有时候,一个元素本身没有可以唯一标识这个元素的属性值,那么我们可以找其上一级元素,甚至上上一级……
——可以选择使用谷歌的开发者工具:f12——》使用元素拾取器在想定位的页面元素上点一下,代码区域就会高亮显示该元素所对应的代码,你在代码上右击,选择复制——》复制xpath——》找个记事本粘贴出来的就是xpath表达式。
//[@id=“ls_username”]
//[@id=“scbar_txt”]
/html/body/div[6]/div[3]/div[2]/div[1]/div/div[2]/table/tbody/tr[1]/td[2]/h2/a
——有时候,可能会使用到逻辑运算符(有时候一个属性不能唯一的标识一个元素,可以用逻辑运算符and链接多个属性来进行标识)
假如想唯一的定位到第一个元素,那么xpath表达式可以写成://input[@class=‘su’ and @name=‘ie1’]
8)CSS定位
find_element_by_css_selector(“csss表达式”)
CSS:一种描述网页样式的语言。
CSS格式:选择器+样式声明语句(一组或多组属性值所组成)
选择器{
属性1:值1;
属性2:值2;
}
注解:
选择器指明了后面{}里的样式作用于页面种的哪些元素;样式声明语句决定了样式的具体表现。
这里的选择器可以被Selenium用来做元素定位。
CSS常见的选择器:
(1)类选择器 .class
eg: .btn 选择class='btn’的所有元素
(2)id选择器 #id
eg: #btn 选择id='btn’的所有元素
(3)元素选择器:使用的是元素名称
eg: p 选择所有标签名为p的元素
(4)属性选择器:[属性=值]
eg: [title=‘abc’] 选择title='abc’的所有元素
(5)选择所有的元素: *
(6)element>element
eg:div>input 选择父元素为
(7)element+element
eg:div+input 选择同一层级中紧接在div元素之后的所有input元素
eg:
find_element_by_css_selector(".btn")
find_element_by_css_selector("#btn")
find_element_by_css_selector("[title=‘submit’]")
find_element_by_css_selector(’[title=“submit”]’)
find_element_by_css_selector("[title=submit]")
find_element_by_css_selector(’[title=submit]’)
——》对于CSS属性值来讲,可加引号,也可以不加,但注意要和整个字符串的引号进行区分。
xpath定位和css定位的比较:
通过标签定位: xpath //div
css div
通过id定位: xpath //div[@id=‘x’]
css div#x
通过class定位: xpath //div[@class=‘y’]
css div.y
通过属性定位 xpath //div[@title=‘z’]
css div[title=z]
定位子元素 xpath //div/h1
css div>h1
2)find_elements系列:用于定位一组页面元素