web自动化-JavaScript操作

做UI自动化的时候,有些操作无法直接通过selenium自带方法操 作成功,那么就需要借助前端js操作实现。

  • 比如浏览器的滚动条这种不是html页面的内容,无法直接通过selenium 控制到。需要借助JavaScript控制。
  • 比如有些点击操作无法通过普通点击+鼠标点击成功,也需要通过js控制 完成。
  • 比如有些元素的属性是不可以输入内容的,但是可以通过js修改元素的属 性,从而实现对他的一些操作。

所以通过在Selenium WebDriver中执行JavaScript可以大大增强Selenium 的能力,Selenium对于一些特殊场景的元素操作无能为力,我们可以借助 JavaScript来处理。

  • 优先使用selenium操作实现 如果不行 借助js操作。

web页面的三大组成部分:

  • html 代表页面内容
  • css 代表样式布局
  • javascript DOM 对于html的内容可以行增删改查,控制页面内容显示/数据 展示/动画效果的
    • 比如页面登录按钮点击可以登录成功,这个也是js代码前端控制的。
    • 在所有的浏览器里都内置了js的解释器,用来运行和编写 和调试 js代 码。

JavaScript语法和使用:

js语言学习为网站:https://www.runoob.com/js/js-functions.html,可以了解 一下,但是我们用的都是比较简单的一些语法。

document指的页面文档内容;document.后面提供了很多方法,可以操作页 面内容:

  • document.getElementById("kw") :元素定位
  • document.documentElement.scrollTop=100 : 控制滚动条滚动页面

在Python代码中调用JavaScript 【js滚动条操作】

使用方式1-不传参:driver.execute_script("...") ,直接在UI脚本里执行js代码

  • driver.execute_script("document.documentElement.scrollTop=3005")
  • 问题: js定位元素的方式有限,不如python代码灵活 - 不支持xpath;所以 直接执行的当时用的比较少

使用方式2-传参:driver.execute_script("arguments[0]...",element) ==用的更多 重点掌握

  • element是 通过Selenium元素定位找到对应的元素:
    • element = driver.find_element(By.ID,"XX")
    • 可以通过八大元素定位方法定位到元素 更加灵活
  • arguments[0]代表就是传递进来js脚本的第一个参数,也就是element这 个值
    • driver.execute_script("arguments[0]...",element)
  • js脚本里可以传多个参数,arguments[1]代表的就是传递进来的第二个参 数,依次类推
    • driver.execute_script('arguments[0][arguments[1]].click()', elements, 1)
      """
      点击操作:
      1、普通点击
      2、鼠标点击
      3、js点击
      """
      from selenium import  webdriver
      from time import sleep
      from selenium.webdriver.common.action_chains import ActionChainsfrom selenium.webdriver.common.by import Bydriver = webdriver.Chrome()# 点击元素--课堂派
      driver.get("https://www.ketangpai.com/#/login")
      driver.find_element(By.XPATH,'//input[@placeholder="请输入邮箱/手机号/账号"]').send_keys("2378807189@qq.com")
      driver.find_element(By.XPATH,'//input[@placeholder="请输入密码"]').send_keys("12345678")
      # 登录按钮元素
      ele_login = driver.find_element(By.XPATH,'//span[text()="登录"]')# 1、普通点击操作 --不成功 报错
      # ele_login.click()
      # 2、鼠标点击 : 虽然没有报错 但是没有点击
      # ActionChains(driver).click(ele_login).perform()
      # 3、js点击 --js传参方式  成功点击了
      # driver.execute_script("arguments[0].click()",ele_login)# 演示一下js里传多个参数写法
      driver.execute_script("arguments[0].click();alert(arguments[1])",ele_login,"登录失败")sleep(5)
      driver.quit()

js点击操作

 点击元素:有些网站就是无法直接点击 和鼠标点击,但是可以通过js点击成 功。【比如课堂派登录按钮】

  • 直接点击元素+鼠标点击都不成功 通过js
  • 点击元素的代码:arguments[0].click()

总结一下点击的方法:

  • 1、click()
  • 2、鼠标 ActionChains(driver).click(目标元素).perform()
  • 3、通过JavaScript来进行点击
    """
    使用方式1-不传参:driver.execute_script("...") ,直接在UI脚本里执行js代码
    * driver.execute_script("document.documentElement.scrollTop=3005")
    * 问题: js定位元素的方式有限,不如python代码灵活 - 不支持xpath;所以直接执行的当时用的比较少
    """
    from selenium import  webdriver
    from time import sleepdriver = webdriver.Chrome()# 场景一: 滚动条
    driver.get("http://testingpai.com/")sleep(2)
    # 在Python代码里执行js脚本操作
    driver.execute_script("document.documentElement.scrollTop=1000")sleep(2)
    driver.quit()# # 场景二:点击元素
    # driver.get("https://www.baidu.com/")
    #
    # sleep(2)
    # # 执行js点击操作
    # driver.execute_script('document.getElementById("su").click()')
    #
    # sleep(2)
    # driver.quit()
    

