首页 > 其他分享 >软件测试/人工智能|熟练使用web控件定位技巧，提升测试工作效率！

软件测试/人工智能|熟练使用web控件定位技巧，提升测试工作效率！

时间：2024-02-20 11:56:10浏览次数：22  
标签：控件 search web driver 元素 selenium 定位 id 软件测试

简介

在做 Web 自动化时，最根本的就是操作页面上的元素，首先要能找到这些元素，然后才能操作这些元素。工具或代码无法像测试人员一样用肉眼来分辨页面上的元素。那么要如何定位到这些元素，本章会介绍各种定位元素的方法。

web 控件定位

id 定位

Python 实现

driver.find_element(By.ID,'query')

Java 实现

driver.findElement(By.id("query"));

name 定位

Python 实现

driver.find_element(By.NAME,'query')

Java 实现

driver.findElement(By.name("query"));

通常来说 name 属性与 id 属性在页面中唯一，推荐使用这两个属性进行定位。

XPath 定位

XPath 是一个定位语言，英文全称为：XML Path Language，用来对 XML 上的元素进行定位，但也适用于 HTML，下面来看一个例子。

要定位的元素是 Sogou 首页的搜索输入框。

首先寻找 id 为 sf 的 form 元素，然后再寻找它的子元素 span，span 的 class 属性为 sec-input-box，最后找 span 的子元素 input，以下代码演示。

Python 实现

driver.find_element(By.XPATH,"//form[@id='sf']/span[@class='sec-input-box']/input")

Java 实现

driver.findElement(By.xpath("//form[@id='sf']/span[@class='sec-input-box']/input"));

下面的定位也可以找到这个 input，请注意，这里使用了双斜杠//，它可以找到子孙节点，而但斜杠/只能找到子节点，以下代码演示。

Python 实现

driver.find_element(By.XPATH,"//form[@id='sf']//input[@id='query']")

Java 实现

driver.findElement(By.xpath("//form[@id='sf']//input[@id='query']"));

XPath 表达式更多内容可参考下面表格。

表达式 描述
nodename 选取此节点的所有子节点。
/ 从根节点选取。
// 从匹配选择的当前节点选择文档中的节点，而不考虑它们的位置。
. 选取当前节点。
.. 选取当前节点的父节点。
@ 选取属性。

如何检验 XPath 定位是否正确？可以使用 chrome 的检查模式 -> Console，输入$x('XPath 表达式')即可。

通过 css_selector
XPath 可以定位绝大多数元素，但是 XPath 采用从上到下的遍历模式，速度并不快，而 css selector 采用样式定位，速度要优于 XPath，而且语法更简洁。下面是 Selenium 使用 css selector 的例子。

css selector 找到 class 属性值为 active 的元素，然后>表示找 class 属性为 active 的元素的子节点，以下代码演示。

Python 实现

driver.driver.find_element(By.CSS_SELECTOR,'.logo-big')

Java 实现

driver.findElement(By.cssSelector(".logo-big"));

下表列出了常用的 css_selector 表达式的用法。

表达式 描述
.intro class="intro" 的所有元素
#firstname id="firstname" 的所有元素
a[target=_blank] 具有属性 target="_blank" 的所有 a 元素
p:nth-child(2) 属于其父元素的第二个 p 元素

link 定位

元素中会出现文字，比如下面的分类，可以利用这段文字进行定位，以下是代码演示。

Python 实现

driver.driver.find_element(By.LINK_TEXT, '欢迎光临测试人社区 | Powered by 霍格沃兹测试开发学社')

Java 实现

driver.findElement(By.linkText("欢迎光临测试人社区 | Powered by 霍格沃兹测试开发学社"));

也可以采用部分匹配方式，不必写全：“欢迎光临”、“欢迎光临测试人社区”、“霍格沃兹”，以下是代码演示。

Python 实现

driver.find_element(By.PARTIAL_LINK_TEXT, '测试人社区')

