曲鸟全栈UI自动化教学(五):Selenium的键盘鼠标事件详解

简介: 曲鸟全栈UI自动化教学(五):Selenium的键盘鼠标事件详解

一、前言


在之前的教学中对于页面的操作只涉及到了两个:点击、输入;其实Selenium的键盘鼠标操作还有很多,现在就为你一一讲解。


二、键盘事件


1. 输入指定内容【send_keys】

1.1 我们可以使用send_keys来输入我们想要输入的内容

例如打开百度,搜索框输入:曲鸟 csdn

import time
from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()  # 启动chrome浏览器
driver.get('https://www.baidu.com/')  # 打开百度网址
# 在输入框输入:曲鸟 csdn
driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys('曲鸟 csdn')

1.2 也可以指定按键输入

例如我们打开百度输入:csdn 曲鸟,并粘贴复制它三次


import time
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
driver = webdriver.Chrome()  # 启动chrome浏览器
driver.get('https://www.baidu.com/')  # 打开百度网址
# 在输入框输入:曲鸟 csdn
driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys('曲鸟 csdn')
# 按下crtl+A 全选
driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys(Keys.CONTROL, 'a')
# 按下crtl+C 复制
driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys(Keys.CONTROL, 'c')
# 按下crtl+V 粘贴
for i in range(3):
    time.sleep(0.5)
    driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys(Keys.CONTROL, 'v')


执行效果


38ee5f9c96304314939972d4ee8ee808.gif


1.3 组合按键规则


send_keys支持按键的组合传递,例如上述的粘贴【Ctrl+V】操作,代码实现为:


driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys(Keys.CONTROL, 'v')


另外,通过+号做连接组合按键也是可行的


driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys(Keys.CONTROL+'c')


如果想同时按下三个或更多按键键,则在括号中使用,+号追加参数即可,例如在输入框同时输入abc:


driver.find_element(By.XPATH, '//*[@id="kw"]').send_keys('a', 'b','c')


另外,我们可以通过【Ctrl+鼠标左键】代码中的Keys,查看支持哪些按键及调用代码


09552d7e6d564067b70e8c42c304132b.png

2. 模拟按下/弹起【key_down/key_up】


Webdriver还提供了模拟键盘按下/弹起的操作,例如上述的复制操作可以改写为下面的代码

driver.find_element(By.XPATH, '//*[@id="kw"]')
webdriver.ActionChains(driver).key_down(Keys.CONTROL).send_keys("v").key_up(Keys.CONTROL).perform()


实际该方法不常用,使用第一种方法实现来说更简单。


3. 清空输入【clear】


clear方法可以清楚输入框中的内容,例如下面的代码,会先打开百度,搜索框输入:曲鸟 csdn,然后调用clear方法进行清空

from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
# 在输入框输入:曲鸟 csdn
driver = driver.find_element(By.XPATH, '//*[@id="kw"]')
driver.send_keys('曲鸟 csdn')
driver.clear()

三、鼠标事件


1. 点击【click】


通过click方法能够对页面中可点击元素进行点击操作,例如下面的代码会对百度的【百度一下】按钮进行点击

from selenium import webdriver
from selenium.webdriver.common.by import By
driver= webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
# 点击百度一下
driver.find_element(By.XPATH,'//*[@id="su"]').click()


2. 单击并按住【click_and_hold】


下面的代码会将button这个元素单击并按住

from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
button = driver.find_element(By.XPATH, '//*[@id="s-top-left"]/a[1]')
webdriver.ActionChains(driver).click_and_hold(button).perform()


3. 右键单击【context_click】


下面的代码会将button这个元素单击并按住


from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
button = driver.find_element(By.XPATH, '//*[@id="s-top-left"]/a[1]').click()
webdriver.ActionChains(driver).context_click(button).perform()


4. 移动到元素(悬浮)【move_to_element】


下面的代码会将鼠标移动到button这个元素上


from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
button = driver.find_element(By.XPATH, '//*[@id="s-top-left"]/a[1]')
webdriver.ActionChains(driver).move_to_element(button).perform()


5. 偏移移动【move_by_offset

此方法将鼠标从其当前位置(或 0,0)移动给定的偏移量。如果坐标在视图窗口之外,那么鼠标将在浏览器窗口之外结束。

下面的代码会将以button这个元素为起点,将鼠标移动长为100,高为100的距离

from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get('https://www.baidu.com/')  # 打开百度网址
button = driver.find_element(By.XPATH, '//*[@id="s-top-left"]/a[1]')
xOffset = 100
yOffset = 100
webdriver.ActionChains(driver).move_by_offset(xOffset, yOffset).perform()

6. 拖拽【drag_and_drop】


此方法首先在源元素上执行单击并按住,移动到目标元素的位置,然后释放鼠标。

下面的代码会单击按住sourceEle元素,然后拖拽到targetEle上,然后释放鼠标


from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get("https://crossbrowsertesting.github.io/drag-and-drop")
sourceEle = driver.find_element(By.ID, "draggable")
targetEle = driver.find_element(By.ID, "droppable")
webdriver.ActionChains(driver).drag_and_drop(sourceEle,targetEle).perform()


7. 偏移拖拽【drag_and_drop_by_offset】


此方法首先在源元素上执行单击并按住,移动到给定的偏移量,然后释放鼠标。

