使用Selenium与Chrome DevTools交互

news2024/10/7 10:15:05

目录

为什么我们应该自动化Chrome开发工具？

如何打开Chrome DevTools

元素

控制台

源代码

网络

应用

安全

性能

如何使用Selenium使用chrome Devtools实现自动化？

收集性能指标

使用Selenium DevTols捕获控制台日志

模拟位置

网络节流

捕获网络请求和响应

获取网络请求

获取网络响应

开发人员工具是调试和分析网页的强大工具，许多现代浏览器都为其提供内置支持。它允许开发人员检查元素、调试JavaScript和分析网络活动。这篇文章将讨论Selenium如何与Chrome DevTools一起用于自动化任务和测试网页。

为什么我们应该自动化Chrome开发工具？

使用Selenium与Chrome DevTools交互是增强web测试功能和提高测试自动化覆盖率的强大方法。
DevTools是Google Chrome浏览器中内置的一组网络开发工具，Selenium是一种流行的开源自动化工具，使我们能够自动化网络浏览器。通过将两者结合起来，我们可以自动化各种测试任务，如性能测试、网络分析等。
有了Selenium，我们可以自动化Chrome DevTools来执行各种操作，例如拦截网络请求、模拟不同的地理位置和捕获控制台日志。这使我们能够快速识别和修复web应用程序中的问题。通过将Selenium和Chrome DevTools结合使用，我们可以改进您的网络测试工作流程，并确保网站为用户提供最佳性能。

如何打开Chrome DevTools

我们可以通过右键单击网页并选择“检查”选项来打开开发工具。

点击“检查”选项将打开开发人员工具，在那里你会看到许多选项卡，如元素、控制台、网络等。

Chrome Developer tools

以下是一些选项卡的列表——

  • 元素
  • 控制台
  • 源代码
  • 网络
  • 应用
  • 安全
  • 性能

还有其他选项卡，但通常上面的选项卡比其他选项卡使用得更频繁。让我们简单地描述一下它们，然后我们将学习将硒与chrome devtools一起使用。

元素

 Elements选项卡显示用于构建网页的HTML和CSS以及内联javascript代码。我们可以更改HTML代码或任何CSS来检查页面的外观。

控制台

控制台选项卡提供了一种查看页面上的JavaScript代码并与之交互的方式。

源代码

“源代码”选项卡显示用于组成网页的所有文件。它采用了一个调试器功能，可以用来调试Javascript代码。

网络

“网络”选项卡允许您查看和分析网页的网络活动。它提供了有关页面资源的信息，包括文件大小、加载时间和请求头。

应用

它可以深入了解浏览器上网页存储的数据，如存储在本地存储中的cookie和索引数据库数据。

安全

“安全性”选项卡提供有关网页基本安全性的信息。我们可以查看网站的证书或它提供的连接（是否安全）

性能

此选项卡可用于分析网页的性能，并确定可能影响其速度的瓶颈。现在，让我们看看如何使用Selenium实现chrome开发工具的自动化。

如何使用Selenium使用chrome Devtools实现自动化？

Selenium 4引入了DevTools API来与chrome开发工具交互。
注：我们使用的是selenium 4.8.0和chrome版本109。
首先，我们将使用DevTools创建一个会话

ChromeDriver driver = new ChromeDriver();
 
DevTools devTools = driver.getDevTools();
devTools.createSession();

现在，让我们与devtools交互以获取一些信息。我们来看看一些常用的。

  • 收集性能指标
  • 捕获控制台日志
  • 模拟位置
  • 网络节流
  • 捕获网络呼叫请求和响应

收集性能指标

我们可以使用Performance.enable（Optional.empty（））启用收集和报告度量，然后使用Performance.getMetrics（）获取度量信息。
Performance.getMetrics（）返回一个Metric对象列表，然后我们可以对其进行迭代以获取有关每个性能度量的信息。
让我们试着获取make my travel网站的性能指标。

import java.util.List;
import java.util.Optional;
 
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v109.performance.Performance;
import org.openqa.selenium.devtools.v109.performance.model.Metric;
 
public class CodekruTest {
 
    public static void main(String[] args) {
 
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
        ChromeDriver driver = new ChromeDriver();
 
        DevTools devTools = driver.getDevTools();
        devTools.createSession();
         
        devTools.send(Performance.enable(Optional.empty()));
        List<Metric> metricList = devTools.send(Performance.getMetrics());
 
        driver.get("https://www.makemytrip.com");
 
        for (Metric m : metricList) {
            System.out.println(m.getName() + " = " + m.getValue());
        }
 
    }
 
}

