用户端Web自动化测试_L4

news2024/12/23 11:49:22

目录：

  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 Parser


def 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_env


class 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 By


def 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 By


def 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").text
    print(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 By


def 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").text
    print(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").text
    print(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, expect


def test_playwright():
    # 实例化playwright
    playwright = 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, expect


def 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. 在关闭浏览器之前，一定要结束trace
    context.tracing.stop(path="./datas/playwirght_trace.zip")
    browser.close()
  •  # 打开trace  playwright show-trace trace.zip

 

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

*如何筛选关键词*

*如何筛选关键词*

*第一步：打开百度，搜索百度指数* *第二步 输入所选择产品的品类* *第三步 找到搜索热度的关键词* *第四步 第一个需要统计的关键词，搜索热度前五的关键词* 建立EXCEL表，写好日期，格式按照 20230206 那一天写得按照这个…
阅读更多...
【算法专题突破】双指针 - 复写零（2）

【算法专题突破】双指针 - 复写零（2）

目录 1. 题目解析 2. 算法原理 3. 代码编写 写在最后： 1. 题目解析 题目链接：1089. 复写零 - 力扣（Leetcode） 我先来读题， 题目的意思非常的简单，其实就是， 遇到 0 就复制一个写进数组&a…
阅读更多...
mongodb 添加加点 stateStr 停在 STARTUP

mongodb 添加加点 stateStr 停在 STARTUP

解决办法 PRIMARY 节点是的host 是否是内网IP，如果是内网IP 需要切换成外网IP 即可；
阅读更多...
ARM开发，stm32mp157a-A7核中断实验（实现按键中断功能）

ARM开发，stm32mp157a-A7核中断实验（实现按键中断功能）

1.实验目的：实现KEY1/LEY2/KE3三个按键，中断触发打印一句话，并且灯的状态取反； key1 ----> LED3灯状态取反； key2 ----> LED2灯状态取反； key3 ----> LED1灯状态取反； 2.分析框图: …
阅读更多...
STL-常用容器-Vector容器（数组）

STL-常用容器-Vector容器（数组）

1 vector基本概念 功能： vector数据结构和数组非常相似，也称为单端数组 vector与普通数组区别： 不同之处在于数组是静态空间，而vector可以动态扩展 动态扩展： 并不是在原空间之后续接新空间，而是找更大…
阅读更多...
谷歌面试-扔鸡蛋

谷歌面试-扔鸡蛋

今天想跟大家分享一个有意思的面试题，这让我再一次感叹思维的奇妙，接下来我们一起看看吧~ 首先来看看题目： 你有2颗鸡蛋，需要以最少的尝试次数来判断在100层的高楼上，哪一层楼是鸡蛋的安全层。 换句话说&#xff0c…
阅读更多...
如何在地图上寻找最密集点的位置？

如何在地图上寻找最密集点的位置？

最近我在工作中遇到了一个小的需求点，大概是需要在地图上展示出一堆点中的点密度最密集的位置。最开始没想到好的方法，就使用了一个非常简单的策略——所有点的坐标求平均值，这个方法大部分的时候好用，因为大部分城市所有点位基本…
阅读更多...
深度学习6：自然语言处理-Natural language processing | NLP

深度学习6：自然语言处理-Natural language processing | NLP

目录 NLP 为什么重要？ 什么是自然语言处理 – NLP NLP 的2大核心任务 自然语言理解 – NLU|NLI 自然语言生成 – NLG NLP(自然语言处理) 的5个难点 NLP 的4个典型应用 NLP 的 2 种途径、3 个核心步骤 总结 自然语言处理 NLP 为什么重要？ “语言…
阅读更多...
React入门 组件学习笔记

React入门 组件学习笔记

项目页面以组件形式层层搭起来，组件提高复用性，可维护性 目录 一、函数组件 二、类组件 三、 组件的事件绑定 四、获取事件对象 五、事件绑定传递额外参数 六、组件状态 初始化状态 读取状态 修改状态 七、组件-状态修改counter案例 八、this问…
阅读更多...
4.16 TCP 协议有什么缺陷？

4.16 TCP 协议有什么缺陷？

目录 升级 TCP 的工作很困难 TCP 建立连接的延迟 TCP 存在队头阻塞问题 网络迁移需要重新建立 TCP 连接 升级 TCP 的工作很困难；TCP 建立连接的延迟；TCP 存在队头阻塞问题；网络迁移需要重新建立 TCP 连接； 升级 TCP 的工作很…
阅读更多...
Docker（md版）

Docker（md版）

Docker 一、Docker二、更换apt源三、docker搭建四、停启管理五、配置加速器5.1、方法一5.2、方法二 六、使用docker运行漏洞靶场1、拉取tomcat8镜像2、拉取成功3、开启服务4、查看kali的IP地址5、访问靶场6、关闭漏洞靶场 七、vulapps靶场搭建 一、Docker Docker是一个开源的应…
阅读更多...
Pushmall 推熵共享电商平台 - 共享链盟

Pushmall 推熵共享电商平台 - 共享链盟

Pushmall 推熵共享电商平台 - 共享链盟以 Pushmall 推熵 B2B/B2C 批零采销订货商城系统为基础，以‘平台自营、供应商入驻、商家自营 商圈链盟 共享会员制，实现 S2B2B2C 商业模式’，是一款为实体商家服务的电商营销推广平台。以 “共创、共生…
阅读更多...
算法笔记：球树

算法笔记：球树

1 KD树的问题 算法笔记：KD树_UQI-LIUWJ的博客-CSDN博客 在kd树中，导致性能下降的最核心因素是因为kd-tree中被分割的子空间是一个个的超方体，而求最近邻时使用的是欧式距离（超球）。超方体与超球体相交的可能性是极高…
阅读更多...
MTK6833_MT6833核心板_天玑700安卓5G核心板规格性能介绍

MTK6833_MT6833核心板_天玑700安卓5G核心板规格性能介绍

MTK6833安卓核心板采用台积电 7nm 制程的5G SoC，2*Cortex-A766*Cortex-A55架构，搭载Android12.0操作系统，主频最高达2.2GHz 。内置 5G 双载波聚合技术（2CC）及双 5G SIM 卡功能，实现优异的功耗表现及实时连网…
阅读更多...
基于MATLAB的径向基函数插值（RBF插值）（一维、二维、三维）

基于MATLAB的径向基函数插值（RBF插值）（一维、二维、三维）

基于MATLAB的径向基函数插值（RBF插值）（一维、二维、三维） 0 前言1 RBF思路2 1维RBF函数2.1 参数说明2.1.1 核函数选择2.1.2 作用半径2.1.3 多项式拟合2.1.4 误差项（光滑项） 3 2维RBF函数4 3维RBF函数 惯例声…
阅读更多...
【头歌】构建哈夫曼树及编码

【头歌】构建哈夫曼树及编码

构建哈夫曼树及编码 第1关：构建哈夫曼树 任务描述 本关任务：构建哈夫曼树，从键盘读入字符个数n及这n个字符出现的频率即权值，构造带权路径最短的最优二叉树（哈夫曼树）。 相关知识 哈夫曼树的定义 设二叉树具有n个带权值的叶子结点{w1,w2,...,wn}，从根结点到每个叶…
阅读更多...
解决MyBatis不能将表中含有下划线的字段映射到实体属性的两种方案

解决MyBatis不能将表中含有下划线的字段映射到实体属性的两种方案

版权声明 本文原创作者：谷哥的小弟作者博客地址：http://blog.csdn.net/lfdfhl 问题描述 MyBatis不能准确地将表中含有下划线的字段映射到实体属性。例如：表中的列名为：user_name，实体类中的属性为：userNa…
阅读更多...
深度学习5：长短期记忆网络 – Long short-term memory | LSTM

深度学习5：长短期记忆网络 – Long short-term memory | LSTM

目录 什么是 LSTM？ LSTM的核心思路 什么是 LSTM？ 长短期记忆网络——通常被称为 LSTM，是一种特殊的RNN，能够学习长期依赖性。由 Hochreiter 和 Schmidhuber（1997）提出的，并且在接下来的工作中…
阅读更多...
《C和指针》笔记10:作用域

《C和指针》笔记10:作用域

结合上面的例子讲解C语言的作用域。 1. 代码块作用域 (block scope) 位于一对花括号之间的所有语句称为一个代码块。任何在代码块的开始位置声明的标识符都具有代码块作用域 (block scope)，表示它们可以被这个代码块中的所有语句访问。上图中标识为6、7、9、10的变…
阅读更多...
2000-2021年地级市产业升级、产业结构高级化面板数据

2000-2021年地级市产业升级、产业结构高级化面板数据

2000-2021年地级市产业升级、产业结构高级化面板数据 1、时间：2000-2021年 2、范围：地级市 3、指标：年份、地区、行政区划代码、地区、所属省份、地区生产总值、第一产业增加值、第二产业增加值、第三产业增加值、第一产业占GDP比重、第二…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023