《最新出炉》系列初窥篇-Python+Playwright自动化测试-16-处理模态对话框弹窗

1.简介

我们在日常工作中,会经常遇到弹出警告框的问题,弹框无法绕过,必须处理才可以执行后续的测试,所以弹框处理也是我们必须掌握的一个知识。宏哥在java+selenium系列文章中介绍过这部分内容。那么,playwright对于弹框的处理是怎样的?是否比selenium更加简单呢?下面我们就来介绍一下playwright对于弹框的处理。

2.弹框分类

弹框通常分为3种,分别为alert,confirm,promot。

  • alert弹框:只有信息和确定按键
  • confirm弹框:在alert弹窗基础上增加了取消按钮
  • prompt弹框:在confirm的基础上增加了可输入文本内容的功能

3.dialog 弹窗

3.1dialog属性和方法

accept()当对话框被接收时返回。

dialog.accept()
dialog.accept(**kwargs)

参数 prompt_text(可选), 要在提示中输入的文本。如果对话框 type 没有提示,则不会产生任何影响.

default_value, 如果对话框是提示的,则返回默认提示值。否则,返回空字符串。

dialog.default_value

dismiss 关闭对话框

dialog.dismiss()

message 获取对话框中显示的消息

dialog.message

type返回对话框的类型,可以是alert, beforeunload, confirm或 prompt其中一个

dialog.type

3.2dialog 事件监听

playwright 框架可以监听dialog事件,不管你alert 什么时候弹出来,监听到事件就自动处理了。

当出现 JavaScript 对话框时发出,例如alert、prompt。监听器必须dialog.accept()或dialog.dismiss()对话框 - 否则页面将冻结等待对话框,并且单击等操作将永远不会完成。

#弹窗中确认
page.on("dialog", lambda dialog: dialog.accept())
page.locator("button").click()
#弹窗中取消
page.on("dialog", lambda dialog: dialog.dismiss())
page.locator("button").click()

注:当没有page.on("dialog")侦听器存在时,所有对话框都会自动关闭。

语法如下:

page.on("dialog", handler)

3.模态框的定义

  模态对话框(Modal Dialogue Box,又叫做模式对话框),是指在用户想要对对话框以外的应用程序进行操作时,必须首先对该对话框进行响应。如单击【确定】或【取消】按钮等将该对话框关闭。一般来说,Windows应用程序中,对话框分为模态对话框和非模态对话框两种。二者的区别在于当对话框打开时,是否允许用户进行其他对象的操作。

3.1警告框

警告框经常用于确保用户可以得到某些信息。

当警告框出现后,用户需要点击确定按钮才能继续进行操作。

语法:

alert("文本")
3.2确认框

确认框用于使用户可以验证或者接受某些信息。

当确认框出现后,用户需要点击确定或者取消按钮才能继续进行操作。

如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false。

语法:

confirm("文本")
3.3提示框

提示框经常用于提示用户在进入页面前输入某个值。

当提示框出现后,用户需要输入某个值,然后点击确认或取消按钮才能继续操纵。

如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。

语法:

prompt("文本","默认值")
3.4测试页面准备

ModalDialogueBox.html页面参考代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>模态框</title>
</head>
<script type="text/javascript">
window.onload = function(){
    document.getElementById("input_1").onclick = function(){
        alert("您关注了‘北京宏哥’微信公众号!");
    };
    document.getElementById("input_2").onclick = function(){
        confirm("确定关注微信公众号:北京宏哥?")
    };
    document.getElementById("input_3").onclick = function(){
        prompt("请输入微信公众号:","北京宏哥");
    };
}