输出:

Timestamp = 1608.660693
AudioHandlers = 0
Documents = 2
Frames = 1
JSEventListeners = 0
LayoutObjects = 6
MediaKeySessions = 0
MediaKeys = 0
Nodes = 8
Resources = 0
ContextLifecycleStateObservers = 2
V8PerContextDatas = 1
WorkerGlobalScopes = 0
UACSSResources = 0
RTCPeerConnections = 0
ResourceFetchers = 2
AdSubframes = 0
DetachedScriptStates = 0
ArrayBufferContents = 0
LayoutCount = 0
RecalcStyleCount = 0
LayoutDuration = 0
RecalcStyleDuration = 0
DevToolsCommandDuration = 1.7E-5
ScriptDuration = 0
V8CompileDuration = 0
TaskDuration = 2.4E-5
TaskOtherDuration = 7.0E-6
ThreadTime = 6.8E-5
ProcessTime = 0.03125
JSHeapUsedSize = 877696
JSHeapTotalSize = 1896448
FirstMeaningfulPaint = 0
DomContentLoaded = 1608.340013
NavigationStart = 1608.062498

您的输出结果可能与我们的结果不同。这是为了展示我们如何使用硒来获得任何网页的性能指标。

使用Selenium DevTols捕获控制台日志

开发人员工具的控制台选项卡通常显示一些有用的信息，这些信息可用于调试或分析网页问题。我们现在将使用硒来获得这些信息。
Log.Enable（）命令启用日志，并通过entryAdded通知将迄今为止收集的条目发送到客户端。我们可以添加一个侦听器来侦听entryAdded通知，并根据我们的需求获取所需的信息。

devTools.send(Log.enable());
devTools.addListener(Log.entryAdded(),  logEntry -> {
                 System.out.println("log: "+logEntry.getText());
                 System.out.println("level: "+logEntry.getLevel());
                  System.out.println("source: "+logEntry.getSource());
             });
  • getText（）方法获取为特定日志显示的文本。
  • getLevel（）方法返回日志的级别。允许的值包括verbose、info、warning和error。
  • getSource（）获取错误的来源。它可以是以下其中之一——xml、javascript、网络、存储、appcache、呈现、安全、弃用、worker、违规、干预、推荐、其他

我们将使用“http://the-internet.herokuapp.com/broken_images“URL，它抛出了一些错误，如下图所示。

console logs in developer tools

现在，我们将使用selenium DevTools API获取控制台日志。 

import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v109.log.Log;
 
public class CodekruTest {
 
    public static void main(String[] args) {
 
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
         
        ChromeDriver driver = new ChromeDriver();
 
        DevTools devTools = driver.getDevTools();
        devTools.createSession();
 
        devTools.send(Log.enable());
        devTools.addListener(Log.entryAdded(),
                                   logEntry -> {
                                       System.out.println("log: "+logEntry.getText());
                                       System.out.println("level: "+logEntry.getLevel());
                                       System.out.println("source: "+logEntry.getSource());
                                   });
        driver.get("http://the-internet.herokuapp.com/broken_images");
 
 
    }
 
}

输出：

log: Failed to load resource: the server responded with a status of 404 (Not Found)
level: error
source: network
log: Failed to load resource: the server responded with a status of 404 (Not Found)
level: error
source: network
log: Failed to load resource: net::ERR_NAME_NOT_RESOLVED
level: error
source: network

注意：我们也可以在不使用开发工具的情况下获取控制台日志，我们已经为这些工具写了另一篇文章。请阅读这篇文章，以了解有关在不使用DevTools API的情况下使用selenium获取控制台日志的更多信息（文章链接–如何在selenium Java中捕获控制台日志？）。

模拟位置

作为测试人员，有时我们必须在多个地区测试我们的UI应用程序。selenium中的DevTools API帮助我们设置运行测试用例场景的位置。
Emulation.setGeolocationOverride（）有助于模拟地理定位，它接受三个参数——纬度、经度和精度。

// mumbai location
double latitude = 19.0760;
double longitude = 72.8777;
 
devTools.send(Emulation.setGeolocationOverride(Optional.of(latitude), Optional.of(longitude), Optional.of(1)));

以下是完整代码

import java.util.Optional;
 
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v109.emulation.Emulation;
 
public class CodekruTest {
 
    public static void main(String[] args) {
 
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
        ChromeDriver driver = new ChromeDriver();
 
        DevTools devTools = driver.getDevTools();
        devTools.createSession();
 
        // mumbai location
        double latitude = 19.0760;
        double longitude = 72.8777;
 
        devTools.send(Emulation.setGeolocationOverride(Optional.of(latitude), Optional.of(longitude), Optional.of(1)));
        driver.get("https://my-location.org/");
 
    }
 
}

