美文网首页python
selenium:解决页面元素display:none的方法

selenium:解决页面元素display:none的方法

作者: wit92 | 来源:发表于2020-06-15 00:18 被阅读0次

在UI自动化测试中,有时候会遇到页面元素无法定位的问题,包括xpath等方法都无法定位,是因为前端元素被设置为不可见导致。

这篇博客,介绍下如何通过JavaScript修改页面元素属性来定位的方法。。。

1、具体问题

常见的页面元素不可见导致的不可定位,都是由于下面的问题:

通过查看相关文档,可以看出display:none方法是设置元素不可见,这就是导致为什么通过定位页面元素无法定位的原因。

[图片上传失败...(image-b92484-1592213579720)]

关于display更多的信息,可以看这里:HTML DOM display用法

2、解决方案

对于这种问题,可以通过JavaScript修改页面元素属性来将元素置位可见,然后通过id、classname等方法去定位,示例代码如下(针对上图所示):

js = "document.getElementById('txtPassword').style.display='block';"
# 调用js脚本
driver.execute_script(js)
sleep(3)
driver.find_element_by_id("txtPassword").send_keys("123456")

代码解析:

首先通过selenium封装好的方法document去找到display元素,document提供以下方法来定位display元素:

getElementById():返回对指定ID第一个对象的引用

getElementsByName() :返回带有指定名称的对象集合

getElementsByTagName():返回带有指定标签名的对象集合

[图片上传失败...(image-857eba-1592213579720)]

关于document更多的信息,可以看这里:HTML DOM getElement()方法

上面我定义了一个js变量,然后通过getElementById()方法去引用display元素,修改none属性为block属性(作为块级元素显示),然后通过selenium自带的execute_script方法执行脚本。

最后,当元素属性置为可见时,可以通过ID去定位元素。

其实还有一个解决方案:让前端修改display:none为block就好了,但这样的话,带来的变化和安全风险又是需要考虑的问题。一个问题的解决总是伴随着新的问题,核裂变了解一下?

想起今天和同行聊天时说起的分裂BUG的话题,对话如下:

大佬N:核裂变的原理是通过中子撞击原子核产生多个新的原子核,原子核是已有的BUG,中子是修改BUG加上的代码,分裂之后这个bug消失了,取而代之的是更多的原子核(BUG)。。。

我:引起一个BUG的原因可能是多个,修改一段代码可能造成多个BUG,就像用新技术解决旧问题而带来的新问题一个意思。。。

自动化本身最大的挑战还是变化,因此从分层测试角度结合公司项目具体情况,考虑解决问题的方法,才是最好的选择。

相关文章

  • CSS隐藏元素

    display: none 当我们不希望某个元素显示,也不需要该元素占据页面空间时,使用 display:none...

  • 2020-04-22v-if

    v-show 是要渲染到页面上的dom 元素,只是 display:none 或者display:block

  • jQuery动画篇

    jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性。...

  • css综合包括

    display:none和visibility:none和opacity:0的区别 display:none元素不...

  • 总结 CSS 隐藏页面元素的一些方法

    先把css隐藏页面元素有几种方法列出来,方便查看以及使用,下文再分析其中的原理 display : none ; ...

  • CSS-元素的显示与隐藏

    display display:none隐藏元素,不是删除,但元素一直存在于页面中特点:隐藏之后不再保留位置 vi...

  • jquery 动画特效

    隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性。但是通过css...

  • CSS进阶六:display,position,float,cl

    文档流 display 修改元素的类型 可选值: none元素不在页面中显示,也不会占据页面位置 block元素作...

  • css的一些小问题

    display:none和visibility:hidden的区别? display:none 隐藏对应的元素,...

  • 面试知识3

    一:display:none和visibility:hidden的区别? display:none 隐藏对应的元素...

网友评论

    本文标题:selenium:解决页面元素display:none的方法

    本文链接:https://www.haomeiwen.com/subject/kqhxxktx.html