当前位置：首页 > news >正文

webdriver API进阶

news 来源：原创 2024/5/7 12:51:25

一、定位一组元素

webdriver 可以很方便的使用findElement 方法来定位某个特定的对象，不过有时候我们却需要定位一组对象，这时候就需要使用findElements 方法。
在这里插入图片描述
用以下HTML示例说明：


<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Checkbox</title>
</head>
<body>
<h3>checkbox</h3>
<div class="well">
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="c1">checkbox1</label>
<div class="controls">
<input type="checkbox" id="c1" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="c2">checkbox2</label>
<div class="controls">
<input type="checkbox" id="c2" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="c3">checkbox3</label>
<div class="controls">
<input type="checkbox" id="c3" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="r">radio</label>
<div class="controls">
<input type="radio" id="r1" />
</div>
</div>
<div class="control-group">
<label class="control-label" for="r">radio</label>
<div class="controls">
<input type="radio" id="r2" />
</div>
</div>
</form>
</div>
</body>
</html>

用浏览器打开这个页面可以看到三个复选框和两个单选框，编写自动化测试脚本：来定位这三个复选框
在这里插入图片描述

from selenium import webdriver
import time
import os
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/checkbox.html")
driver.get(url)
time.sleep(3)
driver.maximize_window()
#勾选里面所有的checkbox
# driver.find_element_by_id("c1").click()
# driver.find_element_by_id("c2").click()
# driver.find_element_by_id("c3").click()
#定位一组tag name 都为input的元素    注意一定要是elements
buttons=driver.find_elements_by_tag_name("input")
for button in buttons:
#get_attribute：获得属性值
     if button.get_attribute('type')=='checkbox':
        button.click()
time.sleep(5)
driver.quit()

二、多层框架/窗口定位

多层框架定位：解决不同层框架上的页面的元素的定位

定位一个frame ：switch_to.frame(name_or_id_or_frame_element)
定位一个窗口window：switch_to.window(name_or_id_or_frame_element)
在这里插入图片描述
多层窗口定位 :有可能嵌套的不是框架，而是窗口，还有针对窗口的方法：switch_to.window.
用法与switch_to.frame 相同：driver.switch_to.window("windowName")

用以下HTML示例说明：

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>frame</title>
<link
href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstra
p-combined.min.css" rel="stylesheet" />
<script type="text/javascript">$(document).ready(function(){
});
</script>
</head>
<body>
<div class="row-fluid">
<div class="span10 well">
<h3>frame</h3>
<iframe id="f1" src="inner.html" width="800",
height="600"></iframe>
</div>
</div>
</body>
<script
src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.
min.js"></script>
</html>

inner.html

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>inner</title>
</head>
<body>
<div class="row-fluid">
<div class="span6 well">
<h3>inner</h3>
<iframe id="f2" src="http://www.baidu.com"
width="700"height="500"></iframe>
<a href="javascript:alert('watir-webdriver better than
selenium webdriver;')">click</a>
</div>
</div>
</body>
</html>

通过switch_to.frame() 方法来进行定位：

from selenium import webdriver
import time
import os
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/frame.html")
driver.get(url)
time.sleep(3)
driver.maximize_window()
#从默认页面到f1框架页面
driver.switch_to.frame("f1")
#再找到其下面的ifrome2(id =f2)
driver.switch_to.frame("f2")
#下面就可以正常的操作元素了
driver.find_element_by_link_text("click").click()
#回到默认页面
driver.switch_to.default_content()
time.sleep(5)
driver.quit()

注意：
（1）如果要定位一个层级框架中的元素，必须先调到这个框架层级，才可以定位。
（2）如果要定位某一个层级，必须从默认页面：switch_to.default_content() 跳转。

三、层次定位

有时候我们需要定位的元素没有直接在页面展示，而是需要对页面的元素经过一系列操作之后才展示出来，这个时候我们就需要一层层去定位。
用以下HTML示例说明：