</script>
<style>
.button1 {
    background-color: #f44336; 
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 28px;
    margin-bottom: 100px;
    text-decoration:none;
    color: white;
}
.button {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
#myAnchor
{
  text-decoration:none;
  color: white;
}
</style>
<body>
    <div style=" text-align:center;">
        <div style="height: 100px;margin-top: 200px;">
            <button class="button1"><a id="myAnchor" href="https://www.cnblogs.com/du-hong/">北京-宏哥</a></button></br>
            测试练习模态框的处理:<br><br>
            1.警告框
            <input class="button" type="button" id="input_1" value="点击弹出警告框"><br><br>
            2.确认框
            <input class="button" type="button" id="input_2" value="点击弹出确认框"><br><br>
            3.提示框
            <input class="button" type="button" id="input_3" value="点击弹出提示框"><br><br>
        </div>
    </div
</body>
</html>

浏览器打开页面如下图所示:

4.牛刀小试

下边宏哥就利用上边准备好的模态框例子进行一下演示。首先演示当监听器存在时,我们如何处理。

监听器存在

4.1代码设计

4.2参考代码
# coding=utf-8🔥

# 1.先设置编码,utf-8可支持中英文,如上,一般放在第一行

# 2.注释:包括记录创建时间,创建人,项目名称。
'''
Created on 2023-07-14
@author: 北京-宏哥   QQ交流群:705269076
公众号:北京宏哥
Project: 《最新出炉》系列初窥篇-Python+Playwright自动化测试-15-处理模态对话框弹窗
'''

# 3.导入模块
from playwright.sync_api import sync_playwright

def run(playwright):
    chromium = playwright.chromium
    browser = chromium.launch(headless=False, slow_mo=3000)
    page = browser.new_page()
    page.goto("C:/Users/DELL/Desktop/test/ModalDialogueBox.html")
    page.on("dialog", lambda dialog: dialog.accept())
    page.on("dialog", lambda dialog: print(dialog.message))
    # 点击弹出警告框
    page.locator("#input_1").click()
    # 点击弹出警告框
    page.wait_for_timeout(5000)
    page.locator("#input_2").click()
    # 点击弹出警告框
    page.wait_for_timeout(5000)
    page.locator("#input_3").click()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)
4.3运行代码

1.运行代码,右键Run'Test',控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

监听器不存在

4.4代码设计

4.5参考代码
# coding=utf-8🔥

# 1.先设置编码,utf-8可支持中英文,如上,一般放在第一行

# 2.注释:包括记录创建时间,创建人,项目名称。
'''
Created on 2023-07-14
@author: 北京-宏哥   QQ交流群:705269076
公众号:北京宏哥
Project: 《最新出炉》系列初窥篇-Python+Playwright自动化测试-15-处理模态对话框弹窗
'''

# 3.导入模块
from playwright.sync_api import sync_playwright

def run(playwright):
    chromium = playwright.chromium
    browser = chromium.launch(headless=False, slow_mo=3000)
    page = browser.new_page()
    page.goto("C:/Users/DELL/Desktop/test/ModalDialogueBox.html")
    # page.on("dialog", lambda dialog: dialog.accept())
    # page.on("dialog", lambda dialog: print(dialog.message))
    # 点击弹出警告框
    page.locator("#input_1").click()
    # 点击弹出警告框
    page.wait_for_timeout(5000)
    page.locator("#input_2").click()
    # 点击弹出警告框
    page.wait_for_timeout(5000)
    page.locator("#input_3").click()
    browser.close()

with sync_playwright() as playwright:
    run(playwright)
4.6运行代码

1.运行代码,右键Run'Test',控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

5.项目实战

宏哥继续用java+selenium中的一个alert例子(投票通道),只有点击确定这个按钮,alert框才会消失。

5.1参考代码
# coding=utf-8🔥

# 1.先设置编码,utf-8可支持中英文,如上,一般放在第一行

# 2.注释:包括记录创建时间,创建人,项目名称。
'''
Created on 2023-07-14
@author: 北京-宏哥   QQ交流群:705269076
公众号:北京宏哥
Project: 《最新出炉》系列初窥篇-Python+Playwright自动化测试-15-处理模态对话框弹窗
'''

# 3.导入模块
from playwright.sync_api import sync_playwright

def run(playwright):
    chromium = playwright.chromium
    browser = chromium.launch(headless=False, slow_mo=3000)
    page = browser.new_page()
    page.on("dialog", lambda dialog: dialog.accept())
    page.on("dialog", lambda dialog: print(dialog.message))
    page.goto("http://news.cyol.com/node_60799.htm")
    browser.close()

with sync_playwright() as playwright:
    run(playwright)
5.2运行代码

1.运行代码,右键Run'Test',控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作。如下图所示:

6.小结

page.on(“dialog”)监听器必须处理该对话框。否则您的操作将停止,无论是 locator.click() 还是其他内容。这是因为Web中的对话框是模态,因此在处理它们之前会阻止进一步的页面执行。

例如下边宏哥演示的是:只打印message,而没有处理就会一直卡在那个弹出框不继续往下操作了。宏哥就是将处理代码注释,打印代码留下。不过这种情况你手动点击“确定”,代码也是可以向下执行的。

# page.on("dialog", lambda dialog: dialog.accept())
page.on("dialog", lambda dialog: print(dialog.message))

 运行代码后电脑端的浏览器的动作(可以看到卡主不动了,也就是代码不向下执行了)。如下图所示:

 好了,今天时间也不早了,宏哥就讲解和分享到这里,感谢您耐心的阅读,希望对您有所帮助。

  每天学习一点,今后必成大神-

