自动化测试(终章)webdriver的常用api(2)以及新的开始

2023-12-16 19:52

本文主要是介绍自动化测试(终章)webdriver的常用api(2)以及新的开始,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

目录

多层框架/窗口定位 

多层框架的定位

frame是什么?

多层窗口定位

层级定位

使用 XPath 进行层级定位:

使用 CSS 选择器进行层级定位:

下拉框处理

alert、confirm、prompt 的处理

Alert 弹窗:

 Confirm 弹窗:

Prompt 弹窗:

DIV对话框的处理

上传文件操作


前面两章我们讲了一些元素定位方法和一些webdriver的常用api,今天这节我们来讲webdriver的另外一些常用的api,包括多层框架/窗口定位、层级定位、下拉框处理、alert、confirm、prompt 的处理、DIV对话框的处理、以及上传文件操作。🤷‍♀️

selenium+python环境没有配置好的可以先看我上两篇配置环境噢。
selenium环境配置: 自动化测试(一)配置selenium环境(带图文,防止踩坑)-CSDN博客
python环境配置: 自动化测试(前奏)Python环境配置教程(带图文)-CSDN博客

多层框架/窗口定位 

对于一个web 应用,经常会出现框架(frame) 或窗口(window)的应用,这也就给我们的定位带来 了一定的困难。

定位一个frame :

driver.switch_to.frame(name_or_id_or_frame_element)

定位一个窗口window:

driver.switch_to.window(name_or_id_or_frame_element)

多层框架的定位

switch_to.frame(name_or_id_or_frame_element):通过frame的id或者name或者frame自带的其它 属性来定位框架,这里switch_to.frame()把当前定位的主体切换了frame里。

frame是什么?

<frame> 元素是 HTML 中用于定义框架(frameset)的一部分。它通常用于划分一个页面,将页面分割成多个区域,每个区域可以加载不同的文档。

在过去,网页设计中经常使用框架来创建具有不同功能的区域,例如一个包含导航菜单的框架、一个包含内容的框架等。然而,随着 HTML5 的发展,使用框架的做法已经逐渐减少,而被更灵活和语义化的元素所替代。

用以下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() 方法来进行定位:

#coding=utf-8
from selenium import webdriver
import time
import osfrom selenium.webdriver.common.by import Bybrowser = webdriver.Chrome()
file_path = 'file:///' + os.path.abspath('frame.html')
browser.get(file_path)
browser.implicitly_wait(30)
#先找到到ifrome1(id = f1)
browser.switch_to.frame("f1")
#再找到其下面的ifrome2(id =f2)
browser.switch_to.frame("f2")
#下面就可以正常的操作元素了
browser.find_element(By.ID,"kw").send_keys("selenium")
browser.find_element(By.ID,"su").click()
time.sleep(3)
browser.quit()

多层窗口定位

有可能嵌套的不是框架,而是窗口,还有真对窗口的方法:switch_to.window 用法与switch_to.frame 相同:

driver.switch_to.window("windowName")

示例:

from selenium import webdriver
from selenium.webdriver.common.by import By# 启动浏览器并打开网页
driver = webdriver.Chrome()
driver.get("http://example.com")# 打开新的窗口(可以是新标签页)
driver.execute_script("window.open('', '_blank');")# 获取所有窗口句柄
all_handles = driver.window_handles# 切换到新窗口
new_window_handle = [handle for handle in all_handles if handle != driver.current_window_handle][0]
driver.switch_to.window(new_window_handle)# 在新窗口中执行操作
# 例如,可以在这里进行新窗口的元素定位和操作
driver.find_element(By.ID,"element_id").click()# 切回原始窗口
driver.switch_to.window(all_handles[0])# 关闭浏览器
driver.quit()

层级定位

层级定位是指在页面中嵌套的元素结构中定位到目标元素。这在网页中常见,特别是当你要定位的元素是另一个元素的子元素时。在 Selenium 中,你可以使用 XPath 或 CSS 选择器来执行层级定位。

