Selenium学习之元素定位

 

最近在学习Selenium的自动化测试，最基础的学习就是元素定位了，鉴于定位方法较多，我又是个初学者，所以边学边记录一下。感谢白月黑羽提供的学习视频，又想要学习的去B站上搜索，对于入门者来说真的很棒，再次感谢！

（一）元素定位方法

如上图所示，有八种元素定位方法，要注意的是，用id获取的元素肯定是唯一的，而用其他的方法可能会找到多个元素，但只会返回第一个。所以其他七种定位方法有对应的find_elements_by_X的方法，用find_elements_by_X会返回元素集合。

使用css选择器和xpath来定位元素，对于初学者来说可能会有些复杂。因为对css选择器和xpath不熟的话，我们不知道在方法中该输入什么内容。

有个简单的解决方法，我们可以将鼠标移到对应元素的HTML代码上方，“右键——>Copy——>Copy selector”来获取css 选择器，同理“右键——>Copy——>Copy xpath”来获取xpath。例如：find_element_by_css_selector('#su') 和 find_element_by_xpath('//*[@id="su"]')，这是分别通过css选择器和xpath的方式去获取百度首页的百度一下按钮这个元素。

• css选择器定位元素时，默认id用“#”号，class用英文句号“.” ,父元素和子元素之间用“>”连接，祖宗元素和后代元素之间用空格连接，如果需要获取多个不同属性的元素，则用英文逗号“,”相隔。
• xpath则是用 [@属性名=''属性值"]的方式，即[@id="id值"]，[@class=“class值”]等等，但必须注意的是，xpath中用到的class值必须是完整的，而css选择器只需要取其中一个。

举个例子，示例代码如下：

    
        
        

            
点吧
            
健康
            
平安
            
快乐
        
    

（1）如果想取到a1这个元素，可以用以下几种方式：

# 取元素h1
#在css选择器查找元素时，“#”代表通过id获取元素，“>” 代表父子元素的关系，空格 代表祖宗元素跟后代元素的关系
#css选择器的“>”相当于xpath的“/”，同理 空格 相当于 “//”
find_element_by_css_selector("html>body #A>h1")
find_element_by_xpath('/html/body//*[@id="A"]/h1')

#上面的也可以简写
find_element_by_css_selector("#A>h1")
find_element_by_xpath('//*[@id="A"]/h1')

# 在css选择其查找元素时，“.”代表通过class值获取元素，且只能取一个class值（指空格分开的多个class值的其中一个），而xpath要取完整的class值
find_element_by_css_selector('#A>.aaa') 或 find_element_by_css_selector('#A>.a-btn')
find_element_by_xpath('//*[@id="A"]/h1[@class="aaa a-btn"]')

要注意的是：上面的代码中有比较多的用到星号“*”，这其实是一个通配符，表示无所谓元素的tag名称是什么。当然我们也可以用正确的tag名称去代替它，是一样的定位效果。

（2）如果想取多个元素，例如“a1”和所有的“p”元素，可以用下面的方式：

#取全部a1和p元素
#css选择器的“,”相当于xpath的“|”
find_element_by_css_selector("#A>a1 , #A>p")
find_element_by_xpath("/A/a1 | /A/p")

（二）实操（白月黑羽的测试用例，文档下载：https://github.com/jcyrss/baiyueheiyu/files/3986495/tcs-selenium.xlsx）

1、不完整或错误的账号密码登录：

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0001 测试步骤：1、不输入管理员账号,输入密码 88888888；2、登录    预期结果：提示“请输入用户名”
wd.find_element_by_id('username').clear()
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

alert = wd.switch_to.alert
print(alert.text)
if alere.text == '请输入用户名':
	print('UI-0001 test True')
else:
	print('UI-0001 test False')
   
alert.accept()
	
#UI-0002 测试步骤：1、使用 正确的管理员账号 byhy，不输入密码；2、登录    预期结果：提示“请输入密码”
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').clear()
wd.find_element_by_class_name('btn').click()

alert = wd.switch_to.alert
print(alert.text)
if alere.text == '请输入密码':
	print('UI-0002 test True')
else:
	print('UI-0002 test False')
    
alert.accept()
	
#UI-0003 测试步骤：1、使用 不存在的管理员账号byh和密码88888888；2、登录   预期结果：提示“登录失败 : 用户名或者密码错误”
wd.find_element_by_id('username').send_keys('byh')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

alert = wd.switch_to.alert
print(alert.text)
if alere.text == '登录失败 : 用户名或者密码错误'
	print('UI-0003 test True'):
else:
	print('UI-0003 test False')
    
alert.accept()
	
#UI-0004 测试步骤：1、使用 正确的管理员账号byhy和错误的密码8888888；2、登录     预期结果：提示“登录失败 : 用户名或者密码错误”
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('8888888')
wd.find_element_by_class_name('btn').click()

alert = wd.switch_to.alert
print(alert.text)
if alere.text == '登录失败 : 用户名或者密码错误':
	print('UI-0004 test True')
else:
	print('UI-0004 test False')
    
alert.accept()
	
#UI-0005 测试步骤：1、使用 正确的管理员账号byhy和错误的密码888888888；2、登录     预期结果：提示“登录失败 : 用户名或者密码错误”
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('888888888')
wd.find_element_by_class_name('btn').click()

alert = wd.switch_to.alert
print(alert.text)
if alere.text == '登录失败 : 用户名或者密码错误':
	print('UI-0005 test True')
else:
	print('UI-0005 test False')
    
alert.accept()

wd.quit()

2、成功登录并验证左侧菜单：

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0101
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

wrapper = wd.find_element_by_id('root')
aside = wrapper.find_element_by_tag_name('aside') #获取左侧菜单树
spans = aside.find_element_by_tag_name('span') 
for span in spans:
	print(span.text)

if spans[0].text == '客户' and spans[1].text == '药品' and spans[2].text == '订单':
	print('UI-0101 test True')
else:
	print('UI-0101 test False')
    
wd.quit()

3、添加客户并验证

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0102
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

content_wrapper = wd.find_element_by_class_name('content-wrapper')
content_wrapper.find_element_by_class_name('btn').click() #点击“添加客户”按钮
namePhoneAddr = content_wrapper.find_elements_by_class_name('form-control')

namePhoneAddr[0].send_keys('南方中医院') #输入客户名
namePhoneAddr[1].send_keys('12345678901')  #输入联系电话
namePhoneAddr[2].send_keys('广州市哪哪哪')  #输入地址

content_wrapper.find_elements_by_class_name('btn-xs')[0].click() #点击“创建”按钮

search_result_item = content_wrapper.find_element_by_class_name('search-result-item')
spans = search_result_item.find_elements_by_tag_name('span')
for span in spans:
	print(span.text)
	
if spans[1].text == '南方中医院' and spans[3].text == '12345678901' and spans[5].text == '广州市哪哪哪':
	print('UI-0102 test True')
else:
	print('UI-0102 test False')
    
wd.quit()

4、创建客户、编辑已添加的客户并验证编辑是否成功

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0103
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

wd.find_element_by_css_selector('#root .content-wrapper .btn-md').click() #点击“添加客户”按钮
namePhoneAddr = wd.find_elements_by_css_selector('#root .content-wrapper .col-sm-8 .form-control')

namePhoneAddr[0].send_keys('南京中医院') #输入客户名
namePhoneAddr[1].send_keys('12345678901')  #输入联系电话
namePhoneAddr[2].send_keys('广州市哪哪哪')  #输入地址

wd.find_element_by_css_selector('#root .content .btn-xs').click() #点击“创建”按钮

wd.find_element_by_css_selector('#root .content .search-result-item .btn-xs').click() #点击“编辑”按钮
wd.find_element_by_css_selector('#root .content .search-result-item input[value="南京中医院"]').clear()
wd.find_element_by_css_selector('#root .content .search-result-item input[value="南京中医院"]').send_keys('南京省中医院')
wd.find_element_by_css_selector('#root .content .search-result-item .btn-green').click() #点击“确定”按钮

spans = wd.find_elements_by_tag_name('#root .content .search-result-item span')
for span in spans:
	print(span.text)
	
name = wd.find_element_by_css_selector('#root .content .search-result-item span:nth-child(2)').text #客户名的文本内容
if name == '南京省中医院':
	print('UI-0103 test True')
else:
	print('UI-0103 test False')
	
wd.quit()

5、添加药品并验证

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0105
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

wd.find_element_by_css_selector('#root .fa-plus').click() #点击“药品”按钮
wd.find_element_by_css_selector('#root .content .btn-md').click() #点击“添加药品”按钮
nameNum = wd.find_elements_by_css_selector('#root .content .col-sm-8 input')

list1 = ['红霉素软膏','09876','用于皮肤治疗']
nameNum[0].send_keys(list[0]) #输入药品名称
nameNum[1].send_keys(list[1])  #输入编号
wd.find_element_by_css_selector('#root .content textarea').send_keys(list[2])  #输入描述
wd.find_element_by_css_selector('#root .content .btn-xs').click() #点击“创建”按钮

spans = wd.find_elements_by_css_selector('#root .content .search-result-item span:nth-child(even)') #选择偶数节点，如果是奇数则括号里面填“odd”
list2 = []
for span in spans:
	print(span.text)
    list2.append(span.text)
	
import operator
if operator.eq(list1,list2):
	print('UI-0105 test True')
else:
	print('UI-0105 test False')

wd.quit()

6、正常登录+导航菜单名验证+退出登录

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0106
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

mainWindow = wd.current_window_handle

# 点击打开新窗口的链接
link = wd.find_element_by_css_selector('footer > div > a[href]')
link.click()

# wd.title属性是当前窗口的标题栏 文本
print(wd.title) 

for handle in wd.window_handles:
    wd.switch_to.window(handle)
    if '白月黑羽教Python' in wd.title:
        break
       
wd.maximize_window()

spans = wd.find_elements_by_css_selector('.navbar-collapse span')
list1 = []
for span in spans:
    print(span.text)
    list1.append(span.text)

list2 = ['Python基础', 'Python进阶', '图形界面', 'Web开发', '自动化测试', '性能测试', '常见问题', '其它']

import operator #添加operator模块用于比较，python2中用cmp函数
if operator.eq(list1, list2):
    print('导航菜单名验证 通过')
else:
    print('导航菜单名验证 不通过')

#切换回白月SMS管理系统
wd.switch_to.window(mainWindow)
for handle in wd.window_handles:
    wd.switch_to.window(handle)
    if '白月销售管理系统' in wd.title:
        break

wd.find_element_by_css_selector('.hidden-xs').click()
wd.find_element_by_css_selector('.user-footer .pull-right .btn-flat').click()

print(wd.current_url)
if wd.current_url = 'http://127.0.0.1/mgr/sign.html':
    print('UI-0106 Test True')
else:
    print('UI-0106 Test False')

wd.quit()

7、新建客户和药品，生成订单

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0107
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time
time.sleep(2)

wd.find_element_by_css_selector('#root .content-wrapper .btn-md').click() #点击“添加客户”按钮
namePhoneAddr = wd.find_elements_by_css_selector('#root .content-wrapper .col-sm-8 .form-control')

userInfo1 = ['南京中医院1','2551867851','江苏省-南京市-秦淮区-汉中路-501'] 
userInfo2 = ['南京中医院2','2551867852','江苏省-南京市-秦淮区-汉中路-502']
userInfo3 = ['南京中医院3','2551867853','江苏省-南京市-秦淮区-汉中路-503']

#创建第1个客户
for i in range(len(userInfo1)):
	namePhoneAddr[i].send_keys(userInfo1[i])
wd.find_element_by_css_selector('#root .content .btn-xs').click()
time.sleep(2)

#创建第2个客户
for i in range(len(userInfo2)):
	namePhoneAddr[i].send_keys(userInfo2[i])
wd.find_element_by_css_selector('#root .content .btn-xs').click()
time.sleep(2)

#创建第3个客户
for i in range(len(userInfo3)):
	namePhoneAddr[i].send_keys(userInfo3[i])
wd.find_element_by_css_selector('#root .content .btn-xs').click()
time.sleep(2)

wd.find_element_by_css_selector('#root .fa-plus').click() #点击“药品”按钮
wd.find_element_by_css_selector('#root .content .btn-md').click() #点击“添加药品”按钮
nameNum = wd.find_elements_by_css_selector('#root .content .col-sm-8 input')

medInfo1 = ['青霉素盒装1','YP-32342341','青霉素注射液，每支15ml，20支装']
medInfo2 = ['青霉素盒装2','YP-32342342','青霉素注射液，每支15ml，30支装']
medInfo3 = ['青霉素盒装3','YP-32342343','青霉素注射液，每支15ml，40支装']

nameNum[0].send_keys(medInfo1[0]) #输入药品名称
nameNum[1].send_keys(medInfo1[1])  #输入编号
wd.find_element_by_css_selector('#root .content textarea').send_keys(medInfo1[2])  #输入描述
wd.find_element_by_css_selector('#root .content .btn-xs').click() #点击“创建”按钮
time.sleep(2)

nameNum[0].send_keys(medInfo2[0]) #输入药品名称
nameNum[1].send_keys(medInfo2[1])  #输入编号
wd.find_element_by_css_selector('#root .content textarea').send_keys(medInfo2[2])  #输入描述
wd.find_element_by_css_selector('#root .content .btn-xs').click() #点击“创建”按钮
time.sleep(2)

nameNum[0].send_keys(medInfo3[0]) #输入药品名称
nameNum[1].send_keys(medInfo3[1])  #输入编号
wd.find_element_by_css_selector('#root .content textarea').send_keys(medInfo3[2])  #输入描述
wd.find_element_by_css_selector('#root .content .btn-xs').click() #点击“创建”按钮
time.sleep(2)

wd.find_element_by_css_selector('.fa-paperclip').click()
wd.find_element_by_css_selector('.add-one-area .btn-md').click()

# 导入Select类
from selenium.webdriver.support.ui import Select

# 创建Select对象
select = Select(wd.find_element_by_css_selector("#root .xxx"))
select.select_by_visible_text("南京中医院2")
select = Select(wd.find_elements_by_css_selector("#root .xxx")[1])
select.select_by_visible_text("青霉素盒装1")
wd.find_elements_by_css_selector('#root .content .col-lg-8 input')[2].send_keys('100') #输入药品数量
wd.find_element_by_css_selector('#root .content .btn-xs').click()

name = wd.find_elements_by_css_selector('#root .content .search-result-item span:nth-child(even)')[2]
med = wd.find_element_by_css_selector('#root .content .search-result-item p')

if name.text == '南京中医院2' and med.text == '青霉素盒装1 * 100':
	print('UI-0107 test True')
else:
	print('UI-0107 test False')
	
wd.quit()

8、删除原有的客户和药品再新建，并且生成订单（这里只放了删除的代码，新建和生成订单的参考第7条）

from selenium import webdriver

# 创建 WebDriver 对象，指明使用chrome浏览器驱动
wd = webdriver.Chrome(r'D:\ChromeDriver\chromedriver.exe')

# 调用WebDriver 对象的get方法 可以让浏览器打开指定网址
wd.get('http://127.0.0.1/mgr/sign.html')

#UI-0108
wd.implicitly_wait(10)
wd.find_element_by_id('username').send_keys('byhy')
wd.find_element_by_id('password').send_keys('88888888')
wd.find_element_by_class_name('btn').click()

import time

deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs:nth-child(even)')
for dele in deletes:
    dele.click()
    time.sleep(2)
    alert = wd.switch_to.alert
    alert.accept()
    deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs:nth-child(even)') #一定要有这一行，对deletes进行刷新
    time.sleep(2)

wd.find_element_by_css_selector('#root .fa-plus').click() #点击“药品”按钮
deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs:nth-child(even)')
for dele in deletes:
    dele.click()
    time.sleep(2)
    alert = wd.switch_to.alert
    alert.accept()
    deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs:nth-child(even)') #一定要有这一行，对deletes进行刷新
    time.sleep(2)

wd.find_element_by_css_selector('#root .fa-paperclip').click() #点击“订单”按钮
deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs')
for dele in deletes:
    dele.click()
    time.sleep(2)
    alert = wd.switch_to.alert
    alert.accept()
    deletes = wd.find_elements_by_css_selector('.btn-group .btn-xs') #一定要有这一行，对deletes进行刷新
    time.sleep(2)
    
wd.quit()

以上就是我学习元素定位的相关记录和实践代码~