Java 实现

driver.findElement(By.partialLinkText("测试人社区"));

要注意 partial_link_text 与 link_text 的区别，partial_link_text 不用写全，只需写部分即可，比如上面使用“霍格沃兹”即可匹配到“欢迎光临霍格沃兹测试学院”。

tag_name 定位

DOM 结构中，元素都有自己的 tag，比如 input tag，button tag，anchor tag 等等，每一个 tag 拥有多个属性，比如 id，name，value class 等等。

下面的高亮部分就是 tag：

可以使用 tag 进行定位:

Python 实现

driver.driver.find_element(By.TAG_NAME,'input')

Java 实现

driver.findElement(By.tagName("input"));

要注意，尽量避免使用 tag_name 定位元素，因为有大量重复的元素！

class_name 定位

可以通过元素的 class 属性值进行定位。

这里的 active 用的就是上图 class 的值。

Python 实现

driver.driver.find_element(By.CLASS_NAME, 'active')

Java 实现

driver.findElement(By.className("active"));

推荐使用

  1. ID/Name 是最安全的定位选项。根据 W3C 标准，它在页面中是唯一的，ID 在树结构中也是唯一的。
  2. CSS Selector 语法简洁，搜索速度快于 XPath。
  3. XPath 定位功能强大，采用遍历搜索，速度略慢。
  4. link，class name， tag name：不推荐使用，无法精准定位。

常见操作

Selenium 常见操作有：

  1. 输入、点击、清除。
  2. 关闭窗口、浏览器。
  3. 获取元素属性。
  4. 获取网页源代码、刷新页面。
  5. 设置窗口大小。

输入、点击、清除

输入、点击、清除在 Selenium 中对应的方法分别是 send_keys、click、clear。

Python 实现

from selenium import webdriver

driver = webdriver.Chrome()
driver.get('http://www.baidu.com')
driver.find_element(By.NAME,'wd').send_keys('霍格沃兹测试学院')
driver.find_element(By.ID,'su').click()
driver.find_element(By.NAME,'wd').clear()

Java 实现

importorg.openqa.selenium.By;
importorg.openqa.selenium.WebDriver;
importorg.openqa.selenium.chrome.ChromeDriver;



publicclass demo2{
publicstaticvoidmain(String[]args)throwsInterruptedException{
WebDriverdriver=newChromeDriver();

driver.get("http://www.baidu.com'");
Thread.sleep(2000);
driver.findElement(By.name("wd")).sendKeys("霍格沃兹测试学院");
driver.findElement(By.id("su")).click();
driver.findElement(By.name("wd")).clear();

//关闭浏览器进程
driver.quit();
}
}

关闭窗口、浏览器

关闭当前句柄窗口（不关闭进程）close()，关闭整个浏览器进程 quit()。

Python 实现

#导入对应的依赖
from selenium import webdriver
#初始化webdriver
driver = webdriver.Chrome()
#访问网站
driver.get('http"//www.baidu.com')
#关闭当前窗口
driver.close()
#关闭浏览器
driver.quit()

Java 实现

importorg.openqa.selenium.WebDriver;
importorg.openqa.selenium.chrome.ChromeDriver;
publicclass demo{
publicstaticvoidmain(String[]args)throwsInterruptedException{
WebDriverdriver=newChromeDriver();

driver.get("https://ceshiren.com");
Thread.sleep(2000);
//关闭页面
driver.close();
Thread.sleep(2000);
//关闭浏览器进程
driver.quit();
}
}

获取元素属性

获取元素标签上的属性 get_attribute('value')，元素的坐标 location，元素的大小 size。

Python 实现

import logging
from selenium import webdriver

