用户端Web自动化测试_L4

目录：

  1. selenium多浏览器处理
  2. 执行 javascript 脚本
  3. headless无头浏览器使用
  4. capability配置参数解析
  5. 企业微信实战
  6. cypress测试框架介绍
  7. Playwright测试框架介绍

1.selenium多浏览器处理

多浏览器测试背景

  • 用户使用的浏览器(firefox,chrome,IE 等)
  • web 应用应该能在任何浏览器上正常的工作，这样能吸引更多的用户来使用

 

多浏览器测试概述

  • 是跨不同浏览器组合验证网站或 web 应用程序功能的过程
  • 是兼容性测试的一个分支，用于保持功能和质量的一致性
  • 适用于面向客户的网站和组织内部使用的站点

 多浏览器的实现方案

PlantUML diagram

pytest hook 函数

  • pytest_addoption 添加命令行参数组/命令行参数
  • pytest_configure 解析命令行选项，每个插件都会用到这个hook函数

 pytest_addoption 与 pytest_configure

  • pytest_addoption：
    1. parser.getgroup 创建/获取组名
    2. addoption 添加一个命令行选项
  • pytest_configure:
    1. 通过config 对象的getoption()方法获取命令行参数
    2. 将命令行获取到的内容赋值给变量

代码示例：

def pytest_addoption(parser: Parser):hdc = parser.getgroup("hdc")hdc.addoption("--browser")

 运行结果：

 

代码示例：

conftest.py

from _pytest.config.argparsing import Parserdef pytest_collection_modifyitems(session, config, items: list):print(items)for item in items:item.name = item.name.encode('utf-8').decode('unicode-escape')item._nodeid = item.nodeid.encode('utf-8').decode('unicode-escape')def pytest_addoption(parser:Parser):# group 将下面所有的 option都展示在这个group下。mygroup = parser.getgroup("hdc")# 注册一个命令行选项mygroup.addoption("--browser",# 参数的默认值default='Chrome',# 存储的变量(起别名)dest='wo_shi_bie_ming',# 参数的描述信息help='set your browser,such as：Chrome, Firefox, Headless...')global_env = {}def pytest_configure(config):#使用别名browser = config.getoption("wo_shi_bie_ming", default='Chrome')# browser = config.getoption("--browser", default='Chrome')print(f"通过命令行获取的浏览器为{browser}")tmp = {"browser": browser}global_env.update(tmp)

 test_demo.py

import time
from selenium import webdriver
from web_automation_testing.test_multi_brower.conftest import global_envclass TestSearch:def setup_class(self):self.browser = global_env.get("browser")if self.browser == 'firefox':self.driver = webdriver.Firefox()else:self.driver = webdriver.Chrome()self.driver.maximize_window()self.driver.implicitly_wait(3)def teardown_class(self):self.driver.quit()def test_get(self):self.driver.get("https://www.baidu.com/")time.sleep(2)assert True

运行结果：

  

2.执行 javascript 脚本

JavaScript简介

  • JavaScript 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言
  • 可以嵌入到HTML页面对浏览器事件做出响应
  • 也可以基于Node.js技术进行服务器端编程

自动化测试中使用JavaScript脚本

使用场景：部分场景使用selenium原生方法无法解决

  • 修改时间控件
  • 滚动到某个元素
  • 其他场景

JavaScript 使用思路

  1. 页面调试 js 脚本
  2. Selenium执行js

JavaScript调试方法

  1. 进入 console 调试
  2. js 脚本如果有返回值则会在浏览器返回

JS 脚本-元素操作

  • 通过 css 查找元素
    • 点击元素（对应click）
    • input标签对应的值(对应send_keys)
    • 元素的类属性
    • 元素的文本属性
// 百度首页：https://www.baidu.com/
// 修改属性值
document.querySelector("#kw").value = "邯郸学院"
// 点击操作
document.querySelector("#su").click()// 淘宝首页： https://www.taobao.com/ 
// 修改元素的类属性
document.querySelector("#J_SiteNavMytaobao").className
="site-nav-menu site-nav-mytaobao site-nav-multi-menu J_MultiMenu site-nav-menu-hover"// 测试人首页：https://ceshiren.com/
// 获取元素内的文本信息
document.querySelector("#ember63").innerText

