Selenium执行JavaScript脚本的方法示例


Posted in Javascript onDecember 31, 2020

JavaScript是运行在客户端(浏览器)和服务器端的脚本语言,允许将静态网页转换为交互式网页。可以通过 Python Selenium WebDriver 执行 JavaScript 语句,在Web页面中进行js交互。那么js能做的事,Selenium应该大部分也能做。WebDriver是模拟终端用户的交互,所以就不能点击不可见的元素,有时可见元素也不能点击。在这些情况下,我们就可以通过WebDriver 执行JavaScript来点击或者执行页面元素。本文将介绍如何使用 WebDriver执行 JavaScript语句。

Web元素定位及操作

使用execute_script() 执行 JavaScript 代码,有两种方法实现元素操作

方法1:文档级别操作

直接使用JavaScript实现元素定位和动作执行,主要方法有:

document.getElementById
document.getElementsByClassName
document.getElementsByName
document.getElementsByTagName
document.getElementsByTagNameNS

测试示例:

  • 打开百度一下
  • 输入框输入”test“
  • 点击百度一下

python代码:

def test_baidu(self):
  self.driver.get("http://www.baidu.com")
  self.driver.execute_script('document.getElementById("kw").value = "test"')
  time.sleep(2)
  self.driver.execute_script('document.getElementById("su").click()')
  time.sleep(2)

在执行过程中,WebDriver 将 JavaScript 语句注入到浏览器中,然后脚本将执行。这个注入 JavaScript 有自己的名称空间,不会干扰实际网页中的 JavaScript运行。

方法2:元素级别操作

可以先使用WebDriver获取想要操作的元素,然后使用JavaScript执行操作。

input_ele = driver.find_element_by_id("su") 
driver.execute_script("arguments[0].click();", input_ele)

python代码:

def test_baidu2(self):
  self.driver.get("http://www.baidu.com")
  input_ele = self.driver.find_element_by_id("kw")
  self.driver.execute_script("arguments[0].value = 'test';", input_ele)
  time.sleep(2)
  baidu_ele = self.driver.find_element_by_id("su")
  self.driver.execute_script("arguments[0].click();", baidu_ele)
  time.sleep(2)

可以在语句中使用多个 JavaScript动作:

username = driver.find_element_by_xpath("//*[@id='username']")
password = driver.find_element_by_xpath("//*[@id='password']")
driver.execute_script("arguments[0].value = 'admin';arguments[1].value = 'admin';", username, password)

获取返回值

可以返回JavaScript的执行结果:

driver.execute_script("return document.getElementById('kw').value")
driver.execute_script("return document.title;") # 返回网页标题

滑动

在 Web自动化测试 | ActionChains、TouchAction 中介绍了TouchAction类中scroll_from_element()也可以滑动页面。

滑动到浏览器底部

document.documentElement.scrollTop=10000
window.scrollTo(0, document.body.scrollHeight)

滑动到浏览器顶部

document.documentElement.scrollTop=0
window.scrollTo(document.body.scrollHeight,0)

更改元素属性

大部分时间控件都是 readonly属性,需要手动去选择对应的时间。自动化测试中,可以使用JavaScript代码取消readonly属性。

测试页面: https://www.12306.cn/index/

Selenium执行JavaScript脚本的方法示例

测试步骤:

  • 打开测试页面
  • 修改出发日期
  • 断言日期是否修改成功

python测试代码:

def test_datettime(self):
  self.driver.get("https://www.12306.cn/index/")
  # 取消readonly属性
  self.driver.execute_script("dat=document.getElementById('train_date'); dat.removeAttribute('readonly')")  
  self.driver.execute_script("document.getElementById('train_date').value='2020-10-01'")
  time.sleep(3)
  now_time = self.driver.execute_script("return document.getElementById('train_date').value")
  assert '2020-10-01' == now_time

总结

Selenium WebDriver 执行 JavaScript代码是一个非常强大的功能,可以实现WebElement 接口所有功能,甚至更多的功能。比如在web性能测试中可以调用Web API接口window.performance来测试Web性能。

