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 相关文章推荐
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
Dec 11 Javascript
Javascript仿PHP $_GET获取URL中的参数
May 12 Javascript
javascript移动设备Web开发中对touch事件的封装实例
Jun 05 Javascript
JS实现点击按钮获取页面高度的方法
Nov 02 Javascript
基于iScroll实现下拉刷新和上滑加载效果
Jul 18 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
Javacript中自定义的map.js  的方法
Nov 26 Javascript
JS加密插件CryptoJS实现AES加密操作示例
Aug 16 Javascript
Vue使用mixin分发组件的可复用功能
Sep 01 Javascript
小程序实现左滑删除的效果的实例代码
Oct 19 Javascript
VUE+Element实现增删改查的示例源码
Nov 23 Vue.js
JavaScript实现商品评价五星好评
Nov 30 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获取网络上文件
2006/10/09 PHP
PHP 远程文件管理,可以给表格排序,遍历目录,时间排序
2009/08/07 PHP
PHP扩展编写点滴 技巧收集
2010/03/09 PHP
php线性表顺序存储实现代码(增删查改)
2012/02/16 PHP
php之Smarty模板使用方法示例详解
2014/07/08 PHP
PHP实现重载的常用方法实例详解
2017/10/18 PHP
PHP区块查询实现方法分析
2018/05/12 PHP
我的Node.js学习之路(二)NPM模块管理
2014/07/06 Javascript
AngularJS控制器继承自另一控制器
2016/05/09 Javascript
JS中对Cookie的操作详解
2016/08/05 Javascript
Bootstrap企业网站实战项目4
2016/10/14 Javascript
jQuery按需加载轮播图(web前端性能优化)
2017/02/17 Javascript
JS二叉树的简单实现方法示例
2017/04/05 Javascript
vue 数组和对象不能直接赋值情况和解决方法(推荐)
2017/10/25 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
详解如何在vue-cli中使用vuex
2018/08/07 Javascript
对angular4子路由&辅助路由详解
2018/10/09 Javascript
vue keep-alive 动态删除组件缓存的例子
2019/11/04 Javascript
基于vue3.0.1beta搭建仿京东的电商H5项目
2020/05/06 Javascript
[40:03]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第一场 8.21
2018/08/22 DOTA
Python调用C语言开发的共享库方法实例
2015/03/18 Python
Python遍历zip文件输出名称时出现乱码问题的解决方法
2015/04/08 Python
Python的Flask框架中web表单的教程
2015/04/20 Python
Python中input与raw_input 之间的比较
2017/08/20 Python
Python SqlAlchemy动态添加数据表字段实例解析
2018/02/07 Python
python中使用psutil查看内存占用的情况
2018/06/11 Python
PyTorch 解决Dataset和Dataloader遇到的问题
2020/01/08 Python
Python3加密解密库Crypto的RSA加解密和签名/验签实现方法实例
2020/02/11 Python
150行Python代码实现带界面的数独游戏
2020/04/04 Python
CSS3的column-fill属性对齐列内容高度的用法详解
2016/07/01 HTML / CSS
印度首选时尚目的地:Reliance Trends
2018/01/17 全球购物
高中生自我鉴定范文
2013/10/30 职场文书
结婚典礼证婚词
2014/01/11 职场文书
《鞋匠的儿子》教学反思
2014/03/02 职场文书
2015年村党支部工作总结
2015/04/30 职场文书
2015年教师个人业务工作总结
2015/10/23 职场文书