js修改属性并操作 -- 用的不多,了解

有些页面的数据是默认不让输入的,比如【电商项目的收货地址】的日期输入 框不能直接输入的,那么自动化测试的时候需要输入,就需要借助js代码进行操 作。

js代码检查页面的只读属性:

  • js删除某个属性:
    • arguments[0].removeAttribute('readonly')
    • 删除 记得强制等待一下
      # 1、修改元素的属性/移除元素的属性 - 了解
      # document.getElementByXXX(XXX).setAttribute("name","lemon")
      # document.getElementByXXX(XXX).RemoveAttribute("name")
      
"""
# 1、修改元素的属性/移除元素的属性 - 了解
# document.getElementByXXX(XXX).setAttribute("name","lemon")
# document.getElementByXXX(XXX).RemoveAttribute("name")
"""
from selenium import  webdriver
from selenium.webdriver.common.by import By
from time import sleep
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.support.wait import WebDriverWait# 封装的意思:把相同类似的代码放到一个函数里面,重复使用
def wait_element_clickable(locator):web_element = WebDriverWait(driver,8,0.5).until(EC.element_to_be_clickable(locator))return web_elementdef wait_element_visible(locator):#web_element代表通过显示等待找到的元素web_element =  WebDriverWait(driver, 8, 0.5).until(EC.visibility_of_element_located(locator))return web_elementdef wait_element_presence(locator):#web_element代表通过显示等待找到的元素web_element =  WebDriverWait(driver, 8, 0.5).until(EC.presence_of_element_located(locator))return web_elementdriver = webdriver.Chrome()
driver.get('http://mall.lemonban.com:3344/')
driver.maximize_window()
wait_element_clickable((By.LINK_TEXT,'登录')).click()
wait_element_visible((By.XPATH,'//input[@placeholder="请输入手机号/用户名"]')).send_keys('lemon_py')
wait_element_visible((By.XPATH,'//input[@placeholder="请输入密码"]')).send_keys('12345678')
wait_element_clickable((By.CLASS_NAME,'login-button')).click()
sleep(2)  # 一定要等待2s
wait_element_clickable((By.XPATH,'//span[text()="个人中心"]')).click()
wait_element_clickable((By.LINK_TEXT,'收货地址')).click()
wait_element_clickable((By.LINK_TEXT,'新增收货地址')).click()
sleep(2)# js修改属性操作
ele = driver.find_element(By.XPATH,'//div[@prop="province"]//input')
# 删除readonly属性
# driver.execute_script("arguments[0].removeAttribute('readonly')",ele)
driver.execute_script("arguments[0].setAttribute('placeholder','123')",ele)
sleep(1)
# ele.send_keys("黄花机场")sleep(4)
# driver.quit()

JavaScript总结使用

1、页面的滚动/内嵌滚动条滚动

  • document.documentElement.scrollTop = 200
  • 先要去找到内嵌滚动条元素,再去进行滚动【scrollTop】

2、点击:click()

3、修改元素的属性(删掉/改变元素的属性)

  • removeAttribute()
  • setAttribute()

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/14922.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

齐护K210系列教程(三十)_多任务切换

多任务切换 1,任务1的设定2,任务2的设定3,主程序4, 课程资源联系我们 在开发项目时,我们常会用到AIstart的多个任务来切换应用,比如当我识别到某种卡片时,要切换到别的任务,这样就要…

链游中的代币(Token)或加密货币(Cryptocurrency)是如何产生和使用的?

在区块链游戏(链游)中,代币和加密货币不仅是游戏经济的核心,也是连接现实世界与虚拟游戏世界的桥梁。这些数字货币不仅赋予了游戏内资产的真实价值,还为玩家提供了全新的互动和交易方式。下面,我们将深入探…

CentOS-7安装教程

目录 安装 修改主机名 配置静态IP 镜像下载地址 https://mirrors.aliyun.com/centos/7.9.2009/isos/x86_64/CentOS-7-x86_64-DVD-2009.iso VMware Workstation Pro下载 VMware Workstation Pro各版本下载(2024.5.5之后)(Windows与Linux安装包不限…

【okhttp】小问题记录合集

can’t create native thread 问题描述 OkHttpClient 每次使用都new创建,造成OOM,提示can’t create native thread… 问题分析 没有将OkHttpClient单例化. 每个client对象都有自己的线程池和连接池,如果为每个请求都创建一个client对象&a…

使用v-model完成数据的双向绑定

创作灵感 面试问道了,没答出来,呜呜呜~ v-model实现双向绑定的原理 首先我们要知道,v-model实现的双向绑定其实只是props与emit的简化版本。其中,props负责父组件向子组件传递值,emit负责子组件向父组件传递值。 在…

视频推拉流EasyDSS系统如何在清理缓存文件的同时不影响缓存读写?