往期推荐(由于跳转参数丢失了,所有建议选中要访问的右键,在新标签页中打开链接即可访问)或者微信搜索: 北京宏哥  公众号提前解锁更多干货。

Appium自动化系列,耗时80天打造的从搭建环境到实际应用精品教程测试

Python接口自动化测试教程,熬夜87天整理出这一份上万字的超全学习指南

Python+Selenium自动化系列,通宵700天从无到有搭建一个自动化测试框架

Java+Selenium自动化系列,仿照Python趁热打铁呕心沥血317天搭建价值好几K的自动化测试框架

Jmeter工具从基础->进阶->高级,费时2年多整理出这一份全网超详细的入门到精通教程

Fiddler工具从基础->进阶->高级,费时100多天吐血整理出这一份全网超详细的入门到精通教程

Pycharm工具基础使用教程

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

第2节、让电机转起来【51单片机+L298N步进电机系列教程】

↑↑↑点击上方【目录】&#xff0c;查看本系列全部文章 摘要&#xff1a;本节介绍用简单的方式&#xff0c;让步进电机转起来。其目的之一是对电机转动有直观的感受&#xff0c;二是熟悉整个开发流程。本系列教程必要的51单片机基础包括IO口操作、中断、定时器三个部分&#…

6、基于机器学习的预测

应用机器学习的任何预测任务与这四个策略。 文章目录 1、简介1.1定义预测任务1.2准备预测数据1.3多步预测策略1.3.1多输出模型1.3.2直接策略1.3.3递归策略1.3.4DirRec 策略2、流感趋势示例2.1多输出模型2.2直接策略1、简介 在第二课和第三课中,我们将预测视为一个简单的回归问…

jquery写表格 手动合并单元格

<!DOCTYPE html> <html><head><style>.special-row th:first-child,.special-row th:nth-child(2) {background-color: yellow;text-align: center;}</style> </head><body><div id"tableWrapper"> <!-- 添加包裹…

TreeSet 集合

TreeSet 集合 1. 概述2. 方法3. 遍历方式4. 两种排序方式4.1 默认排序规则/自然排序4.1.1 概述4.1.2 compareTo()方法4.1.3 代码示例14.1.4 代码示例2 4.2 比较器排序4.2.1 概述4.2.2 compare()方法4.2.3 代码示例14.2.4 代码示例2 4.3 排序方式的对比 5. 注意事项 文章中的部分…

<.Net>使用visual Studio 2022在VB.net中新添自定义画图函数(优化版)

前言 这是基于我之前的一篇博文&#xff1a; 使用visual Studio 2019在VB.net中新添自定义画图函数 在此基础上&#xff0c;我优化了一下&#xff0c;改进了UI&#xff0c;添加了示例功能&#xff0c;即以画圆函数为基础&#xff0c;添加了走马灯功能。 先看一下最终效果&#…

JavaEE作业-实验一

目录 1 实验内容 2 思路 3 核心代码 &#xff08;1&#xff09;前端核心代码&#xff1a; &#xff08;2&#xff09;后端核心代码&#xff1a; 4 实验结果 1 实验内容 用Servlet JSP JavaBean实现登录功能 2 思路 ①建好web项目,创建数据库 ②建立两个简单的前端页…

Day 3. Linux高级编程之函数接口和流的定位

gets和fgets区别&#xff1a; 1&#xff09;gets没有给定最多读取字符的个数&#xff0c;有越界风险\n\n fgets需要给定最多读取的字符个数&#xff0c;没有越界的风险\n\n 2&#xff09;gets会去掉从终端接收的/n&#xff0c;换成/0\n\n fgets则会保留并在末尾加上/0\…

最小生成树超详细介绍

目录 一.最小生成树的介绍 1.最小生成树的简介 2.最小生成树的应用 3.最小生成树的得出方法 二.Kruskal算法 1.基本思想&#xff1a; 2.步骤&#xff1a; 3.实现细节&#xff1a; 4.样例分析&#xff1a; 5.Kruskal算法代码实现&#xff1a; 三.Prim算法 1.基本思想…

【华为 ICT HCIA eNSP 习题汇总】——题目集12