网络节流

网络节流是一种用于模拟较慢的互联网连接速度以测试网站或web应用程序性能的技术。
我们将首先使用Network.enable（）启用网络跟踪，然后使用Network.emulateNetworkConditions（）模拟网络条件。
emulateNetworkConditions（）方法接受五个参数——

  • offline
  • latency ( in ms )
  • downloadThroughput ( in bytes/sec )
  • uploadThroughput ( in bytes/sec )
  • connectionType ( CELLULAR2G, CELLULAR3G, CELLULAR4G, etc. )
devTools.send(Network.enable(Optional.of(1000000), Optional.empty(), Optional.empty()));
devTools.send(Network.emulateNetworkConditions(false, 1000, 1000000, 1000000, Optional.of(ConnectionType.CELLULAR3G)));

import java.io.IOException;
import java.util.Optional;
  
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v85.network.Network;
import org.openqa.selenium.devtools.v85.network.model.ConnectionType;
  
public class CodekruTest {
  
    public static void main(String[] args) throws IOException {
  
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
  
        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();
        devTools.send(Network.enable(Optional.of(1000000), Optional.empty(), Optional.empty()));
        devTools.send(
                Network.emulateNetworkConditions(false, 100, 1000000, 1000000, Optional.of(ConnectionType.CELLULAR3G)));
  
        driver.get("https://www.youtube.com");
    }
  
}

捕获网络请求和响应

当用户与网站交互时，进行各种调用以获取信息或资源。所有这些都已捕获，可以在网络选项卡中查看。现在，我们还将使用selenium DevTools API捕获网络调用的请求和响应。

获取网络请求

我们将再次使用network.enable（）方法启用网络跟踪，然后我们可以监听每个HTTP请求上触发的事件，如下所示

devTools.addListener(Network.requestWillBeSent(), request -> { 
      
});
  • request.getRequest（）.getMethod（）返回请求的请求方法，如GET、POST等。
  • request.getRequest（）.getUrl（）返回请求URL。
  • request.getRequest（）.getHeaders（）获取HTTP请求的标头。
  • request.getRequest（）.getPostData（）返回HTTP请求的请求体。
import java.util.Optional;
  
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v109.network.Network;
  
public class CodekruTest {
  
    public static void main(String[] args) {
  
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
  
        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();
        devTools.send(Network.enable(Optional.of(1000000), Optional.empty(), Optional.empty()));
        devTools.addListener(Network.requestWillBeSent(), request -> {
            System.out.println("Request Method : " + request.getRequest().getMethod());
            System.out.println("Request URL : " + request.getRequest().getUrl());
            System.out.println("Request headers: " + request.getRequest().getHeaders().toString());
            System.out.println("Request body: " + request.getRequest().getPostData().toString());
        });
  
        driver.get("https://www.makemytrip.com");
  
    }
  
}

获取网络响应

类似地，我们可以获得网络调用响应和有关HTTP响应的所有信息，如响应头、响应体、响应代码等。
为了监听响应，我们将使用Network.responseReceived（）代替Network.requestWillBeSent（）。

import java.util.Optional;
  
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.devtools.DevTools;
import org.openqa.selenium.devtools.v109.network.Network;
  
public class CodekruTest {
  