JS脚本滚动操作

  • 页面滚动到底部
  • 指定到滚动的位置
document.documentElement.scrollTop=10000 
document.querySelector('css表达式').scrollIntoView();

Selenium执行js

  • Selenium执行js
    • 调用执行js方法
    • 在 js 语句中添加 return：代码可以获取js的执行结果
    • 结合 find_element 方法

 代码示例：

from time import sleep
from selenium import webdriver
from selenium.webdriver.common.by import Bydef test_select_down():driver = webdriver.Chrome()driver.implicitly_wait(3)driver.maximize_window()# 打开网址driver.get("https://www.taobao.com/")# 修改下拉框属性sleep(1)driver.execute_script('document.querySelector("#J_SiteNavMytaobao").''className="site-nav-menu site-nav-mytaobao ''site-nav-multi-menu J_MultiMenu ''site-nav-menu-hover"')driver.find_element(By.XPATH, "//*[text()='已买到的宝贝']").click()sleep(5)driver.quit()def test_data_time():# 打开网址driver = webdriver.Chrome()driver.implicitly_wait(3)driver.maximize_window()driver.get("https://www.12306.cn/index/")sleep(1)# 修改出发日期driver.execute_script('document.querySelector("#train_date").value="2022-12-22"')sleep(1)# 打印出发日期， 返回值的使用train_data = driver.execute_script('return document.querySelector("#train_date").value')print(train_data)sleep(3)

3.headless无头浏览器使用

  • 是一个配置浏览器启动的选项类，用于自定义和配置Driver会话
  • 常见使用场景：
    • 设置无头模式:不会显示调用浏览器，避免人为干扰的问题。
    • 设置调试模式:调试自动化测试代码（浏览器复用）
    • https://sites.google.com/a/chromium.org/chromedriver/capabilities

 添加启动配置(arguments)-Python版本

  • 无头模式： --headless
  • 窗体最大化 start-maximized
  • 指定浏览器分辨率 window-size=1920x3000
from selenium import webdriver
from selenium.webdriver.common.by import Bydef test_chrome_pref():options = webdriver.ChromeOptions()# 无头模式options.add_argument('--headless')# 窗体最大化options.add_argument('start-maximized')# 指定浏览器分辨率options.add_argument('window-size=1920x3000')driver = webdriver.Chrome(chrome_options=options)# 打开测试人页面driver.get("https://ceshiren.com/")# 点击登录login_button_text = driver.find_element(By.CSS_SELECTOR, ".login-button").textprint(login_button_text)driver.quit()

4.capability配置参数解析

capability概述

  • Capabilities是WebDriver支持的标准命令之外的扩展命令(配置信息)
  • 配置web驱动的属性，如浏览器名称、浏览器平台等。
  • 结合Selenium Grid完成分布式、兼容性等测试
  • 官网地址： https://www.selenium.dev/zh-cn/documentation/webdriver/capabilities/shared/

Selenium Grid

  • Selenium Grid 允许我们在多台机器上并行运行测试，并集中管理不同的浏览器版本和浏览器配置（而不是在每个单独的测试中）。

  • 官网地址：https://www.selenium.dev/documentation/grid/

PlantUML diagram

 演示环境：https://selenium-node.hogwarts.ceshiren.com/ui#

  1. 保证本地可以正常调通
  2. 实例化Remote()类并添加相应的配置
    • 远程地址
    • 设备配置

 代码示例：