下面的代码会单击按住sourceEle元素,将鼠标移动长为100,高为100的距离,然后释放鼠标

from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get("https://crossbrowsertesting.github.io/drag-and-drop")
sourceEle = driver.find_element(By.ID, "draggable")
XOffset = 100
YOffset = 100
webdriver.ActionChains(driver).drag_and_drop_by_offset(sourceEle, XOffset, YOffset).perform()

8. 释放鼠标【release】


此动作释放按下的鼠标左键。如果传递了 WebElement,它将在给定的 WebElement 上释放按下的鼠标左键


from selenium import webdriver
from selenium.webdriver.common.by import By
driver = webdriver.Chrome()
driver.get("https://crossbrowsertesting.github.io/drag-and-drop")
sourceEle = driver.find_element(By.ID, "draggable")
targetEle  = driver.find_element(By.ID, "droppable")
webdriver.ActionChains(driver).click_and_hold(sourceEle).move_to_element(targetEle).perform()
webdriver.ActionChains(driver).release().perform()


目录
相关文章
|
1月前
「Mac畅玩鸿蒙与硬件42」UI互动应用篇19 - 数字键盘应用
本篇将带你实现一个数字键盘应用,支持用户通过点击数字键输入数字并实时更新显示内容。我们将展示如何使用按钮组件和状态管理来实现一个简洁且实用的数字键盘。
88 17
「Mac畅玩鸿蒙与硬件42」UI互动应用篇19 - 数字键盘应用
|
2月前
|
Java 测试技术 持续交付
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
本文重点讲解如何搭建App自动化测试框架的思路,而非完整源码。主要内容包括实现目的、框架设计、环境依赖和框架的主要组成部分。适用于初学者,旨在帮助其快速掌握App自动化测试的基本技能。文中详细介绍了从需求分析到技术栈选择,再到具体模块的封装与实现,包括登录、截图、日志、测试报告和邮件服务等。同时提供了运行效果的展示,便于理解和实践。
147 4
【入门思路】基于Python+Unittest+Appium+Excel+BeautifulReport的App/移动端UI自动化测试框架搭建思路
|
5月前
|
前端开发 测试技术 UED
【测试效率对比】深入分析:为何UI自动化测试的投资回报率通常低于接口自动化测试?
这篇文章深入分析了UI自动化测试与接口自动化测试的投资回报率(ROI)问题,指出UI自动化测试在某些情况下的ROI并不低,反驳了没有实施过UI自动化就轻易下结论的观点,并强调了实践的重要性和自动化测试在项目迭代中的作用。
113 1
|
8月前
|
XML 前端开发 JavaScript
前端CSS样式零基础教学总结,UI、前端开发都适用
前端CSS样式零基础教学总结,UI、前端开发都适用
107 2
|
8月前
|
前端开发 测试技术 持续交付
【Flutter 前端技术开发专栏】Flutter 中的 UI 测试与自动化测试
【4月更文挑战第30天】本文探讨了 Flutter 应用中UI测试和自动化测试的重要性,包括保障质量、提高效率和增强开发信心。Flutter提供`flutter_test`库进行Widget测试,以及`flutter_driver`进行集成测试。UI测试涵盖界面布局、交互和状态变化的验证,最佳实践建议尽早引入测试、保持用例简洁,并结合手动测试。未来,随着Flutter技术发展,UI测试和自动化测试将更加完善,助力开发高质量应用。
258 0
【Flutter 前端技术开发专栏】Flutter 中的 UI 测试与自动化测试
|
8月前
|
Web App开发 前端开发 Java
Selenium UI 自动化
Selenium UI 自动化
|
8月前
|
测试技术 持续交付 API
Python的UI自动化测试
【4月更文挑战第17天】Python UI自动化测试涉及Selenium(Web)、Appium(移动应用)和PyQt(桌面应用)等框架。基本步骤包括确定测试目标、选择合适框架、安装配置、编写测试脚本、运行调试以及集成到CI/CD流程。注意自动化测试不能完全取代人工测试,应根据需求平衡使用。
118 1
|
8月前
|
Linux API Android开发
Airtest UI自动化框架 v1.1.4
Airtest UI自动化框架 v1.1.4
91 3
|
3月前
|
Web App开发 前端开发 JavaScript
探索Python科学计算的边界:利用Selenium进行Web应用性能测试与优化
【10月更文挑战第6天】随着互联网技术的发展,Web应用程序已经成为人们日常生活和工作中不可或缺的一部分。这些应用不仅需要提供丰富的功能,还必须具备良好的性能表现以保证用户体验。性能测试是确保Web应用能够快速响应用户请求并处理大量并发访问的关键步骤之一。本文将探讨如何使用Python结合Selenium来进行Web应用的性能测试,并通过实际代码示例展示如何识别瓶颈及优化应用。
191 5
|
1月前
|
Web App开发 IDE JavaScript
Selenium IDE:Web自动化测试的得力助手
Selenium IDE:Web自动化测试的利器。作为开源工具,Selenium IDE支持录制与回放用户操作,适用于Chrome、Firefox等多浏览器,简化了测试流程,提升了效率,降低了自动化测试的门槛。它还支持导出多种编程语言的脚本,便于测试集成与复用。
113 31
Selenium IDE:Web自动化测试的得力助手

热门文章

最新文章