JS执行器在UI自动化测试中的应用

JS执行器在UI自动化测试中的应用

前言

在进行UI自动化过程会遇到滚动条下拉、隐藏元素定位、只读属性元素的编辑、富文本处理等，此时可以使用JS执行器简化我们的一些处理操作。

具体应用

JS执行器的使用步骤：

1.先写个JS脚本，如果需要获取操作后的值，JS脚本前面需要加return

2.使用webdriver的execute_script()方法执行脚本；方法中传递2个参数或1个参数；传递2个参数时，分别传入JS脚本、要操作的页面元素；传递1个参数时，传入JS脚本，对整个webdriver做操作。

3.操作通过JS执行器注入了JS脚本的页面元素或webdriver对象

接下来我们以百度、12306网站为例，演绎具体用法

1.通过JS脚本，获取页面元素的属性值

from selenium import webdriverdriver = webdriver.Chrome()#创建浏览器对象driver.maximize_window()#窗口最大化driver.get(r'= driver.find_element('id','su') #页面的百度一下元素'''写JS脚本，写JS脚本的步骤：js:定义一个变量名js，用于存放所写的JS季报表= ：赋值JS脚本全部用引号引起来，整个脚本就是一个字符串arguments[0]:理解为占位符,代值被操作的元素或对象.:连接被操作的元素对象与所做的具体操作getAttribute():我们这里的举例的操作为：获取元素的某个属性值JS脚本最前面加上return，是因为我们要获取对元素操作后的值'''js = "return arguments[0].getAttribute('value')" #JS脚本的意思为：返回某个元素的value属性的值value = driver.execute_script(js,el)#执行JS脚本，传入的2个参数依次为：要执行的脚本、要操作的对象print(value)#打印获取到的值driver.quit()#关闭浏览器

执行的结果：

2.通过JS脚本，获取页面元素的文本值

from selenium import webdriverdriver = webdriver.Chrome()#创建浏览器对象driver.maximize_window()#窗口最大化driver.get(r'= driver.find_element('xpath','/html/body/div[3]/div[2]/div/div[1]/div/div[2]/div[1]/div[1]/div[2]/label') #js = "return arguments[0].innerHTML" #JS脚本的意思为：返回某个元素的文本值value = driver.execute_script(js,el)#执行JS脚本，传入的2个参数依次为：要执行的脚本、要操作的对象print(value)#打印获取到的值driver.quit()#关闭浏览器

执行结果：

3.通过JS脚本，删除页面元素的属性值，然后对页面元素进行操作

from selenium import webdriverfrom time import sleepdriver = webdriver.Chrome()#创建浏览器对象driver.maximize_window()#窗口最大化driver.get(r'= driver.find_element('xpath','//input[@id="train_date" and @class="input"]')js = "arguments[0].removeAttribute('readonly')" #JS脚本的意思为：移除某个元素的readonly属性driver.execute_script(js,el)#执行JS脚本，传入的2个参数依次为：要执行的脚本、要操作的对象sleep(1)#强制等待1秒el.clear() #清空输入框内容el.send_keys("2021-07-11")#对输入框进行输入操作sleep(3)driver.quit()#关闭浏览器

执行结果：

4.通过JS脚本，修改页面元素的属性值

from selenium import webdriverfrom time import sleepdriver = webdriver.Chrome()#创建浏览器对象driver.maximize_window()#窗口最大化driver.get(r'= driver.find_element('id','su') #页面的百度一下元素js = "return arguments[0].setAttribute('value','AAAAA')" #JS脚本的意思为：返回某个元素的value属性的值driver.execute_script(js,el)#执行JS脚本，传入的2个参数依次为：要执行的脚本、要操作的对象sleep(10)driver.quit()#关闭浏览器

执行结果：

5.执行JS脚本，进行滚动条操作

from selenium import webdriverfrom time import sleepdriver = webdriver.Chrome()#创建浏览器对象driver.maximize_window()#窗口最大化driver.implicitly_wait(30)driver.get(r'= "document.documentElement.scrollTop=1000" #向下滚动driver.execute_script(js)#执行JS脚本sleep(3)js1 = "document.documentElement.scrollTop=0" #先上滑动driver.execute_script(js1)#执行JS脚本sleep(3)js2 = "window.scrollTo(100,200)" #左右滑动driver.execute_script(js2)sleep(3)js3 = "arguments[0].scrollIntoView()"el = driver.find_element('xpath','//span[text()="百度热搜"]')sleep(1)driver.execute_script(js3,el)sleep(3)driver.quit()#关闭浏览器

执行结果：

由于是动态的图，这里就不截图了，大家可以按照代码自己尝试

总结：

slenium底层就方式通过执行JS脚本来操作页面元素的，所以当我们使用普通封装的常规操作方法无法进行相关操作时，可以使用JS执行器来达到我们的操作目的。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。