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 相关文章推荐
js类式继承的具体实现方法
Dec 31 Javascript
jquery下div 的resize事件示例代码
Mar 09 Javascript
JS实现随机乱撞彩色圆球特效的方法
May 05 Javascript
js实现分割上传大文件
Mar 09 Javascript
探索Javascript中this的奥秘
Dec 11 Javascript
js多个物体运动功能实例分析
Dec 20 Javascript
微信小程序 合法域名校验出错详解及解决办法
Mar 09 Javascript
简单介绍react redux的中间件的使用
Apr 06 Javascript
Vue-component全局注册实例
Sep 06 Javascript
微信小程序实现录音时的麦克风动画效果实例
May 18 Javascript
前端性能优化建议
Sep 17 Javascript
vue实现一个获取按键展示快捷键效果的Input组件
Jan 13 Vue.js
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
基于wordpress主题制作的具体实现步骤
2013/05/10 PHP
Json_encode防止汉字转义成unicode的方法
2016/02/25 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
window.onload 加载完毕的问题及解决方案(上)
2009/07/09 Javascript
js对象的比较
2011/02/26 Javascript
你的 mixin 真的兼容 ECMAScript 5 吗?
2013/04/11 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
javascript中声明函数的方法及调用函数的返回值
2014/07/22 Javascript
2则自己编写的jQuery特效分享
2015/02/26 Javascript
js拖拽功能实现代码解析
2016/11/28 Javascript
详解自动生成博客目录案例
2016/12/09 Javascript
JS声明式函数与赋值式函数实例分析
2016/12/13 Javascript
常用jQuery选择器汇总
2017/02/02 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
Angular2学习笔记之数据绑定的示例代码
2018/01/03 Javascript
vue keep-alive请求数据的方法示例
2018/05/16 Javascript
Python 列表理解及使用方法
2017/10/27 Python
python实现神经网络感知器算法
2017/12/20 Python
怎么使用pipenv管理你的python项目
2018/03/12 Python
python logging设置level失败的解决方法
2020/02/19 Python
pytorch 实现在一个优化器中设置多个网络参数的例子
2020/02/20 Python
详解pandas绘制矩阵散点图(scatter_matrix)的方法
2020/04/23 Python
Python如何合并多个字典或映射
2020/07/24 Python
如何基于Python按行合并两个txt
2020/11/03 Python
基于HTML5 的人脸识别活体认证的实现方法
2016/06/22 HTML / CSS
西班牙自行车和跑步商店:Alltricks
2018/07/07 全球购物
MAC Cosmetics巴西官方网站:M·A·C彩妆
2019/04/18 全球购物
Groupon荷兰官方网站:高达70%的折扣
2019/11/01 全球购物
Java中有几种类型的流?JDK为每种类型的流提供了一些抽象类以供继承,请说出他们分别是哪些类?
2012/05/30 面试题
市场部专员岗位职责
2013/11/30 职场文书
集中采购方案
2014/06/10 职场文书
党员先进性教育整改措施
2014/09/18 职场文书
幼儿园新学期开学寄语
2015/05/27 职场文书
南阳市白酒市场的调查报告
2019/11/08 职场文书
浅谈如何保证Mysql主从一致
2022/03/13 MySQL
Java数组详细介绍及相关工具类
2022/04/14 Java/Android