    public static void main(String[] args) {
  
        // pass the path of the chromedriver location in the second argument
        System.setProperty("webdriver.chrome.driver", "E:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
  
        DevTools devTools = ((ChromeDriver) driver).getDevTools();
        devTools.createSession();
        devTools.send(Network.enable(Optional.of(1000000), Optional.empty(), Optional.empty()));
        devTools.addListener(Network.responseReceived(), responseReceived -> {
            String responseUrl = responseReceived.getResponse().getUrl();
            RequestId requestId = responseReceived.getRequestId();
            if (responseUrl.contains("makemytrip")) {
                System.out.println("Url: " + responseUrl);
                System.out.println("Response headers: " + responseReceived.getResponse().getHeaders().toString());
                System.out.println("Response body: " + devTools.send(Network.getResponseBody(requestId)).getBody());
            }
  
        });
  
        driver.get("https://www.makemytrip.com");
  
    }
  
}

就是这样。我们可以使用Selenium DevTools API执行许多其他操作，并与Chrome开发工具进行交互。

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

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

相关文章

论文精读之Transformer论文

论文精读之Transformer论文

目录 Abstract Conclusion Introduction Background Training Abstract 在一个序列转录模型中&#xff0c;在编码器与译码器之间使用一个“注意力机制”的东西&#xff0c;做了两个机器翻译的实验&#xff0c;效果较其他模型效果更好。 Conclusion Transformer是第一个用于…
阅读更多...
全志F1C200S嵌入式驱动开发（调整cpu频率和dram频率）

全志F1C200S嵌入式驱动开发（调整cpu频率和dram频率）

【 声明：版权所有，欢迎转载，请勿用于商业用途。 联系信箱：feixiaoxing @163.com】 f1c200s默认的cpu频率是408M，默认的dram频率是156M。这两个数值，坦白说，都算不上特别高的频率。因为我们的晶振是24M输入，所以408/24=17，相当于整个cpu的频率只是晶振倍频了17…
阅读更多...
vue引入自定义字体并使用

vue引入自定义字体并使用

结构 font.scss引入字体 charset "UTF-8";font-face{font-family: "caoshu";src: url("caoshu.ttf");font-weight: normal;font-style: normal; }font-face{font-family: "Xingkai";src: url("XingKai.ttf");font-weight: …
阅读更多...
leetcode 144.二叉树的前序遍历 145.二叉树的后序遍历 94.二叉树的中序遍历

leetcode 144.二叉树的前序遍历 145.二叉树的后序遍历 94.二叉树的中序遍历

⭐️ 题目描述 &#x1f31f; 链接1&#xff1a;leetcode 144.二叉树的前序遍历 &#x1f31f; 链接2&#xff1a;leetcode 145.二叉树的后序遍历 &#x1f31f; 链接3&#xff1a;leetcode 94.二叉树的中序遍历 思路&#xff1a; leetcode的遍历和普通的遍历还略有一些不同&a…
阅读更多...
【Spring篇】初识 Spring IoC 与 DI

【Spring篇】初识 Spring IoC 与 DI

目录 一. Spring 是什么 ? 二. 何为 IoC ? 三. 如何理解 Spring IoC ? 四. IoC 与 DI 五 . 总结 一. Spring 是什么 ? 我们通常所说的 Spring 指的是 Spring Framework&#xff08;Spring 框架&#xff09;&#xff0c;它是⼀个开源框架&#xff0c;有着活跃⽽ 庞⼤…
阅读更多...
SAP 执行失败JOB及dump日志监控

SAP 执行失败JOB及dump日志监控

背景 系统使用时间较长&#xff0c;存在大量的后台作业&#xff0c;用户量较大&#xff0c;需要及时监控后台作业状况及系统dump情况&#xff0c;以便及时处理。 功能 1. 查询屏幕填写日期前n秒状态为错误及未知的后台作业 2. 查询屏幕填写日期前n秒系统中的dump记录--客制化程…
阅读更多...
有关动态内存管理的笔试题

有关动态内存管理的笔试题

题目一&#xff1a; void GetMemory(char* p) {p (char*)malloc(100); }void test(void) {char* str NULL;GetMemory(str);strcpy(str, "hello world");printf(str); }int main() {test();return 0; } 请问上述代码输出结果是什么&#xff0c;理由是什么&#xf…
阅读更多...
leetcode 90. 子集 II

leetcode 90. 子集 II

2023.7.23 这道题是上一题子集的升级版&#xff0c;即数组nums包含了相同的元素&#xff0c;这时候需要对集合之间进行去重&#xff0c;可以参考这一题组合总和II的去重方法。 下面直接上代码&#xff1a; class Solution { public:vector<vector<int>> ans;vecto…
阅读更多...
Qt QToolBar 添加 换行 添加到底部 左侧 右侧

Qt QToolBar 添加 换行 添加到底部 左侧 右侧

1. 常用添加&#xff1a; #include "mainwindow.h" #include "ui_mainwindow.h" #include <QDebug> MainWindow::MainWindow(QWidget *parent) :QMainWindow(parent),ui(new Ui::MainWindow) {ui->setupUi(this);QToolBar *toolBar addToolBar(t…
阅读更多...
查找和二叉树（基础知识和基本操作）

查找和二叉树（基础知识和基本操作）

查找&#xff1a; 1.二分查找&#xff1a;先定一个大范围&#xff0c;想一个数&#xff0c;看是在起始范围到中间范围还是中间范围到结束范围&#xff0c;依次循环直到确定值&#xff08;相当于一直把范围折半&#xff0c;直到找到&#xff09; while(low<high) {int mid(…
阅读更多...
一元多项式的表示及相加

一元多项式的表示及相加

实现思路&#xff1a; 通过链表实现&#xff0c;会更为简单直观。用链表中的每个结点表示多项式中的每一项&#xff0c;多项式每一项都是由数据域&#xff08;包含系数和指数&#xff09;和指针域构成的&#xff0c;所以在定义表示结点的结构体时&#xff0c;可如下所示进行定义…
阅读更多...
【Ansible 自动化配置管理实践】01、Ansible 快速入门

【Ansible 自动化配置管理实践】01、Ansible 快速入门

目录 一、Ansible 快速入门 1.1 什么是 Ansible ​1.2 Ansible 主要功能 1.3 Ansible 的特点 1.4 Ansible 基础架构 二、Ansible 安装与配置 2.1 Ansible 安装 2.2 确认安装 三、Ansible 配置解读 3.1 Ansible 配置路径 3.2 Ansible 主配置文件 3.3 Ansi…
阅读更多...
PHP后台登录功能单账号登录限制

PHP后台登录功能单账号登录限制

PHP后台登录功能单账号登录限制 单账号登陆是什么第一步创建数据表第二步创建登录页面test2.html第三步创建登录提交test2.php第四步访问后台首页第五步演示 单账号登陆是什么 一个用户只能登录一个账号通常被称为单账号登录限制或单用户单账号限制。这意味着每个用户只能使用…
阅读更多...
TCP通信 -- 接收并反馈（全）

TCP通信 -- 接收并反馈（全）

TCP通信整体过程&#xff1a; 1.【服务端】启动,创建ServerSocket对象&#xff0c;等待连接。2.【客户端】启动,创建Socket对象&#xff0c;请求连接。3.【服务端】接收连接,调用accept方法&#xff0c;并返回一个Socket对象。4.【客户端】Socket对象&#xff0c;获取OutputStr…
阅读更多...
JVM之内存与垃圾回收篇3

JVM之内存与垃圾回收篇3

文章目录 8 垃圾回收8.1 基本理论8.1.1 对象的finalization机制8.1.2 理解System.gc8.1.3 内存溢出和内存泄漏8.1.4 Stop The World8.1.5 安全点和安全区域8.1.6 Java中的引用 8.2 垃圾回收算法8.2.1 引用计数法8.2.2 可达性分析8.2.2.1 使用MAT查看GC Roots8.2.2.2 使用JProfi…
阅读更多...
【docker,typeorm】docker时区与本地时区的不同步【已解决】

【docker,typeorm】docker时区与本地时区的不同步【已解决】

前言 我使用账号登陆vuecms.cn网站&#xff0c;查看登陆日志&#xff0c;发现所有时间全部少8个小时。懵逼树上懵逼果&#xff0c;懵逼树下你和我… 我的开源网站后端是基于nestjs&#xff0c;数据库使用typeorm进行连接操作 原因分析&#xff1a; 原因一: docker环境与本地环…
阅读更多...
结构型设计模式之适配器模式【设计模式系列】

结构型设计模式之适配器模式【设计模式系列】

系列文章目录 C技能系列 Linux通信架构系列 C高性能优化编程系列 深入理解软件架构设计系列 高级C并发线程编程 设计模式系列 期待你的关注哦&#xff01;&#xff01;&#xff01; 现在的一切都是为将来的梦想编织翅膀&#xff0c;让梦想在现实中展翅高飞。 Now everythi…
阅读更多...
Type [unknown] not present（主要问题是jar冲突）

Type [unknown] not present（主要问题是jar冲突）

解决方案&#xff1a;1选择pom.xml 2鼠标移动到打开的pom.xml点击右键选择maven 显示图 3ctrl鼠标左键移动找到红线 可以看到引入冲突 4按照实际需求对pom.xml的引入进行增删或者版本升级降级&#xff0c;直到以下图标中没有红线冲突即可
阅读更多...
SQL注入 三范式

SQL注入 三范式

学习目标 了解三范式的要求 1. 什么是范式 设计关系数据库时&#xff0c;遵从不同的规范要求&#xff0c;设计出合理的关系型数据库&#xff0c;这些不同的规范要求被称为不同的范式&#xff0c;各种范式呈递次规范&#xff0c;越高的范式数据库冗余越小。 实际上家用电器都有…
阅读更多...
香农极限是如何影响光纤容量的

香农极限是如何影响光纤容量的

1 引言 上世纪末&#xff0c;DWDM技术开始在干线通信中使用并迅速普及。虽然当时DWDM系统的容量只有402.5G&#xff0c;但实验室中DWDM支持的波道数甚至超过了1000波&#xff0c;单波道速率也飙到了惊人的160G&#xff08;超1000波和单波160G是两个独立事件&#xff09;。人们普…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023