<html>
    <head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <title>Level Locate</title>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <link
    href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
    </head>
    <body>
    <h3>Level locate</h3>
    <div class="span3">
    <div class="well">
    <div class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown"
    href="#">Link1</a>
    <ul class="dropdown-menu" role="menu"
    aria-labelledby="dLabel" id="dropdown1" >
    <li><a tabindex="-1" href="#">Action</a></li>
    <li><a tabindex="-1" href="#">Another action</a></li>
    <li><a tabindex="-1" href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a tabindex="-1" href="#">Separated link</a></li>
    </ul>
    </div>
    </div>
    </div>
    <div class="span3">
    <div class="well">
    <div class="dropdown">
    <a class="dropdown-toggle" data-toggle="dropdown"
    href="#">Link2</a>
    <ul class="dropdown-menu" role="menu"
    aria-labelledby="dLabel" >
    <li><a tabindex="-1" href="#">Action</a></li>
    <li><a tabindex="-1" href="#">Another action</a></li>
    <li><a tabindex="-1" href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a tabindex="-1" href="#">Separated link</a></li>
    </ul>
    </div>
    </div>
    </div>
    </body>
    <script
    src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
</html>

定位思路：
具体思路是：先点击显示出1个下拉菜单，然后再定位到该下拉菜单所在的ul，再定位这个ul 下的某个具体的link。在这里，我们定位第1个下拉菜单中的Another action 这个选项.

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/level_locate.html")
driver.get(url)
driver.maximize_window()
#定位link1,点击
driver.find_element_by_link_text("Link1").click()
driver.implicitly_wait(10)
#定位Another action
action=driver.find_element_by_link_text("Another action")
#高亮显示Another action 把鼠标移动到Another action 上面
ActionChains(driver).move_to_element(action).perform()

time.sleep(3)
driver.quit()

四、下拉框处理

下拉框是我们最常见的一种页面元素，对于一般的元素，我们只需要一次就定位，但下拉框里的内容需要进行两次定位，先定位到下拉框对下拉框进行操作后，再定位到下拉框内里的选项。
用以下HTML示例说明：

<html>
<body>
<select id="ShippingMethod"
onchange="updateShipping(options[selectedIndex]);" name="ShippingMethod">
<option value="12.51">UPS Next Day Air ==> $12.51</option>
<option value="11.61">UPS Next Day Air Saver ==> $11.61</option>
<option value="10.69">UPS 3 Day Select ==> $10.69</option>
<option value="9.03">UPS 2nd Day Air ==> $9.03</option>
<option value="8.34">UPS Ground ==> $8.34</option>
<option value="9.25">USPS Priority Mail Insured ==> $9.25</option>
<option value="7.45">USPS Priority Mail ==> $7.45</option>
<option value="3.20" selected="">USPS First Class ==> $3.20</option>
</select>
</body>
</html>

现在我们来通过脚本选择下拉列表里的$10.69：

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/drop_down.html")
driver.get(url)
driver.maximize_window()
time.sleep(3)
#xpath定位
#driver.find_element_by_xpath("//*[@id='ShippingMethod']/option[3]").click()
#tag_name定位
options=driver.find_elements_by_tag_name("option")
# for option in options:
#     if option.get_attribute("value")=='10.69':
#         option.click()
options[2].click()     # 使用数组下标定位
time.sleep(3)
driver.quit()

五、alert、confirm、prompt 的处理

text 返回alert/confirm/prompt 中的文字信息
accept 点击确认按钮
dismiss 点击取消按钮，如果有的话
send_keys 输入值，如果alert 没有对话框就不能用了，不然会报错

注意：switch_to.alert()只能处理原生的alert

用以下HTML示例说明：

<html> 
<head> 
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>alert</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
<script type="text/javascript"> $(document).ready(function(){ $('#tooltip').tooltip({"placement": "right"}); $('#tooltip').click(function(){ alert('hello,Java12&&Java11!') }); }); </script>
</head> 
<body> 
<div class="row-fluid"> 
<div class="span6 well"> 
<h3>alert</h3> 
<a id="tooltip" href="#" data-toggle="tooltip" title="hello,Java12&&Java11 ！">hover to see tooltip</a> 
</div> 
</div> 
</body> 
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
</html>

