Selenium 遇见伪元素该如何处理?

这篇具有很好参考价值的文章主要介绍了Selenium 遇见伪元素该如何处理?。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

Selenium 遇见伪元素该如何处理?,selenium,测试工具

前言

问题发生

在很多前端页面中,大家会见到很多::before、::after 元素,比如【百度流量研究院】:

Selenium 遇见伪元素该如何处理?,selenium,测试工具

比如【百度疫情大数据平台】:

Selenium 遇见伪元素该如何处理?,selenium,测试工具

以【百度疫情大数据平台】为例,“累计确诊”文本并没有显示在 HTML 源代码中,如果通过常规的 xpath 元素定位方式是没办法的,因为“累计确诊”文本并不存在当前页面 dom 树中。

Selenium 遇见伪元素该如何处理?,selenium,测试工具

如何处理?

我们要弄清楚的是该元素的特殊之处,文本究竟存放在哪?

其实很简单,通过 Chrome 的 F12,我们将 style 选项展示出来:

Selenium 遇见伪元素该如何处理?,selenium,测试工具

可以看到元素的文本保存在 CSS 样式里面,通过 content 属性进行设置。

这里还有个小问题:文本根本对不上呢?

因为这里使用了 Unicode 编码,使用在线的 Unicode 编码转换工具即可看到

Selenium 遇见伪元素该如何处理?,selenium,测试工具

::after 元素也是同理,这种性质的元素我们称之为伪元素:

之所以被称为伪元素,是因为他们不是真正的页面元素,HTML 没有对应的元素,但是其所有用法和表现行为与真正的页面元素一样,可以对其使用诸如页面元素一样的 CSS 样式,表面上看上去貌似是页面的某些元素来展现,实际上是 CSS 样式展现的行为,因此被称为伪元素。

Selenium 遇见伪元素该如何处理?,selenium,测试工具

一、伪元素的定位

由于伪元素是通过 CSS 样式展现的行为,所以我们可以通过 CSS 样式选择器来进行定位,以“百度疫情大数据为例”:

  1. 先定位伪元素的父元素:div.Virus_1-1-318_3W7bs_

  2. 再定位到伪元素本身:div.Virus_1-1-318_3W7bs_>label

Selenium 遇见伪元素该如何处理?,selenium,测试工具

Selenium 遇见伪元素该如何处理?,selenium,测试工具

二、伪元素文本的获取

有些情况下我们需要获取到文本信息,其中伪元素的文本主要是通过 content 属性设置,我们可以通过 JavaScript 可以进行提取:

window.getComputedStyle(document.querySelector('.样式'),':before').getPropertyValue('content')
window.getComputedStyle(document.querySelector('.样式'),':after').getPropertyValue('content')

Selenium 遇见伪元素该如何处理?,selenium,测试工具

Selenium 中调用 JavaScript:

JavascriptExecutor jsExecutor = (JavascriptExecutor) driver;jsExecutor.executeScript("window.getComputedStyle(document.querySelector(

Selenium 遇见伪元素该如何处理?,selenium,测试工具文章来源地址https://www.toymoban.com/news/detail-818174.html

到了这里,关于Selenium 遇见伪元素该如何处理?的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【测试开发】第五节.测试——自动化测试(Selenium工具)

    作者简介:大家好,我是未央; 博客首页:未央.303 系列专栏:Java测试开发 每日一句: 人的一生,可以有所作为的时机只有一次,那就是现在!!! 前言 一、自动化测试的概念以及分类 二、Selenium—web自动化测试工具 2.1 自动化测试的一些前置工作 2.2 第一个自动化实例

    2024年02月04日
    浏览(62)
  • 自动化测试工具——Selenium详解

    Selenium是一个用于Web应用程序测试的工具。是一个开源的Web的自动化测试工具,最初是为网站自动化测试而开发的,类型像我们玩游戏用的按键精灵,可以按指定的命令自动操作,不同是Selenium可以直接运行在浏览器上,它支持所有主流的浏览器,支持的浏览器包括IE(7, 8,

    2024年01月20日
    浏览(60)
  • 如何使用自动化测试工具Selenium?

    哈喽,大家好,我是小浪。那么有一段时间没有更新了,还是在忙实习和秋招的事情,那么今天也是实习正式结束啦,开始继续更新我们的学习博客,后期主要是开发和测试的学习博客内容巨多,感兴趣的小伙伴们可以一键三连支持一下欧~ 目录 一、什么是自动化测试? 二、

    2024年02月11日
    浏览(55)
  • python自动化测试工具selenium

    selenium 是网页应用中最流行的自动化测试工具,可以用来做自动化测试或者浏览器爬虫等。官网地址为:Selenium。相对于另外一款web自动化测试工具QTP来说有如下优点: 免费开源轻量级,不同语言只需要一个体积很小的依赖包 支持多种系统,包括Windows,Mac,Linux 支持多种浏

    2024年02月08日
    浏览(81)
  • 一文详解:自动化测试工具——Selenium

    Selenium是一个用于Web应用程序测试的工具。是一个开源的Web的自动化测试工具,最初是为网站自动化测试而开发的,类型像我们玩游戏用的按键精灵,可以按指定的命令自动操作,不同是Selenium可以直接运行在浏览器上,它支持所有主流的浏览器,支持的浏览器包括IE(7, 8,

    2024年01月16日
    浏览(55)
  • 自动化测试工具Selenium的语法续.

    OK,那么上篇博客我们介绍了如何搭建基于Java+selenium的环境,并且使用selenium的一些语法给大家演示了如何进行自动化测试的案例,那么本篇博客我们来继续学习selenium的一些其他的比较重要的语法,感谢关注,期待三连~ 目录 一、定位一组元素 二、下拉框处理 三、上传文件

    2024年02月10日
    浏览(56)
  • 自动化测试工具selenium的安装方法

    一、什么是selenium Selenium 是一套 Web网站 的程序自动化操作 解决方案。 通过它,我们可以写出自动化程序,像人一样在浏览器里操作web界面。 比如点击界面按钮,在文本框中输入文字 等操作。 Selenium 通过使用  WebDriver  支持市场上所有主流浏览器的自动化。 Webdriver 是一个

    2024年02月09日
    浏览(45)
  • Web应用程序测试工具Selenium用法详解

    目录 一、引言 二、Selenium简介 三、Selenium安装与配置 1、安装Selenium 2、配置浏览器驱动 3、配置测试环境 四、Selenium用法详解 1、导入Selenium库和浏览器驱动 2、启动浏览器并打开网页 3、定位元素 4、执行操作 5、断言与验证 6、等待与隐式等待 7、关闭浏览器 五、总结与建议

    2024年02月02日
    浏览(61)
  • Selenium教程:自动化浏览器测试工具

    Selenium是一款用于自动化浏览器测试的工具,它提供了一系列的API和功能,使得开发人员可以编写脚本来模拟用户在浏览器中的行为。无论是在Web应用程序的功能测试、性能测试还是数据抓取方面,Selenium都是一个强大且广泛使用的工具。 在开始使用Selenium之前,您需要进行安

    2024年02月07日
    浏览(75)
  • 自动化测试工具Selenium的基本使用方法,软件测试基础

    browser.find_element(By.ID,‘kw’).send_keys(“美女”) browser.find_element_by_id(‘kw’).send_keys(‘性感’) 2.通过标签name属性进行定位 browser.find_element_by_name(“wd”).send_keys(“Linux”) browser.find_element(By.NAME,‘wd’).send_keys(“美女”) 3.通过标签名进行定位 browser.find_element_by_tag_name(“input”).

    2024年04月22日
    浏览(63)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包