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 字符串转化成数字的代码
Jun 29 Javascript
js渐变显示渐变消失示例代码
Aug 01 Javascript
前台js调用后台方法示例
Dec 02 Javascript
Angularjs2不同组件间的通信实例代码
May 06 Javascript
JavaScript使用readAsDataURL读取图像文件
May 10 Javascript
package.json文件配置详解
Jun 15 Javascript
Vue实例中生命周期created和mounted的区别详解
Aug 25 Javascript
详解最新vue-cli 2.9.1的webpack存在问题
Dec 16 Javascript
详解webpack中的hash、chunkhash、contenthash区别
Jan 05 Javascript
vue自定义一个v-model的实现代码
Jun 21 Javascript
vue中Axios的封装与API接口的管理详解
Aug 09 Javascript
VUE table表格动态添加一列数据,新增的这些数据不可以编辑(v-model绑定的数据不能实时更新)
Apr 03 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
雄兵连:天使彦天使彦为爱折翼,彦和炙心同时念动的誓言!
2020/03/02 国漫
用PHP和ACCESS写聊天室(二)
2006/10/09 PHP
smarty 原来也不过如此~~呵呵
2006/11/25 PHP
php将字符串转化成date存入数据库的两种方式
2014/04/28 PHP
PHP小技巧之JS和CSS优化工具Minify的使用方法
2014/05/19 PHP
ThinkPHP实例化模型的四种方法概述
2014/08/22 PHP
使用php-timeit估计php函数的执行时间
2015/09/06 PHP
Yii支持多域名cors原理的实现
2018/12/05 PHP
对YUI扩展的Gird组件 Part-1
2007/03/10 Javascript
javascript获取url上某个参数的方法
2013/11/08 Javascript
jquery map方法使用示例
2014/04/23 Javascript
如何使用HTML5地理位置定位功能
2015/04/27 Javascript
使用JavaScript实现连续滚动字幕效果的方法
2015/07/07 Javascript
浅析JavaScript中break、continue和return的区别
2016/11/30 Javascript
微信小程序 video详解及简单实例
2017/01/16 Javascript
JS表单验证方法实例小结【电话、身份证号、Email、中文、特殊字符、身份证号等】
2017/02/14 Javascript
Angular2中如何使用ngx-translate进行国际化
2017/05/21 Javascript
React学习笔记之列表渲染示例详解
2017/08/22 Javascript
浅谈Vue.js路由管理器 Vue Router
2018/08/16 Javascript
jquery实现手风琴案例
2020/05/04 jQuery
ant design vue嵌套表格及表格内部编辑的用法说明
2020/10/28 Javascript
python脚本设置超时机制系统时间的方法
2016/02/21 Python
Python之os操作方法(详解)
2017/06/15 Python
详解Python下Flask-ApScheduler快速指南
2018/11/04 Python
python内置数据类型之列表操作
2018/11/12 Python
Django如何使用asyncio协程和ThreadPoolExecutor多线程
2020/10/12 Python
加拿大百叶窗和窗帘定制网站:Blinds
2017/01/30 全球购物
宝拉珍选英国官网:Paula’s Choice英国
2019/05/29 全球购物
印度民族服装购物网站:BIBA
2019/08/05 全球购物
法国体育用品商店:GO Sport
2019/10/23 全球购物
医学护理毕业生自荐信
2013/11/07 职场文书
工业自动化专业自荐信范文
2014/04/10 职场文书
实习生岗位职责
2014/04/12 职场文书
个人批评与自我批评总结
2014/10/17 职场文书
2014年幼儿园后勤工作总结
2014/11/10 职场文书
Python使用OpenCV和K-Means聚类对毕业照进行图像分割
2021/06/11 Python