1、企业网络内部常常采用私有 IP 地址进行通信&#xff0c;以下哪个地址属于私有 IP 地址&#xff1f; A、0.1.1.1 B、127.5.4.3 C、128.0.0.5 D、172.24.35.36 考点&#xff1a;网络层 解析&#xff1a;&#xff08;D&#xff09; A类 IP 地址中&#xff0c;10.0.0.0 ~ 10.255…

SpringSecurity(18)——OAuth2授权码管理

AuthorizationCodeServices public interface AuthorizationCodeServices {//为指定的身份验证创建授权代码。String createAuthorizationCode(OAuth2Authentication authentication);//使用授权码。OAuth2Authentication consumeAuthorizationCode(String code)throws Invali…

ACM训练题:Raising Modulo Numbers

主要意思就是上面的式子&#xff0c;求幂的和的模&#xff0c;求幂自然是快速幂&#xff0c;这里都带上模&#xff0c;求和的模也可以分开取模。 AC代码&#xff1a; #include <iostream> using namespace std; long long Z,M,H,a,b; long long quick_mi(long long x,l…

【数据结构与算法】(11)基础数据结构 之 二叉树 二叉树的存储与遍历及相关示例 详细代码讲解

目录 2.10 二叉树1) 存储2) 遍历广度优先深度优先递归实现非递归实现 习题E01. 前序遍历二叉树-Leetcode 144E02. 中序遍历二叉树-Leetcode 94E03. 后序遍历二叉树-Leetcode 145E04. 对称二叉树-Leetcode 101E05. 二叉树最大深度-Leetcode 104E06. 二叉树最小深度-Leetcode 111…

R语言:箱线图绘制(添加平均值趋势线)

箱线图绘制 1. 写在前面2.箱线图绘制2.1 相关R包导入2.2 数据导入及格式转换2.3 ggplot绘图 1. 写在前面 今天有时间把之前使用过的一些代码和大家分享&#xff0c;其中箱线图绘制我认为是非常有用的一个部分。之前我是比较喜欢使用origin进行绘图&#xff0c;但是绘制的图不太…

C++杂选

#include <iostream> #include <regex>using namespace std;int main() { //它声明了一个 string 类型的变量 input&#xff0c;用于存储输入的字符串。然后使用 getline() 函数从标准输入中读取一行输入&#xff0c;并将其存储在 input 变量中。string input;getl…

PAT-Apat甲级题1008(python和c++实现)

PTA | 1008 Elevator 1008 Elevator 作者 CHEN, Yue 单位 浙江大学 The highest building in our city has only one elevator. A request list is made up with N positive numbers. The numbers denote at which floors the elevator will stop, in specified order. It …

c#读取csv文件中的某一列的数据

chat8 (chat779.com) 上面试GPT-3.5,很好的浏览网站&#xff0c;输入问题&#xff0c;可得到答案。 问题1&#xff1a;c#如何在csv中读取某一列数据 解答方案&#xff1a;在 C#中&#xff0c;你可以使用File.ReadAllLines来读取CSV中的所有行&#xff0c;然后逐行解析每一行…

机器学习---概率图模型(隐马尔可夫模型、马尔可夫随机场、条件随机场)

1. 隐马尔可夫模型 机器学习最重要的任务是根据已观察到的证据&#xff08;例如训练样本&#xff09;对感兴趣的未知变量&#xff08;例如类别标 记&#xff09;进行估计和推测。概率模型&#xff08;probabilistic model&#xff09;提供了一种描述框架&#xff0c;将描述任…

网络选择流程分析(首选网络类型切换流程)

首先是界面,我在此平台的界面如下: 对应的入口源码位置在Settings的UniEnabledNetworkModePreferenceController中,当然其他平台可能在PreferredNetworkModePreferenceController中,流程上都是大同小异 然后点击切换按钮会调用到UniEnabledNetworkModePreferenceControlle…

智算中心建设主流加速卡选型策略

智算中心建设主流加速卡选型对比 —— 加速卡H800、A800、L40S、***B 一、加速卡基本性能比较 序号比较项H800A800L40S某国产NPU&#xff08;本文简称“nB”&#xff09; 1 加速卡类型 GPU GPU GPU NPU 2 供应商 英伟达 英伟达 英伟达 - 3 FP32&#xff08;TFLO…

MySQL查询优化技巧和10个案例展示

优化MySQL查询的实战技巧&#xff1a; **避免使用SELECT ***&#xff1a;只获取需要的列&#xff0c;这样可以减少数据传输量&#xff0c;提高查询效率。使用索引&#xff1a;为查询频繁的列创建索引&#xff0c;可以显著提高查询速度。但请注意&#xff0c;索引并非万能&…