使用 XPath 进行层级定位:

from selenium import webdriver
from selenium.webdriver.common.by import By# 启动浏览器
browser = webdriver.Chrome()# 打开网页
browser.get("https://www.example.com")# 使用 XPath 定位嵌套的元素
nested_element = browser.find_element(By.XPATH,"//div[@id='parent']/input[@name='child']")# 在找到的元素上执行操作
nested_element.send_keys("Hello, Selenium!")# 关闭浏览器
browser.quit()

在这个例子中,XPath表达式 //div[@id='parent']/input[@name='child'] 表示找到ID为 'parent' 的 <div> 元素下的名为 'child' 的 <input> 元素。

使用 CSS 选择器进行层级定位:

from selenium import webdriver
from selenium.webdriver.common.by import By# 启动浏览器
browser = webdriver.Chrome()# 打开网页
browser.get("https://www.example.com")# 使用 CSS 选择器定位嵌套的元素
nested_element = browser.find_element(By.CSS_SELECTOR,"div#parent input[name='child']")# 在找到的元素上执行操作
nested_element.send_keys("Hello, Selenium!")# 关闭浏览器
browser.quit()

在这个例子中,CSS 选择器 div#parent input[name='child'] 表示找到ID为 'parent' 的 <div> 元素下的名为 'child' 的 <input> 元素。

注意:在使用层级定位时,请确保选择器或 XPath 表达式足够具体,以确保准确定位到目标元素,避免选择到其他不符合预期的元素。

下拉框处理

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

q:假设有一个选项框,选择地点,里面有北京,上海,广州,深圳,刚开始北上广深都没显示,只显示一个下拉框你得点击那个下拉框才显示北上广深,这该如何定位呢?

选项框:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Location Selector</title>
</head>
<body><label for="location">选择地点:</label><select id="location" name="location"><option value="beijing">北京</option><option value="shanghai">上海</option><option value="guangzhou">广州</option><option value="shenzhen">深圳</option></select></body>
</html>

a:对于这样的下拉框,我们可以使用 Selenium 来模拟点击下拉框并选择其中的选项。

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC# 启动浏览器
driver = webdriver.Chrome()# 打开网页
driver.get("path/to/your/html/file")# 等待下拉框可见
dropdown = WebDriverWait(driver, 10).until(EC.visibility_of_element_located((By.ID, "location"))
)# 点击下拉框
dropdown.click()# 选择其中的选项,比如选择 "上海"
shanghai_option = WebDriverWait(driver, 10).until(EC.visibility_of_element_located((By.XPATH, "//option[text()='上海']"))
)
shanghai_option.click()# 关闭浏览器
driver.quit()

我们在上面的例子中使用了 WebDriverWait 来等待元素可见,然后分别点击下拉框和选择 "上海" 这个选项。

alert、confirm、prompt 的处理

在 Selenium 中,对于网页上的 alertconfirmprompt 弹窗,可以使用 Alert 类来进行处理。这些弹窗通常是由 JavaScript 代码触发的,而 Selenium 提供了专门的方法来处理这些弹窗。

弹窗就是类似于这个:

1. text 返回alert/confirm/prompt 中的文字信息

2. accept 点击确认按钮

3. dismiss 点击取消按钮,如果有的话

3. send_keys 输入值,如果alert 没有对话框就不能用了,不然会报错

Alert 弹窗:

Alert 弹窗是简单的信息提示框,通常只包含一个确定按钮。

使用 switch_to.alert 进入弹窗,然后使用 accept() 方法点击确定按钮

from selenium import webdriverdriver = webdriver.Chrome()
driver.get("https://example.com")alert = driver.switch_to.alert
alert.accept()driver.quit()

 Confirm 弹窗:

Confirm 弹窗与 Alert 类似,但包含确定和取消两个按钮。

使用 switch_to.alert 进入弹窗,然后可以使用 accept() 方法点击确定按钮,或使用 dismiss() 方法点击取消按钮。

