Python自动化测试（05）如何处理日期选择框

野性酷女 2022-12-25 09:57 366阅读 0赞

一、问题溯源

在自动化测试时，最重要的是测试思路和用例设计，位居其次的就是框架的设计和使用，再往下，就是基础的定位方法了。很多盆友可能会在刚刚入门的时候卡在定位元素里出不来，经常遇见有些元素定位不到，或者定位了点击不到，或者定位到了一操作就报错的情况。

那么今天我们就来一起看一下【日期下拉选择框】这种组件在自动化测试中要如何处理呢？

二、解决方案

三种方法：

① 干就完了

最基础的方式就是——直接点击。
第一步点击下拉框，打开下拉窗口；第二步点击其中的日期。一路click，比较常规的操作。
在这里插入图片描述
代码样例如下：

  1. import time
  2. from selenium import webdriver
  4. driver = webdriver.Chrome()
  5. driver.get("https://www.xxx.com/esp/index.html")
  6. driver.find_element_by_xpath('/html/body/div/div[2]/form/div[1]/input').click()  # 点击日期选择框
  7. driver.find_element_by_xpath('/html/body/div[2]/div[2]/table/tbody/tr[5]/td[2]').click()  # 选择日期
  8. sleep(3)
  9. driver.quit()

但这种点击操作，对于某些组件可能并不生效，会有点了没反应的情况。

那么这时候我们想到，这个框，它不仅是个下拉框，它也是个输入框！
如果可以直接往里面输入日期，不就方便得多了吗？还可以自由控制输入哪一天。

但看了一下F12，显然并不可行，里面有一个属性“readonly=“readonly””，也就是只读，具有这种属性的输入框是无法进行input操作的。
在这里插入图片描述
但对于我们测试人员来说，这是事吗？这不是事。方法②，上js：

② 使用js

直接上代码，使用js去除：

  1. import time
  2. from selenium import webdriver
  4. driver = webdriver.Chrome()
  5. driver.get("https://www.xxx.com/esp/index.html")
  6. js = "$('input:eq(0)').removeAttr('readonly')"  # 使用js临时移除readonly属性
  7. driver.execute_script(js)  # 执行js
  8. input_date = driver.find_element_by_xpath('/html/body/div/div[2]/form/div[1]/input')  # 定位日期下拉框（此时的下拉框已经可以输入了）
  9. input_date.send_keys("2020-12-16")  # 输入完执行点击，使数据存入
  10. input_date.click()
  11. sleep(3)
  12. driver.quit()

重点就在于这两句，使用js临时移除readonly属性：

  1. js = "$('input:eq(0)').removeAttr('readonly')"  # 使用js临时移除readonly属性
  2. driver.execute_script(js)  # 执行js

以上方式对于市面上多数的输入框都是生效的。
但如果你系统的前端是用vue写的，那可能就不生效了，会报错如下：

  1. selenium.common.exceptions.JavascriptException: 
  2. Message: javascript error: $ is not defined

于是我们用到了终极大法：

③ js+class定位

还是直接上代码：

  1. import time
  2. from selenium import webdriver
  4. driver = webdriver.Chrome()
  5. driver.get("https://www.xxx.com/esp/index.html")
  6. # 需要注意ClassName后的那个[0]代表dom中的第一个class，如果你要使用第二个，那就写[1]。
  7. js = 'document.getElementsByClassName("ivu-input ivu-input-default ivu-input-with-suffix")[0].removeAttribute("readOnly")'  # 使用js结合className临时移除readonly属性。
  8. driver.execute_script(js)  # 执行js
  9. input_date = driver.find_element_by_xpath("(//input[@type='text'])[2]")  # 定位日期下拉框（此时的下拉框已经可以输入了）
  10. input_date.send_keys("2020-12-16")
  11. input_date.click()  # 输入完再次点击日期下拉框，使数据存入
  12. sleep(3)
  13. driver.quit()

对于vue这种没有唯一的class、id的代码形式，使用③的方式可以顺利实现日期输入。

以上三种方法，在实际操作中可选择最合适的使用，感谢阅读。

-Over-

  1. 软件测试工程师一只，也在不断的学习阶段，平时的小经验不定期分享。
  2. 博主经验有限，若有不足，欢迎交流，共同改进~
  3. 有意可加Q群 908417285 交流学习。
  4. 乾坤未定，你我皆是黑马

发表评论

表情：
评论列表 （有 0 条评论，366人围观）

还没有评论，来说两句吧...

相关阅读