51Testing软件测试论坛

标题: 分享Selenium鼠标操作和JS代码执行 [打印本页]

作者: lsekfe    时间: 2023-6-2 11:31
标题: 分享Selenium鼠标操作和JS代码执行
一、鼠标操作
  鼠标是通过底层接口执行的,需要调用ActionChains对象来执行对应的方法。
  1.1 鼠标操作实现方式
  在selenium中将操作鼠标的方法封装在ActionChains类中,实例化对象action=ActionChains(driver)
  context_click(element)           右击 --> 模拟鼠标右键点击效果
  double_click(element)            双击 --> 模拟鼠标双击效果
  drag_and_drop(source, target)    拖动 --> 模拟鼠标拖动效果
  move_to_element(element)         悬停 --> 模拟鼠标悬停效果
  perform()                        执行 --> 此方法用来执行以上所有鼠标操作


  selenium提供鼠标操作的方法及步骤:
  ·需要导入ActionChains类
  · 通过ActionChains实例化鼠标对象 action = ActionChains(driver) # driver表示的是浏览器驱动对象
  · 调用鼠标的事件方法
  · 调用鼠标的执行方法 action.perform()
  1.2 clickAndHold单击(不释放)
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # click_and_hold 点击且不松开
      div = driver.find_element_by_xpath('//div[@onmousedown="mDown(this)"]')
      webdriver.ActionChains(driver).click_and_hold(div).perform()
      time.sleep(2)


  1.3context_click单击
  import time
  from selenium import webdriver
  from selenium.webdriver import ActionChains
  dr = webdriver.Chrome()
  url = r'http://www.baidu.com'
  dr.get(url)
  ipt = dr.find_element_by_id('kw')
  action = ActionChains(dr)
  action.context_click(ipt) # 在输入框中右键操作
  action.perform()
  time.sleep(3)
  dr.quit()


  1.4 double_click双击
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # double_click  双击
      button = driver.find_element_by_xpath('//button[@ondblclick]')
      webdriver.ActionChains(driver).double_click(button).perform()
      time.sleep(2)


  1.5 drag_and_drop拖动
  此方法首先在源元素上单击并按住,然后移动到目标元素的位置后释放鼠标.
  调用鼠标拖动事件方法 action.drag_and_drop(source, target) # source表示的是源元素,被拖动的元素, target表示是目标源,也就是要拖动到哪个元素上。
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      div1 = driver.find_element_by_id('draggable')
      div2 = driver.find_element_by_id('droppable')
      webdriver.ActionChains(driver).drag_and_drop(div1, div2).perform()
      time.sleep(3)


  1.6 move_to_element悬停
  此方法将鼠标移到元素的中间. 执行此操作时, 该元素也会滚动到视图中(悬停)
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # move_to_element
      div = WebDriverWait(driver,timeout=3).until(EC.visibility_of_element_located(('xpath','//div[@onmouseover="mOver(this)"]')))
      # 移动到
      # action=webdriver.ActionChains(driver)
      # action.move_to_element(div).perform()
      webdriver.ActionChains(driver).move_to_element(div).perform()
      time.sleep(2)


  1.7 drag_and_drop_by_offset单元素拖动
  action.drag_and_drop_by_offset(element, x, y) x, y 表示的元素拖动时横向和纵向移动的距离,单位为像素, element表示的是元素对象 移动的像素最终要比在[url=]web[/url]页面中看到的移动像素值要大,最好大于5个像素或者10像素
  import time
  from selenium import webdriver
  from selenium.webdriver import ActionChains
  dr = webdriver.Chrome()
  url =
  r'file:///C:/Users/tang/Desktop/pagetest/%E9%AA%8C%E8%AF%81%E7%A0%81/index.html'
  dr.get(url)
  h = dr.find_element_by_css_selector('.handler')
  action = ActionChains(dr)
  action.drag_and_drop_by_offset(h, 260, 0) # 单元素拖拽 滑动验证
  action.perform()
  time.sleep(5)
  dr.quit()


  1.8 moveByOffset:
  此方法将鼠标从其当前位置(或0,0)移动给定的偏移量. 如果坐标在视图窗口之外, 则鼠标最终将在浏览器窗口之外.
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # 移开 move_by_offset
      webdriver.ActionChains(driver).move_by_offset(xoffset=500,yoffset=500).perform()
      time.sleep(2)


  1.9 release(释放)
  此操作将释放按下的鼠标左键. 如果WebElement转移了, 它将释放给定WebElement上按下的鼠标左键
  import time
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      # 打开本地文件中的html文件
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # release   松开鼠标
      webdriver.ActionChains(driver).release(div).perform()
      time.sleep(2)


  1.10鼠标链式操作
  from selenium import webdriver
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC

  with webdriver.Chrome() as driver:
      driver.get('file:///Users/superfan/工作/myproject/study/po/action.html')

      # 创建一个动作链
      action=webdriver.ActionChains(driver)

      # move_to_element
      div1 = WebDriverWait(driver, timeout=3).until(
          EC.visibility_of_element_located(('xpath', '//div[@onmouseover="mOver(this)"]')))
      # 指定等待时间为2s
      action.move_to_element(div1).pause(2)

      # 移开 move_by_offset
      action.move_by_offset(xoffset=500, yoffset=500).pause(2)

      # click_and_hold 点击且不松开
      div2 = driver.find_element_by_xpath('//div[@onmousedown="mDown(this)"]')
      action.click_and_hold(div2).pause(2)

      # release   松开鼠标
      action.release(div2).pause(2)


      # 执行动作链
      action.perform()



      # 以上代码可重合在一起执行
      action.move_to_element(div1).pause(2).move_by_offset(xoffset=500, yoffset=500).pause(2).click_and_hold(div2).pause(2).release(div2).pause(2).perform()


  二、执行js代码
  selenium执行js有几个方法,通常使用 execute_script方法。
  2.1 页面滚动指定距离
  import time
  from selenium import webdriver

  with webdriver.Chrome() as driver:
      driver.get('https://image.baidu.com/search/index?tn=baiduimage&ct=201326592&lm=-1&cl=2&ie=gb18030&word=%CD%BC%C6%AC&fr=ala&ala=1&alatpl=adress&pos=0&hs=2&xthttps=111111')
      # 滚动100px 100表示滚动条距离页面顶部100像素  0是x方向,100是y方向
      driver.execute_script("window.scrollTo(0,100)")
      time.sleep(1)
      # 200表示滚动条距离页面顶部200像素
      driver.execute_script("window.scrollTo(0,200)")
      time.sleep(1)
      driver.execute_script("window.scrollTo(0,300)")
      time.sleep(3)
      # 移动到底部
      driver.execute_script("window.scrollTo(0,document.body.scrollHeight)")
      time.sleep(3)
      # 移动到顶部
      driver.execute_script("window.scrollTo(0,0)")
      time.sleep(3)


  2.2 页面滚动至指定位置
  执行js时,可以传递参数给js脚本。
  案例:打开页面,滚动到指定的元素可见。
  import time
  from selenium import webdriver

  with webdriver.Chrome(executable_path='./chromedriver') as driver:
      driver.get('file:///Users/superfan/工作/myproject/study/po/scroll.html')
      time.sleep(2)
      div = driver.find_element_by_xpath('//div')
      # 移动到元素的底端与当前窗口的底部对齐
      driver.execute_script("arguments[0].scrollIntoView(false);", div)
      # arguments[0]表示传入第一个值div,arguments[1]表示传入第一个值div2,
      # driver.execute_script("arguments[0].scrollIntoView(false);alert(arguments[1]);", div,1)
      time.sleep(2)
      # 移动到元素的顶端与当前窗口的顶端对齐
      driver.execute_script("arguments[0].scrollIntoView();", div)
      time.sleep(2)








欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/) Powered by Discuz! X3.2