from selenium import webdriverdriver = webdriver.Chrome()
driver.get("https://example.com")confirm = driver.switch_to.alert
confirm.accept()  # 或 confirm.dismiss() driver.quit()

Prompt 弹窗:

Prompt 弹窗包含一个文本输入框,可以输入文本,并有确定和取消两个按钮。

使用 switch_to.alert 进入弹窗,可以使用 send_keys() 方法输入文本,然后使用 accept() 方法点击确定按钮,或使用 dismiss() 方法点击取消按钮。

from selenium import webdriverdriver = webdriver.Chrome()
driver.get("https://example.com")prompt = driver.switch_to.alert
prompt.send_keys("Hello, Selenium!")
prompt.accept()  # 或 prompt.dismiss()driver.quit()

DIV对话框的处理

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

用以下HTML示例说明:演示如何通过先定位父级元素再定位子元素的方式。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Parent Element Example</title><style>/* 包含多个元素的父级容器 */.parent-container {border: 1px solid #ddd;padding: 10px;}/* 子元素 */.target-element {background-color: #aaf;padding: 5px;margin: 5px;}</style>
</head>
<body><!-- 包含多个元素的父级容器 --><div class="parent-container"><p class="target-element">第一个元素</p><p class="target-element">第二个元素</p><p class="target-element">第三个元素</p></div></body>
</html>

Python 代码:

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as ECdriver = webdriver.Chrome()
driver.get("path/to/your/html/file")# 定位包含多个元素的父级容器
parent_container = WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.CLASS_NAME, "parent-container"))
)# 在父级容器中定位子元素(这里选择第二个元素)
target_element = parent_container.find_element(By.XPATH, "(//p[@class='target-element'])[2]")# 执行操作,比如获取文本内容
element_text = target_element.text
print("Text of the second element:", element_text)driver.quit()

上传文件操作

文件上传操作也比较常见功能之一,上传功能没有用到新有方法或函数,关键是思路。

上传过程一般要打开一个本地窗口,从窗口选择本地文件添加。所以,一般会卡在如何操作本地窗口添加上传文件。 其实,在selenium webdriver 没我们想的那么复杂;只要定位上传按钮,通过send_keys 添加本地文 件路径就可以了。绝对路径和相对路径都可以,关键是上传的文件存在。

HTML 代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>File Upload Example</title>
</head>
<body><form action="/upload" method="post" enctype="multipart/form-data"><label for="fileInput">选择文件:</label><input type="file" id="fileInput" name="file"><input type="submit" value="上传"></form></body>
</html>

Python 代码:

from selenium import webdriverdriver = webdriver.Chrome()
driver.get("path/to/your/html/file")# 定位上传文件的 input 元素
file_input = driver.find_element(By.ID,"fileInput")# 指定要上传的文件路径
file_path = "/path/to/your/file.txt"# 使用 send_keys() 方法上传文件
file_input.send_keys(file_path)# 等待一定时间,以确保文件上传完成
driver.implicitly_wait(5)# 提交表单或执行其他操作(这里以点击提交按钮为例)
submit_button = driver.find_element(By.CSS_SELECTOR,"input[type='submit']")
submit_button.click()# 关闭浏览器
driver.quit()

在这个例子中,使用find_element(By.ID,"fileInput")方法定位到上传文件的 input 元素,然后使用 send_keys() 方法指定要上传的文件路径。接着,等待一定时间以确保文件上传完成,最后通过点击提交按钮或执行其他相关操作。

好了,常见的webdriver的api已经告诉大家了,后期我会给大家带来python中的自动化测试之unittest框架,这也是新的开始,溯洄从之,道阻且长!

本节就到这里啦,你们的支持就是我前进的动力,希望大家多多支持噢🤦‍♀️🤦‍♂️🤷‍♀️🤷‍♂️🎈

这篇关于自动化测试(终章)webdriver的常用api(2)以及新的开始的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/501690

相关文章

Nginx设置连接超时并进行测试的方法步骤