到此这篇关于Selenium执行JavaScript脚本的方法示例的文章就介绍到这了,更多相关Selenium执行JavaScript脚本内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Javascript 复制数组实现代码
Nov 26 Javascript
使用JQUERY Tabs插件宿主IFRAMES
Jan 01 Javascript
javascript 四则运算精度修正函数代码
May 31 Javascript
JavaScript实现动态添加,删除行的方法实例详解
Jul 02 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
Aug 05 Javascript
jQuery手指滑动轮播效果
Dec 22 Javascript
Angular将填入表单的数据渲染到表格的方法
Sep 22 Javascript
vue移动端UI框架实现QQ侧边菜单组件
Mar 09 Javascript
vue axios请求超时的正确处理方法
Apr 02 Javascript
使用JavaScript生成罗马字符的实例代码
Jun 08 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
Jul 13 Javascript
cypress测试本地web应用
Jun 01 Javascript
javascript实现随机抽奖功能
Dec 30 #Javascript
JS+JQuery实现无缝连接轮播图
Dec 30 #jQuery
微信小程序弹窗禁止页面滚动的实现代码
Dec 30 #Javascript
vue-cli4.0多环境配置变量与模式详解
Dec 30 #Vue.js
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
Dec 30 #Vue.js
SpringBoot+Vue 前后端合并部署的配置方法
Dec 30 #Vue.js
js+html+css实现手动轮播和自动轮播
Dec 30 #Javascript
You might like
Php Image Resize图片大小调整的函数代码
2011/01/17 PHP
PHP学习笔记 (1) 环境配置与代码调试
2011/06/19 PHP
php设计模式 Proxy (代理模式)
2011/06/26 PHP
PHP动态分页函数,PHP开发分页必备啦
2011/11/07 PHP
PHP中使用mktime获取时间戳的一个黑色幽默分析
2012/05/31 PHP
php将HTML表格每行每列转为数组实现采集表格数据的方法
2015/04/03 PHP
用jquery实现等比例缩放图片效果插件
2010/07/24 Javascript
formvalidator验证插件中有关ajax验证问题
2013/01/04 Javascript
js和jquery中循环的退出和继续学习记录
2014/09/06 Javascript
javascript中几个容易混淆的概念总结
2015/04/14 Javascript
JavaScript中的数据类型转换方法小结
2015/10/26 Javascript
原生js封装二级城市下拉列表的实现代码
2016/06/16 Javascript
jQuery基本选择器和层次选择器学习使用
2017/02/27 Javascript
Vue.js上下滚动加载组件的实例代码
2017/07/17 Javascript
详解vue-cli 快速搭建单页应用之遇到的问题及解决办法
2018/03/01 Javascript
react native 文字轮播的实现示例
2018/07/27 Javascript
小程序点击图片实现png转jpg
2019/10/22 Javascript
vue-socket.io跨域问题有效解决方法
2020/02/11 Javascript
如何在node环境实现“get数据解析”代码实例
2020/07/03 Javascript
python如何在终端里面显示一张图片
2016/08/17 Python
python实现日常记账本小程序
2018/03/10 Python
python实现趣味图片字符化
2019/04/30 Python
Python sys模块常用方法解析
2020/02/20 Python
Python创建临时文件和文件夹
2020/08/05 Python
html5使用Canvas绘图的使用方法
2017/11/21 HTML / CSS
2014国培学习感言
2014/03/05 职场文书
商务日语专业毕业生自荐信
2014/03/27 职场文书
环境卫生倡议书
2014/08/29 职场文书
办公室班子四风问题对照检查材料
2014/10/04 职场文书
党员批评与自我批评总结
2014/10/15 职场文书
夫妻忠诚协议书范本
2014/11/17 职场文书
辞职信如何写
2015/02/27 职场文书
节约用电通知
2015/04/25 职场文书
2016企业先进集体事迹材料
2016/02/25 职场文书
golang中字符串MD5生成方式总结
2021/07/04 Golang
MySQL RC事务隔离的实现
2022/03/31 MySQL