import time
from selenium import webdriver
from selenium.webdriver.common.by import Bydef test_capabilitie1():# 切换成 windows 就会报错capabilities = {"browserName":"chrome","platformName":"windows"}# 通过 desired_capabilities 添加配置信息driver = webdriver.Chrome(desired_capabilities=capabilities)driver.implicitly_wait(5)driver.get("https://ceshiren.com/")text = driver.find_element(By.CSS_SELECTOR, ".login-button").textprint(text)time.sleep(30)driver.quit()def test_capabilitie2():hogwarts_grid_url = "https://selenium-node.hogwarts.ceshiren.com/wd/hub"capabilities = {"browserName":"chrome","browserVersion":"101.0"}# 配置信息# 实例化Remote，获取可以远程控制的driver实例对象# 通过 command_executor 配置selenium hub地址# 通过 desired_capabilities 添加配置信息driver = webdriver.Remote(command_executor=hogwarts_grid_url,desired_capabilities=capabilities)driver.implicitly_wait(5)driver.get("https://ceshiren.com/")text = driver.find_element(By.CSS_SELECTOR, ".login-button").textprint(text)time.sleep(3)driver.quit()

5.企业微信实战

6.cypress测试框架介绍

cypress简介

  • 基于 JavaScript 的前端测试工具
  • 可以对浏览器中运行的任何内容进行快速、简单、可靠的测试
  • 对每一步操作都支持回看
  • 覆盖了测试金字塔模型的所有测试类型【界面测试，集成测试，单元测试】
  • 底层协议不采用 WebDriver > Cypress官网：https://www.cypress.io/

cypress与selenium对比

项目CypressSelenium
支持语言JavascriptJava, Python, Javascript, Ruby, C#等
支持浏览器Chrome、Electron各种主流浏览器
主要使用者前端开发人员QA
使用的测试框架Mocha无限制
是否需要浏览器驱动器否需要
测试速度快略慢
录制测试视频、快照支持支持，但需要写代码
社区支持略显薄弱强大

 cypress环境部署

  • 安装node.js 官网地址：https://nodejs.org/zh-cn/
  • 安装cypress
    • 初始化项目：npm init
    • 配置淘宝镜像：npm config set registry http://registry.npm.taobao.org
    • 安装cypress：npm install cypress --save-dev
  • 打开cypress
    • npx cypress open

cypress基本用法

  • describe 声明一个测试用例集合
  • beforeEach 测试用例前置操作，相当于setup
  • it 声明一个测试用例
  • cy.get 定位元素，用css定位
  • type 输入文本
  • click 点击操作
  • should 断言

使用vscode装一下插件： 

 

 

npm init

npm install cypress –-save-dev

7.Playwright测试框架介绍

Playwright 简介

  • Playwright 官网：https://playwright.dev/python/docs/intro
  • Web 自动化测试框架。
  • 跨平台多语言支持。
  • 支持 Chromium、Firefox、WebKit 等主流浏览器自动化操作。

 Playwright 的优点

  • 支持所有流行的浏览器。
  • 速度更快，更可靠的执行。
  • 更强大的自动化测试配置。
  • 强大的工具库：Codegen、Playwright inspector、Trace Viewer。

Playwright 原理

 

Playwright 与 selenium 对比

项目PlaywrightSelenium
是否需要驱动否需要对应浏览器 webdriver
支持语言Java, Python, JavascriptJava, Python, Javascript, Ruby, C#等
支持浏览器Chrome、Firefox 等Chrome、Firefox 等
通讯方式websocket 双向通讯协议http 单向通讯协议
使用的测试框架无限制(pytest,unittest)无限制(pytest,unittest)
测试速度快慢
录制测试视频、快照支持支持
社区支持微软thoughtworks 公司

 Playwright 核心工具

  • Codegen：通过记录你的操作来生成测试。 将它们保存为任何语言。
  • Playwright inspector： 检查页面、生成选择器、逐步执行测试、查看点击点、探索执行日志。
  • Trace Viewer：捕获所有信息以调查测试失败。 Playwright 跟踪包含测试执行截屏、实时 DOM 快照、动作资源管理器、测试源等等。

Playwright 环境安装

  • 安装 playwright 插件
    • pip install pytest-playwright
  • 安装所需的浏览器
    • playwright install
  •  官网介绍：https://playwright.dev/python/docs/intro

 Codegen

# 设定展示窗口大小
playwright codegen --viewport-size=800,600 地址
# 指定设备
playwright codegen --device="iPhone 11" 地址
  • 其他参数：https://playwright.dev/python/docs/codegen

  

 Codegen-保存登录状态

  • 场景：单点登录、验证码问题