《Nginx设置连接超时并进行测试的方法步骤》在高并发场景下,如果客户端与服务器的连接长时间未响应,会占用大量的系统资源,影响其他正常请求的处理效率,为了解决这个问题,可以通过设置Nginx的连接... 目录设置连接超时目的操作步骤测试连接超时测试方法:总结:设置连接超时目的设置客户端与服务器之间的连接

C#中读取XML文件的四种常用方法

《C#中读取XML文件的四种常用方法》Xml是Internet环境中跨平台的,依赖于内容的技术,是当前处理结构化文档信息的有力工具,下面我们就来看看C#中读取XML文件的方法都有哪些吧... 目录XML简介格式C#读取XML文件方法使用XmlDocument使用XmlTextReader/XmlTextWr

Java调用DeepSeek API的最佳实践及详细代码示例

《Java调用DeepSeekAPI的最佳实践及详细代码示例》:本文主要介绍如何使用Java调用DeepSeekAPI,包括获取API密钥、添加HTTP客户端依赖、创建HTTP请求、处理响应、... 目录1. 获取API密钥2. 添加HTTP客户端依赖3. 创建HTTP请求4. 处理响应5. 错误处理6.

Deepseek R1模型本地化部署+API接口调用详细教程(释放AI生产力)

《DeepseekR1模型本地化部署+API接口调用详细教程(释放AI生产力)》本文介绍了本地部署DeepSeekR1模型和通过API调用将其集成到VSCode中的过程,作者详细步骤展示了如何下载和... 目录前言一、deepseek R1模型与chatGPT o1系列模型对比二、本地部署步骤1.安装oll

浅析如何使用Swagger生成带权限控制的API文档

《浅析如何使用Swagger生成带权限控制的API文档》当涉及到权限控制时,如何生成既安全又详细的API文档就成了一个关键问题,所以这篇文章小编就来和大家好好聊聊如何用Swagger来生成带有... 目录准备工作配置 Swagger权限控制给 API 加上权限注解查看文档注意事项在咱们的开发工作里,API

CSS弹性布局常用设置方式

《CSS弹性布局常用设置方式》文章总结了CSS布局与样式的常用属性和技巧,包括视口单位、弹性盒子布局、浮动元素、背景和边框样式、文本和阴影效果、溢出隐藏、定位以及背景渐变等,通过这些技巧,可以实现复杂... 一、单位元素vm 1vm 为视口的1%vh 视口高的1%vmin 参照长边vmax 参照长边re

一分钟带你上手Python调用DeepSeek的API

《一分钟带你上手Python调用DeepSeek的API》最近DeepSeek非常火,作为一枚对前言技术非常关注的程序员来说,自然都想对接DeepSeek的API来体验一把,下面小编就来为大家介绍一下... 目录前言免费体验API-Key申请首次调用API基本概念最小单元推理模型智能体自定义界面总结前言最

JAVA调用Deepseek的api完成基本对话简单代码示例

《JAVA调用Deepseek的api完成基本对话简单代码示例》:本文主要介绍JAVA调用Deepseek的api完成基本对话的相关资料,文中详细讲解了如何获取DeepSeekAPI密钥、添加H... 获取API密钥首先,从DeepSeek平台获取API密钥,用于身份验证。添加HTTP客户端依赖使用Jav

10个Python自动化办公的脚本分享

《10个Python自动化办公的脚本分享》在日常办公中,我们常常会被繁琐、重复的任务占据大量时间,本文为大家分享了10个实用的Python自动化办公案例及源码,希望对大家有所帮助... 目录1. 批量处理 Excel 文件2. 自动发送邮件3. 批量重命名文件4. 数据清洗5. 生成 PPT6. 自动化测试

Python中操作Redis的常用方法小结

《Python中操作Redis的常用方法小结》这篇文章主要为大家详细介绍了Python中操作Redis的常用方法,文中的示例代码简洁易懂,具有一定的借鉴价值,有需要的小伙伴可以了解一下... 目录安装Redis开启、关闭Redisredis数据结构redis-cli操作安装redis-py数据库连接和释放增