当前位置： 首页 > article >正文

web UI自动化测试笔记

article 2025/1/27 6:18:43

在当今数字化转型的浪潮中，Web 应用已经无处不在，而其质量保障的关键之一就是自动化测试。想象一下，如果每次都手动验证 UI 功能，不仅耗时耗力，还容易遗漏问题。Python 的强大生态为 Web UI 自动化测试提供了高效的解决方案。

如何用 Python 高效实现 Web UI 自动化测试？有哪些工具和最佳实践可以让测试变得更加简单和可靠？

随着 DevOps 和 CI/CD 的普及，Web UI 自动化测试已经成为企业构建高效开发和测试流程的核心环节之一。越来越多的公司要求测试人员掌握自动化技能，而 Python 作为易学易用的语言，成为测试工程师的首选。

Selenium WebDriver API

（一）：元素定位

  1. id定位find_element_by_id();
  2. name定位find_element_by_name();
  3. class属性定位find_element_by_class_name();
  4. tag属性定位find_element_by_tag_name();
  5. 元素标签之前的文本信息来定位find_element_by_link_text();
  6. 取文本链接的一部分来定位find_element_by_partial_link_text();
  7. xpath多种定位策略 find_element_by_xpath();
  8.  css选择器定位

①绝对路径：

find_element_by_xpath("html/body/div[2]/div[2]/div[3]/div[2]/form/input[1]"); 1

②元素属性：

find_element_by_xpath("//input[@id='qwe']"); find_element_by_xpath("//input[@name='qwe']"); find_element_by_xpath("//input[@class='qwe']"); find_element_by_xpath("//*[@id='qwe']"); 1 2 3 4

③层级属性：

find_element_by_xpath("//span[@class='qwe']/input"); find_element_by_xpath("//form[@id='qwe']/span[2]/input"); 1 2

④运算逻辑：

find_element_by_xpath("//input[@id='qwe' and @class='qwer']/span/input");

① css选择器定位

find_element_by_css_selector(); 1 其中css也有多种策略：

①class属性：

find_element_by_css_selector(".qwe"); 1

②id属性： find_element_by_css_selector("#qwe");

③标签名：find_element_by_css_selector("input");

A.父子关系：find_element_by_css_selector("span>input");

B.属性定位：find_element_by_css_selector('[type="submit"]');

C.组合定位：find_element_by_css_selector(" form.fm>span>input>input.qwe");

9.BY元素定位

以上提到的8种定位方法，webdriver还提供了另一套写法，即统一调用find_element()方法，通过BY来声明定位的方法，并且传入对应定位方法的定位参数。 使用BY之前需要插入BY类：

from selenium.webdriver.common.by import By