自动化脚本：

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/alert.html")
driver.get(url)
driver.maximize_window()
time.sleep(3)
#定位元素，点击，使得弹出框出现
driver.find_element_by_id("tooltip").click()
time.sleep(2)
#定位弹出框，获得弹出框的操作句柄
alert=driver.switch_to.alert
time.sleep(3)
#关闭alert:点击确定按钮
alert.accept()
time.sleep(3)
driver.quit()

当alert中有对话框，而我们期望在alert的对话框中输入信息的时候要怎么处理呢？
用以下HTML示例说明：

<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function disp_prompt(){
var name=prompt("Please enter yourname","")
if (name!=null &&name!=""){
document.write("Hello " +name + "!")
}
}
</script>
</head>
<body>
<input type="button" onclick="disp_prompt()"
value="请点击"/>
</body>
</html>

自动化脚本：

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/send.html")
driver.get(url)
driver.maximize_window()
time.sleep(3)

#定位元素，点击，使得弹出框出现
driver.find_element_by_tag_name("input").click()
time.sleep(2)
#定获得弹出框的操作句柄
alert=driver.switch_to.alert
time.sleep(2)
alert.send_keys("美丽的女士！")
time.sleep(2)
#关闭信息展示弹窗
alert.accept()

time.sleep(3)
driver.quit()

六、DIV对话框的处理

如果页面元素比较多，利用元素的属性无法准确的定位这个元素的时候，我们可以先定位元素所在的div块，再去定位这个元素。
用以下HTML示例说明：

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>modal</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link
href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"
rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function(){
$('#click').click(function(){
$(this).parent().find('p').text('Click on the link to success!');
});
});
</script>
</head>
<body>
<h3>modal</h3>
<div class="row-fluid">
<div class="span6">
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn btn-primary"
data-toggle="modal" id="show_modal">Click</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1"
role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>Congratulations, you open the window!</p>
<a href="#" id="click">click me</a>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal"
aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</body>
<script
src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
</html>

自动化脚本如下：

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/modal.html")
driver.get(url)
driver.maximize_window()
time.sleep(3)

#定位元素，点击，使得弹出框出现
driver.find_element_by_link_text("Click").click()
time.sleep(2)
#点击div 框框里面的click me，让弹出框内容发生变化
div1=driver.find_element_by_class_name("modal-body")
div1.find_element_by_link_text("click me").click()
time.sleep(4)
#定位div 再定位具体的button
div2=driver.find_element_by_class_name("modal-footer")
bottons=driver.find_elements_by_tag_name("button")
bottons[0].click()

time.sleep(3)
driver.quit()

七、上传文件操作

上传过程一般要打开一个本地窗口，从窗口选择本地文件添加。所以，一般会卡在如何操作本地窗口添加上传文件。在selenium webdriver 中：只要定位上传按钮，通过send_keys 添加本地文件路径就可以了。绝对路径和相对路径都可以，关键是上传的文件存在。
用以下HTML示例说明：

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>upload_file</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link
href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstra
p-combined.min.css" rel="stylesheet" />
<script type="text/javascript">
</script>
</head>
<body>
<div class="row-fluid">
<div class="span6 well">
<h3>upload_file</h3>
<input type="file" name="file" />
</div>
</div>
</body>
<script
src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.
min.js"></script>
</html>

自动化测试脚本：

from selenium import webdriver
import time
import os
from selenium.webdriver.common.action_chains import ActionChains
driver=webdriver.Firefox()
url="file:///"+os.path.abspath("D:\\Study\\Bite\\测试课件水印版/selenium2html/upload.html")
driver.get(url)
driver.maximize_window()
time.sleep(3)

#上传文件
driver.find_element_by_name("file").send_keys("D:\\Study\Bite\\测试课件水印版\\淘宝app购物车测试用例.png")

time.sleep(3)
driver.quit()