视频推拉流EasyDSS视频直播点播平台可提供一站式的视频转码、点播、直播、视频推拉流、播放H.265视频等服务,搭配RTMP高清摄像头使用,可将无人机设备的实时流推送到平台上,实现无人机视频推流直播、巡检等应用。 有用户咨询,视频推…

Git 的安装和使用

一、Git 的下载和安装 目录 一、Git 的下载和安装 1. git 的下载 2. 安装 二、Git 的基本使用-操作本地仓库 1 初始化仓库 1)创建一个空目录 2)git init 2 把文件添加到版本库 1)创建文件 2)git add . 3)g…

在SpringBoot自定义指标并集成Prometheus和Grafana监控

前沿 写这篇文章的目的是发现自己整天埋头写业务代码但忽略了主动发现问题的能力,这里指的是监控和报警。结合工作中发现Prometheus和Grafana还是主流一些。本文介绍如何使用自定义指标,并使用Prometheus进行监控并报警,同时在 Grafana 进行…

重学java 40.多线程 — 死锁和线程状态

—— 24.5. 一、死锁 1.死锁介绍(锁嵌套就有可能产生死锁) 指的是两个或者两个以上的线程在执行的过程中由于竞争同步锁而产生的一种阻塞现象;如果没有外力的作用,他们将无法继续执行下去,这种情况称之为死锁 例: 两线程处于互相等待的状态&a…

上位机图像处理和嵌入式模块部署(mcu常见三种烧录方法)

【 声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing 163.com】 和单纯的windows上位机开发、嵌入式linux开发不一样,mcu的开发,是需要通过烧录器把编译好的镜像烧入到开发板里面的。这是很…

Spark RDD 操作实战

Spark RDD 基础 更多spark相关知识请查看官方接口文档 PySpark是Spark的PythonAPI,允许Python调用Spark编程模型。 配置spark环境 !apt-get install openjdk-8-jdk-headless -qq > /dev/null !wget -q www-us.apache.org/dist/spark/spark-2.4.8/spark-2.4.8…

16、Go Gin 深入理解Gin中间件

中间件介绍 Gin框架允许开发者在处理请求的过程汇总,加入用户自己的钩子(Hook)函数 这个钩子函数就叫中间件,中间件适合处理一些公共的业务逻辑 比如登录认证,权限校验、数据分页、记录日志、耗时统计等 1、全局中…

STM32通用定时器的应用实例(基于STM32F103)

目录 概述 1 STM32Cube配置项目 1.1 准备环境 1.2 配置项目参数 1.3 生成Project 2 HAL函数 2.1 初始化函数:HAL_TIM_Base_Init 2.2 中断模式启动定时器函数:HAL_TIM_Base_Start 2.3 定时器回调函数: HAL_TIM_PeriodElapsedCallback…

ElasticSearch操作之重置密码脚本

ElasticSearch操作之重置密码脚本 #!/bin/bash # 使用样例 ./ES密码重置.sh 旧密码 新密码# 输入旧密码 es_old_password$1# 设置新的密码变量 es_password$2# 正确响应 es_reponse{"acknowledged":true}# 检查Elasticsearch是否在运行 if pgrep -f elasticsearch &g…

2024年5月计算机视觉论文推荐:包括扩散模型、视觉语言模型、图像编辑和生成、视频处理和生成以及图像识别等各个主题

我们今天总结下2024年5月发表的最重要的论文,重点介绍了计算机视觉领域的最新研究和进展,包括扩散模型、视觉语言模型、图像编辑和生成、视频处理和生成以及图像识别等各个主题。 Diffusion Models 1、Dual3D: Efficient and Consistent Text-to-3D Ge…

数据赋能(98)——概念:数据整理、数据整合、数据处理

此文为本人学习与提高能力的笔记。 数据整理、数据整合与数据处理这三个术语,尽管在不少情境下可能被看作是近义词或拥有类似的语义范畴,但为了确保术语使用的精准度和专业性,我们必须对其有更为深入的认知。这三个概念虽在某种程度上相互交…

【C++题解】1697. 请输出n~1之间所有的整数

问题:1697. 请输出n~1之间所有的整数 类型:循环 题目描述: 从键盘读入一个整数 n ,请输出 n∼1 之间所有的整数,每行输出 1 个。 比如,假设读入 n5 ,输出结果如下: 5 4 3 2 1 输入&#xff1…

php 亚马逊AWS-S3对象存储上传文件

最近做国外项目的时候,需要把文件上传到AWS-S3对象存储空间里,下面整理一下上传方法,和碰到的问题 代码 /*** 亚马逊oss Aws上传* composer require aws/aws-sdk-php* param $filePath* param $ossPath* return array* author wzb* data 202…

Java进阶学习笔记4——Static应用知识:代码块

代码块: 代码块是类的五大成员之一(成员变量、构造器、方法、代码块、内部类)。 Java类生命周期:加载、验证、准备、初始化、卸载。 代码块分为两种: 静态代码块: 格式:static {} 特点&…