def test_baidu():
    driver = webdriver.Chrome()
    driver.get('https://www.baidu.com')
    search = driver.find_element(By.ID,'su')
    logging.basicConfig(level=logging.INFO)
    logging.info(search.get_attribute('value'))
    #获取search的value属性值并打印
    logging.info(search.get_attribute('value'))
    #打印search的位置坐标
    logging.info(search.location)
    #打印search的元素大小
    logging.info(search.size)

Java 实现

importorg.openqa.selenium.*;
importorg.openqa.selenium.chrome.ChromeDriver;
importjava.util.logging.Logger;
publicclass demo{
privatestaticfinalLoggerlogger=Logger.getLogger(demo.class.getName());
publicstaticvoidmain(String[]args)throwsInterruptedException{

WebDriverdriver=newChromeDriver();

driver.get("https://www.baidu.com");

Thread.sleep(2000);

WebElementsearch=driver.findElement(By.id("su"));
//获取search元素的value属性值并打印
logger.info(search.getAttribute("value"));
//获取search元素的位置坐标值并打印

Pointp=search.getLocation();
logger.info("Width: "+p.x);
logger.info("Height: "+p.y);
//获取search元素的大小并分别打印
Dimensionsize=search.getSize();
intwidth=size.getWidth();
intheight=size.getHeight();
logger.info("Width: "+width);
logger.info("Height: "+height);

driver.close();
//关闭浏览器进程
driver.quit();
}
}

输出结果为：

INFO:root:百度一下
INFO:root:百度一下
INFO:root:{'x':844,'y':188}
INFO:root:{'height':44,'width':108}

获取网页源代码、刷新页面

网页源代码 page_source，刷新页面 refresh()。

Python 实现

import logging
from selenium import webdriver

driver = webdriver.Chrome()
driver.get('http"//www.baidu.com')
#刷新页面
driver.refresh()
logging.basicConfig(level=logging.INFO)
#打印当前页面的源代码
logging.info(driver.page_source)

Java 实现

importorg.openqa.selenium.*;
importorg.openqa.selenium.chrome.ChromeDriver;
importjava.util.logging.Logger;
publicclass demo{
privatestaticfinalLoggerlogger=Logger.getLogger(demo.class.getName());
publicstaticvoidmain(String[]args)throwsInterruptedException{

WebDriverdriver=newChromeDriver();

driver.get("https://ceshiren.com");


Thread.sleep(2000);
driver.navigate().refresh();
//打印页面源代码
logger.info(driver.getPageSource());

driver.close();
//关闭浏览器进程
driver.quit();
}
}

设置窗口大小

设置窗口大小主要有最小化、最大化和自定义设置窗口具体的大小。

Python 实现

from selenium import webdriver

driver = webdriver.Chrome()
driver.get('http"//www.baidu.com')
#最小化窗口
driver.minimize_window()
#最大化窗口
driver.maximize_window()
#将浏览器设置为1000*1000的大小
driver.set_window_size(1000, 1000)

Java 实现

importorg.openqa.selenium.*;
importorg.openqa.selenium.chrome.ChromeDriver;

publicclass demo{

publicstaticvoidmain(String[]args)throwsInterruptedException{

WebDriverdriver=newChromeDriver();

driver.get("https://ceshiren.com");
//最大化页面
driver.manage().window().maximize();
//最小化页面
driver.manage().window().minimize();

Thread.sleep(2000);
//将浏览器页面大小设置为800x600像素
driver.manage().window().setSize(newDimension(800,600));

driver.close();
//关闭浏览器进程
driver.quit();
}
}

标签：控件,search,web,driver,元素,selenium,定位,id,软件测试
From： https://www.cnblogs.com/hogwarts/p/18022797