# 保存登录状态
playwright codegen --save-storage=auth.json
# 加载认证信息
playwright codegen --load-storage=auth.json 地址

 Playwright 常用API  Actions | Playwright Python

常用API含义
start()实例化playwright
chromium().launch()打开chrome浏览器
new_page()打开一个窗口页面
page.goto()跳转到某个地址
page.locator(““)定位某个元素
click()点击元素
fill()输入内容
keyboard().down()键盘事件
screenshot()截图操作

Playwright 使用实例

from playwright.sync_api import sync_playwright, expectdef test_playwright():# 实例化playwrightplaywright = sync_playwright().start()# 打开chrome浏览器,headless默认是True,无头模式,这里设置为False方便查看效果browser = playwright.chromium.launch(headless=False)# 打开一个窗口页面page = browser.new_page()# 在当前窗口页面打开测试人网站page.goto("https://ceshiren.com/")# 定位搜索按钮并点击page.locator("#search-button").click()# 定位搜索框并输入web自动化page.locator("#search-term").fill("web自动化")# 使用keyboard.down模拟键盘的enter事件page.keyboard.down("Enter")# 断言搜索结果result = page.locator(".list>li:nth-child(1) .topic-title>span")expect(result).to_contain_text("自动化")# 截图page.screenshot(path='./datas/screenshot/screenshot.png')# 用例完成后先关闭浏览器browser.close()# 然后关闭playwright服务playwright.stop()

Trace Viewer 简介 Trace viewer | Playwright Python

Trace Viewer 使用

from playwright.sync_api import sync_playwright, expectdef test_playwirght_trace():# 实例化一个playwright对象playwright = sync_playwright().start()# 启动谷歌浏览器，模式使用无头模式browser = playwright.chromium.launch(headless=False)# =========== trace 的配置# 1. 生成 一个 context 实例context = browser.new_context()# 2. 添加 trace 的配置信息context.tracing.start(screenshots=True, snapshots=True, sources=True)# 3. 使用填加了trace 配置的 context 实例，去实例化一个page对象page = context.new_page()# 跳转到ceshiren页面page.goto("https://ceshiren.com/")# 点击搜索按钮， 输入css定位page.locator("#search-button").click()# 输入搜索的内容， 输入css定位page.locator("#search-term").fill("appium")# 按下回车键page.keyboard.down("Enter")# time.sleep(3)result = page.locator(".results .item:nth-child(1) .topic-title")expect(result).to_contain_text("appium")# 4. 在关闭浏览器之前，一定要结束tracecontext.tracing.stop(path="./datas/playwirght_trace.zip")browser.close()
  •  # 打开trace  playwright show-trace trace.zip

 

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.hqwc.cn/news/83973.html

如若内容造成侵权/违法违规/事实不符，请联系编程知识网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

开源的经济影响：商业与社区的平衡

开源的经济影响：商业与社区的平衡

🌷🍁 博主猫头虎 带您 Go to New World.✨🍁 🦄 博客首页——猫头虎的博客🎐 🐳《面试题大全专栏》 文章图文并茂🦕生动形象🦖简单易学！欢迎大家来踩踩~🌺 &a…
阅读更多...
NPM 为自己创建的组织付费

NPM 为自己创建的组织付费

目录 1、升级为付费组织计划 2、查看、下载和通过电子邮件发送组织的收据 2.1 查看数据 3、更新组织账单设置 3.1 更新信用卡信息 3.2 更新帐单收据电子邮件和额外收据信息 4、降级为免费组织 1、升级为付费组织计划 作为组织所有者，您可以将免费组织计划升级…
阅读更多...
Mac安装Docker

Mac安装Docker

简简单单 目录 前言 一、安装步骤 提示：以下是本篇文章正文内容，下面案例可供参考 一、安装步骤 第一种方式，直接去官网去下载 Docker官网 下载我勾出来的那个版本 针对于M1，M2用户 下载完之后 安装拖入Application中 打开…
阅读更多...
【线程池】ThreadPoolExecutor的使用示例

【线程池】ThreadPoolExecutor的使用示例