find_element(BY.ID,"qwe");
find_element(BY.NAME,"qwe");
find_element(BY.CLASS_NAME,"qwe");
find_element(BY.TAG_NAME,"qwe");
find_element(BY.LINK_TEXT,"xxxxx");
find_element(BY.PARTIAL_LINK_TEXT,"dddd");
find_element(BY.XPATH,"//* [@id='qwe']");
find_element(BY.CSS_CELECTOR," span>input ");

    （二）：浏览器控制1

    1.控制浏览器窗口大小

    set_window_size();

    如set_window_size(640,480); 即宽640，高480

    maximize_window(); 窗口最大化，不需要参数，直接使用

    2.控制浏览器进退、前进

    back(); 返回

    forwar(); 前进

    如 driver.back(); 其中driver=webdriver.Chrome()

    3.模拟浏览器刷新

    refresh(); 如driver.refresh()类似F5

    4.简单元素操作

    ①clear(); 清除文本

    ②send_keys(*value); 模拟按键输入

    ③click(); 单击元素

    举例：

    driver.find_element_by_id("qwe").clear()

    driver.find_element_by_id("qwe").send_keys("tyyu")

    driver.find_element_by_id("login").click()

    5.webelement接口常用方法

    size:返回元素的尺寸

    text:获取元素的文本

    get_attributte(name):获得属性

    is_displayed():设置改元素是否用户可见

    举例：

    size=driver.find_element_by_id("qwe").size    获取输入框的尺寸

    text=driver.find_element_by_id("qwe").text    获取文本信息

    attributte = driver.find_element_by_id("qwe").get_ attributte('type')  可以是id、name、type或其他任意属性

    result= driver.find_element_by_id("qwe"). is_displayed()  返回元素的结果是否可见，返回结果为Ture或者False

    6.鼠标事件

    perform(): 执行所有ActionChains中存储的行为

    context_click(): 右击

    double_click(): 双击

    drag_and_drop(element, target

    move_to_element(): 鼠标悬停

    举例：

    ①rom selenium.webdriver.common.action_chains import ActionChains   先引入ActionChains类

    driver = webdriver.Chrome()

    driver.get("http://www.baidu.com")

    #...

    #定位到要右击的元素

    right_click = driver.find_element_by_id("qwe")

    #对定位到的元素执行鼠标右击操作

    ActionChains(driver).context_click(right_click).perform()

    说明：

    ActionChains(driver):调用这个类，将浏览器驱动driver作为参数传入

    context_click(right_click):模拟邮件操作，在使用时需要指定元素定位

    perfom():将指定所有ActionChains中存储的行为。

    ②above=driver.find_element_by_id("qwer")

    ActionChains(driver).move_to_element(above).perfom()

    其他方法类似

    7.键盘事件

    Keys类提供了键盘上所有的按键方法

    from selenium.webdriver.common.keys import Keys

    send_keys(Keys.BACK_SPACE)        删除键

    send_keys(Keys. SPACE)    空格键

    send_keys(Keys.TAB)    制表键

    send_keys(Keys.ESCAPE)    回退键

    send_keys(Keys.ENTER)    回车键

    send_keys(Keys.CONTROL,'a')   全选

    send_keys(Keys.CONTROL,'c')  复制

    send_keys(Keys.CONTROL,'x')   剪贴

    send_keys(Keys.CONTROL,'v')   粘贴

    send_keys(Keys.F1)

    ...

    send_keys(Keys.F12)    F1-F12

    8.获得验证信息

    title, URL, text

    举例：

    now_url=driver.current_url 获取当前页面URL

    title=driver.title 获取当前页面title

    text前边已经提及到，不赘述

    （三）：浏览器控制2

    9.设置元素等待

    ①显式等待：WebDriverWait(driver,poll_fequency=0.5,ignored_exceptions=None)

    ②隐式等待：driver.implicitly_wait(time) time可自定义

    ③sleep休眠：sleep(time)  time可自定义

    10.定位一组元素

    在之前定位单个元素的element后加s

    find_elements_by_id();        

    find_elements_by_name();    

    find_elements_by_class_name();  

    find_elements_by_tag_name();      

    find_elements_by_link_text();      

    find_elements_by_partial_link_text();  

    find_elements_by_xpath();  

    find_elements_by_css_selector();

    11.多表单切换

    driver.swtich_to.frame()

    12.多窗口切换

    driver.switch_to.widow()  用于切换到相应的窗口

    current_window_handle  获取当前窗口句柄

    window_handles   返回所有窗口的句柄到当前会话

    13.警告框处理

    text：返回 alert/confirm/prompt中的文字信息

    accept(): 接受现有警告框

    dismiss(): 解散现有警告框

    send_keys(keysToSend): 发送文本至警告框

    14.上传文件

    普通上传：将本地文件的路径作为一个值放在input标签中，通过form表单将这个值提交给服务器

    插件上传：指基于Flash，JavaScript或Ajax等技术实现上传功能

    ①send_keys()

    如：

    from selenium import webdriver

    import os

    driver = webdriver.Chrome()

    file_path='file:///' + os.path.abspath('upfile.html')

    driver.get(file_path)

    #定位上传按钮，添加本地文件

    driver.find_element_by_name("file").send_keys('D:\\upload_file.txt')

    driver.quit()

    ②AutoIt实现上传  下载使用http://www.autoitscript.com/site/

    15.下载文件

    from selenium import webdriver

    import os

    fp=webdriver.Firefoxprofile()

    fp.set_preference("browser.download.folderList",2)#0是默认路径，2是指定路径

    fp.set_preference("browser.download.manager.showWhenStarting",False)#是否显示开始

    fp.set_preference("browser.download.dir",os.getcwd())#用于指定所下载的文件的目录

    fp.set_preference("browser.helperApps.neverAsk.saveToDisk","application/octet-stream")#下载文件的类型

    driver=webdriver.Firefox(firefox_profile=fp)

    driver.get("http://pypi.Python.org/pypi/selenium")

    driver.find_element_by_partial_link_text("selenium-2").click()

    16.操作Cookie

    WebDriver操作cookie的方法：

    get_cookies(): 获取所有的cookie信息

    get_cookie(name): 返回字典的key为“name”的cookie信息

    add_cookie(cookie_dict):添加cookie。cookie_dict为字典对象，必须有name，value值

    delete_cookie(name,optionsString):删除cookie信息

    delete_all_cookies():删除所有的cookie信息

    17.调用JavaScipt

    调整浏览器滚动条位置

    window.scrollTo(左边距，上边距)

    18.处理HTML5的视频播放

    load()，play(), pause()   加载，播放，暂停

    19.窗口截图

    driver.get_screenshot_as_file("D:\\xxxxx")#截取当前窗口，并指定截图图片的保存位置

    20.关闭窗口

    quit():退出相关程序和关闭所有窗口；

    close():关闭当前窗口

    21.验证码的处理

    ①去掉验证码

    ②设置万能验证码

    ③验证码识别技术

    ④记录cookie

    简单实战

    安装chromdriver.

    一个简单的自动化测试脚本，来体会一下什么是web UI自动化测试，以及元素的基本操作

    # #文件名称:test_baidu.py
# Function:打开百度网主页，在搜索栏输入“helloworld，

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
import time


driver = webdriver.Chrome()  # 打开Chrome浏览器
driver.get("https://www.baidu.com")  # 输入百度网址
print("============验证浏览器的基本控制=-=======")


def search():
    print("1、搜索helloworld.并回车......")
    time.sleep(2)
    driver.find_element_by_id("kw").send_keys("helloworld")  # 输入“helloworld”
    time.sleep(2)
    driver.find_element_by_id("kw").send_keys(Keys.ENTER)  # 回车进行搜索
    time.sleep(2)
    driver.maximize_window()  # 最大化当前窗


def windows_size():
    print("2、浏览器窗口大小缩小为640*480......")
    time.sleep(2)
    driver.set_window_size(640, 480)  # 控制浏览器显示尺寸为640*480
    time.sleep(0.5)
    driver.maximize_window()  # 最大化当前窗
    time.sleep(2)


def back_refresh():
    print("3、先进行浏览器后退，再次输入csdn进行搜索")
    driver.back()
    driver.find_element_by_id("kw").send_keys("csdn")  # 输入csdn
    time.sleep(1)
    driver.refresh()  # 刷新


def serach_clear():
    print("4、清空输入的内容......")
    driver.find_element_by_id("kw").send_keys("csdn")  # 输入csdn
    time.sleep(2)
    driver.find_element_by_id("kw").clear()
    time.sleep(0.5)


def csdn():
    print("5、进入csdn官网")
    driver.find_element_by_id("kw").send_keys("csdn")  # 输入csdn
    time.sleep(2)
    driver.find_element_by_id("kw").send_keys(Keys.ENTER)  # 回车进行搜索
    time.sleep(2)
    driver.find_element_by_xpath("//*[@id='1']/div/div[1]/h3/a[1]").click()
    time.sleep(2)
    windows = driver.window_handles
    driver.switch_to.window(windows[-1])
    now_url = driver.current_url
    m_get_url = "https://www.csdn.net/"
    if now_url == m_get_url:
        print("经过判断，已经进入csdn官网!!")
    else:
        print("未进入到csdn官网，请检查代码!")


search()
windows_size()
back_refresh()
serach_clear()
csdn()
driver.quit()  # 关闭浏览器

     

      问题：driver.find_element_by_xpathd的参数是怎么获取到的呢？

      ("//*[@id='1']/div/div[1]/h3/a[1]").click()

      获取路径：

      web UI自动化测试_css

      Web UI 自动化测试并不是一项简单的任务，但通过 Python 强大的生态系统，以及不断实践最佳实践，测试效率和质量都将显著提升。自动化不仅节省了时间，也为开发质量提供了更强有力的保障。

      用自动化测试解放双手，让代码成为你的“眼睛”，精准发现问题，助力产品品质跃升新高度！

       

       


      http://www.kler.cn/a/518626.html

      相关文章：

    • 【机器学习】深入探索SVM：支持向量机的原理与应用
    • vue3 vue2区别
    • 洛谷P1017 [NOIP2000 提高组] 进制转换
    • 系统架构设计师教材：信息系统及信息安全
    • C#设置winform窗体自动适应不同分辨率的电脑
    • Leetcode-两数相加
    • Math Reference Notes: 排列
    • 从 Web2 到 Web3：技术演进中的关键变革
    • MyBatis进阶
    • 解锁 Python 与 MySQL 交互密码：全方位技术解析与实战攻略
    • 数据统计–Excel报表(day12)2
    • CMake library path
    • 利用Kubespray安装生产环境的k8s集群-排错篇
    • uniapp封装websocket
    • tcp/ip协议通俗理解，tcpip协议通俗理解
    • 统计文本文件中单词频率的 Swift 与 Bash 实现详解
    • SpringBoot统一数据返回格式 统一异常处理
    • 填坑 hydra 暴力破解
    • 【开源免费】基于Vue和SpringBoot的常规应急物资管理系统（附论文）
    • pytest自动化测试 - 构造“预置条件”的几种方式
    • RAG如何让生成AI更智能？最新方法与优劣深度解析
    • 【linux】linux c判断IP地址类型及是否合法
    • Spring MVC中HandlerInterceptor的作用及应用场景
    • CVE-2025-0411 7-zip 漏洞复现
    • 防抖与节流：优化高频事件的两种利器
    • 「pandas」python pandas 初步、数据结构Series、DataFrame、MultiIndex