相关文章

  • 开工大吉——推荐一款2024年开发者可能会用到表格控件
    前言在现代工作环境中，信息的处理和管理是至关重要的。表格是一种常见的数据呈现和整理工具，被广泛应用于各行各业。然而，随着技术的不断发展，市场对表格控件的需求也越来越高。随着工作效率的重要性日益凸显，一款高效的表格控件成为了开发者们的首选，因此本文小编将从葡萄城公司的纯前......
  • Qt——QLabel控件常见的属性、方法和信号
    QLabel控件常见的属性、方法和信号一、QLabel控件常见属性二、QLabel控件常见方法三、QLabel控件常见信号方法：set+xxx设置属性、去掉set就是获取属性所有控件中的属性和方法都是通用的QLabel控件描述：QLabel是一个用于显示文本或图像的控件。它通常被用作标签或......
  • Flask 学习99-Flask-SocketIO 开发websocket接口
    前言flask-socketio为flask应用提供了一个客户端与服务器之间低延迟的双向通讯官网地址：https://flask-socketio.readthedocs.io/en/latest/intro.html环境准备先安装flask-socketiopipinstallflask-socketio说明Flask-SocketIO与js版本客户端不匹配，二者不能正常通信。......
  • 学习总结基于VUE+ASP.NET Core mvc+EFCore+Axios.js+ehcart.js开发一个web应用
    Vue是一个用于构建用户界面（基于数据渲染出用户看到的页面）的渐进式（循序渐进）框架。分为（声明式渲染，基于js包、组建系统、客户端路由、大规模状态管理和构建工具）Vue的使用方法分为：1.Vue核心包开发：局部模块改造；2.Vue核心包+Vue插件工程化开发：整站开发1.开始之前准备下述包 在prog......
  • 将控件提升为自定义的控件
    一、自定义控件的类型自定义拖动的设计文件(.h、.cpp、.ui)和自定义的自绘文件(.h、.cpp)二、打开提升窗口三、设置自定义类路径四、注意事项1.若自定义控件与提升窗口不在同一路径，且置于pri文件中。则会导致自定义的控件编译报错。"noruletomaketargetxxx......
  • linux上使用webdav
    webdav干什么用的？对于我来说，主要是用来同步文件的，n年以前，那时候还啥都不懂，要分享一个文件都是用qq/或者微信发，那时候就一个手机一个电脑，而且文件大部分是分享给认识的人。qq分享完全够用.然后事情越来越复杂，手上的设备越来越多，很多linux服务器没有ui界面，这个时候分享文件变成一......
  • Web自动化三种等待方式，一篇文章教会你
    三种等待方式简介在实际工作中等待机制可以保证代码的稳定性，保证代码不会受网速、电脑性能等条件的约束。等待就是当运行代码时，如果页面的渲染速度跟不上代码的运行速度，就需要人为的去限制代码执行的速度。在做Web自动化时，一般要等待页面元素加载完成后，才能执行操作，否则会......
  • 熟悉又陌生的JavaWeb 第0天
    传送门JavaWeb程序设计不满足于Java基础的窗口命令行程序，那来试试网站吧于是便有了JavaWeb印象中的大学教材应该是这本书，不过无所谓了，大同小异，教的内容其实差不多看看教科书的目录JavaWeb开发环境配置B/S结构服务器安装IDE安装第一个Web项目课后习题HTML基础......
  • 如何使用ComPDFKit Web SDK添加在线编辑PDF文档功能
    文档编辑功能提供了一系列的操作页面的能力，使用户能够控制文档结构，并调整文档的布局和格式，确保文档内容以合理有序的方式精准呈现。ComPDFKit文档编辑的优势插入或删除页面： 向文档插入或删除页面，以满足特定的排版要求。文档结构调整： 调整页面排列顺序或旋转方向，以满足特定......
  • Burp Suite Professional 2023.12.1.5 (macOS, Linux, Windows) - Web 应用安全、测试
    BurpSuiteProfessional2023.12.1.5(macOS,Linux,Windows)-Web应用安全、测试和扫描BurpSuiteProfessional,Test,find,andexploitvulnerabilities.请访问原文链接：BurpSuiteProfessional2024.1.1(macOS,Linux,Windows)-Web应用安全、测试和扫描，查看最新......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99