文章目录 通过ThreadPoolExecutor创建线程池。线程的处理结果如何获取？ 通过ThreadPoolExecutor创建线程池。 ThreadPoolExecutor构造方法参数： int corePoolSize //核心线程数量int maximumPoolSize//最大线程数long keepAliveTime//当线程数大于核心…
阅读更多...
ChatGPT在高等教育中的应用利弊探讨

ChatGPT在高等教育中的应用利弊探讨

​人工智能在教育领域的应用日益广泛。2022年11月OpenAI开发的聊天机器人ChatGPT在全球范围内流传开来，其中用户数量最多的国家是美国(15.22%)。由于ChatGPT应用广泛，具有类似人类回答问题的能力，它正在成为许多学生和教育工作者的可信赖伙伴…
阅读更多...
指针-C语言（初阶）

指针-C语言（初阶）

目录 一、什么是指针 二、指针和指针类型 2.1 指针-整数 2.2 指针的解引用 三、野指针 3.1 野指针形成原因 3.2 如何规避野指针 四、指针运算 4.1 指针-整数 4.2 指针-指针 4.3 指针的关系运算 五、指针和数组 六、二级指针 七、指针数组 一、什么是指针 指针是内存中一个…
阅读更多...
Little Kernel代码学习笔记

Little Kernel代码学习笔记

目录 虚拟地址转换为物理地址内核启动Multiboot头部结构启动时的寄存器状态real_start段选择子初始化BSS段 页表转换设置CR4、CR3、EFER寄存器设置页表映射 初始化IDT，执行lk_main 虚拟地址转换为物理地址 // start.S#define PHYS_LOAD_ADDRESS (MEMBASE KERNEL_L…
阅读更多...
RabbitMQ---订阅模型-Direct

RabbitMQ---订阅模型-Direct

1、 订阅模型-Direct • 有选择性的接收消息 • 在订阅模式中，生产者发布消息，所有消费者都可以获取所有消息。 • 在路由模式中，我们将添加一个功能 - 我们将只能订阅一部分消息。 例如，我们只能将重要的错误消息引导到日志文件…
阅读更多...
华为云开发工具CodeArts IDE for C/C++ 开发使用指南

华为云开发工具CodeArts IDE for C/C++ 开发使用指南

简介 CodeArts IDE是一个集成开发环境（IDE），它提供了开发语言和调试服务。本文主要介绍CodeArts IDE for C/C的基本功能。 1.下载安装 CodeArts IDE for C/C 已开放公测，下载获取免费体验 2.新建C/C工程 CodeArts IDE for C/…
阅读更多...
多维时序 | Matlab实现LSTM-Adaboost和LSTM多变量时间序列预测对比

多维时序 | Matlab实现LSTM-Adaboost和LSTM多变量时间序列预测对比

多维时序 | Matlab实现LSTM-Adaboost和LSTM多变量时间序列预测对比 目录 多维时序 | Matlab实现LSTM-Adaboost和LSTM多变量时间序列预测对比预测效果基本介绍模型描述程序设计参考资料 预测效果 基本介绍 多维时序 | Matlab实现LSTM-Adaboost和LSTM多变量时间序列预测对比 模型…
阅读更多...
C++：命名空间，缺省参数，函数重载，引用，内联函数

C++：命名空间，缺省参数，函数重载，引用，内联函数

个人主页 ： 个人主页 个人专栏 ： 《数据结构》 《C语言》《C》 文章目录 前言一、命名空间命名空间的定义命名空间的使用 二、缺省参数缺省参数概念缺省参数分类 三、函数重载函数重载的概念 四、引用引用的概念引用特性引用的使用场景引用与指针的区别 …
阅读更多...
stm32之15.超声波与灯光功能一起实现（进阶）

stm32之15.超声波与灯光功能一起实现（进阶）

主函数代码修改 --------------------- 源码 int main(void) {uint32_t t0;uint32_t distance;NVIC_PriorityGroupConfig(NVIC_PriorityGroup_4);led_init();key_init();/* 初始化串口1波特率为115200bps，若发送/接收数据有乱码，请检查PLL */usart1_ini…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023