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

最强自动化测试框架Playwright（20）- iframe

news 2025/9/25 3:44:05

一个页面可以附加一个或多个 Frame 对象。每个页面都有一个主框架，并且假定页面级交互（如）在主框架中运行。click

frame_locator

使用 iframe 时，可以创建一个框架定位器，该定位器将进入 iframe 并允许选择该 iframe 中的元素。

# Locate element inside frame
# Get frame using any other selector
username = page.frame_locator('.frame-class').get_by_label('User Name')
username.fill('John')

上面代码，先定位frame，然后定位frame里的元素，并对元素进行输入操作。

示例：

html文件

<!DOCTYPE html>
<html>
<head><title>IFrame Example</title>
</head>
<body><h1>IFrame Example</h1><p>This is an example of using an iframe.</p><iframe src="https://pity.fun/#/dashboard/workspace" frameborder="0" width="100%" height="500"></iframe>
</body>
</html>

这个html页面有一个iframe

from playwright.sync_api import sync_playwright, expectdef run(playwright):chromium = playwright.chromiumbrowser = chromium.launch(headless=False)page = browser.new_page()page.goto(r'C:\Users\Desktop\download.html')page.frame_locator("iframe").get_by_placeholder("用户名: tester").fill("tester")page.frame_locator("iframe").get_by_placeholder("密码: tester").fill("tester")page.frame_locator("iframe").get_by_role("button", name="登 录").click()expect( page.frame_locator("iframe").get_by_title("工作台")).to_be_visible()with sync_playwright() as p:run(p)

如果要对iframe里元素进行操作，就需要先用frame_locator来定位iframe，再定位iframe里的元素。

 frame

可以使用 page.frame（） 返回匹配的frame。

需要指定frame的name或者url。

# Get frame using the frame's name attribute
frame = page.frame('frame-login')# Get frame using frame's URL
frame = page.frame(url=r'.*domain.*')# Interact with the frame
frame.fill('#username-input', 'John')

frame tree

页面都通过page.main_frame和frame.child_frames方法公开其当前框架树。

框架对象的生命周期由三个事件控制，这些事件在页面对象上调度：

  • page.on（“frameattached”） - 当框架附加到页面时触发。一个框架只能附加到页面一次。
  • page.on（“framenavigated”） - 当框架提交导航到其他 URL 时触发。
  • page.on（“framedetached”） - 当框架从页面分离时触发。一个框架只能从页面分离一次。

from playwright.sync_api import sync_playwrightdef run(playwright):firefox = playwright.firefoxbrowser = firefox.launch()page = browser.new_page()page.goto("https://www.theverge.com")dump_frame_tree(page.main_frame, "")browser.close()def dump_frame_tree(frame, indent):print(indent + frame.name + '@' + frame.url)for child in frame.child_frames:dump_frame_tree(child, indent + "    ")with sync_playwright() as playwright:run(playwright)

add_script_tag 

frame.add_script_tag() 方法在页面中添加一个脚本标签：

下面是一个例子，演示如何使用 playwright 的 `frame.add_script_tag()` 方法在页面中添加一个脚本标签：

from playwright.sync_api import Playwright, sync_playwrightwith sync_playwright() as p:browser = p.chromium.launch()page = browser.new_page()page.goto('https://www.example.com')# 在页面中添加一个脚本标签page.main_frame().add_script_tag(url='https://code.jquery.com/jquery-3.6.0.min.js')# 在页面中执行添加的脚本page.evaluate('console.log(jQuery.fn.jquery)')browser.close()

在上面的代码中，首先创建了一个 `browser` 实例和一个 `page` 实例，并跳转到指定的网址。然后使用 `page.main_frame().add_script_tag()` 方法添加了一个 jQuery 的脚本标签，这个脚本标签的 URL 是 `https://code.jquery.com/jquery-3.6.0.min.js`。最后使用 `page.evaluate()` 方法在页面上执行添加的脚本，输出了 jQuery 的版本号。

add_style_tag

在样式表的加载触发或将 CSS 内容注入框架时返回添加的标记。

将具有所需 URL 的标记或包含内容的标记添加到页面中。<link rel="stylesheet"><style type="text/css">

用法

frame.add_style_tag()
frame.add_style_tag(**kwargs)

content

获取框架的完整 HTML 内容，包括文档类型。

frame.content()

drag_and_drop

frame.drag_and_drop(source, target)
frame.drag_and_drop(source, target, **kwargs)

相关文章：

最强自动化测试框架Playwright（20）- iframe

一个页面可以附加一个或多个 Frame 对象。每个页面都有一个主框架&#xff0c;并且假定页面级交互&#xff08;如&#xff09;在主框架中运行。click frame_locator 使用 iframe 时&#xff0c;可以创建一个框架定位器&#xff0c;该定位器将进入 iframe 并允许选择该 iframe…...

编程日记 2023/8/14 20:39:38

leetcode 516. 最长回文子序列(JAVA)题解

题目链接https://leetcode.cn/problems/longest-palindromic-subsequence/description/?utm_sourceLCUS&utm_mediumip_redirect&utm_campaigntransfer2china 目录 题目描述&#xff1a; 暴力递归&#xff1a; 动态规划&#xff1a; 题目描述&#xff1a; 给你一个…...

编程日记 2023/8/14 20:38:36

在Java中操作Redis(详细--＞从环境配置到代码实现)

在Java中操作Redis 文章目录 在Java中操作Redis1、介绍2、Jedis3、Spring Data Redis3.1、对String的操作3.2、对哈希类型数据的操作3.3、对list的操作3.4、对set类型的操作3.5、对 ZSet类型的数据&#xff08;有序集合&#xff09;3.6、通用类型的操作 1、介绍 Redis 的Java客…...

编程日记 2023/8/14 20:37:34

分布式作业调度框架——ElasticJob

1、简介 ElasticJob 是面向互联网生态和海量任务的分布式调度解决方案&#xff0c;由两个相互独立的子项目 ElasticJob-Lite 和 ElasticJob-Cloud 组成。 它通过弹性调度、资源管控、以及作业治理的功能&#xff0c;打造一个适用于互联网场景的分布式调度解决方案&#xff0c;…...

编程日记 2023/8/14 20:36:33

react如何实现数据渲染

React数据渲染是指将组件中的数据映射到页面上&#xff0c;以展示出来。在React中&#xff0c;数据渲染通常是通过JSX和组件的state或props完成的。 JSX是一个类似HTML的语法&#xff0c;可以在其中嵌入JavaScript表达式。在JSX中&#xff0c;可以使用{}包裹JavaScript表达式&…...

编程日记 2023/8/14 20:35:32

在Java中如何使用List集合实现分页，以及模糊查询后分页

物理分页工具类 package com.yutu.garden.utils;import com.baomidou.mybatisplus.core.toolkit.CollectionUtils;import java.util.ArrayList; import java.util.List; import java.util.stream.Collectors;/*** ClassName: PageUtils* Description: 物理分页* Author* Date …...

编程日记 2023/8/14 20:34:29

【JAVA】包装类、正则表达式、Arrays类、Lambda表达式

1 包装类 包装类是8种基本数据类型对应的引用类型 作用&#xff1a;后期的集合和泛型不支持基本类型&#xff0c;只能使用包装类 基本数据类型和其对应的引用数据类型的变量可以互相赋值 基本数据类型引用数据类型 byte Byte short Short int Integer long Long ch…...

编程日记 2023/8/14 20:33:27

Java中的Maven Assembly插件是什么？

Maven Assembly插件是Maven中的一个插件&#xff0c;用于创建自定义的构建过程。它允许你在构建过程中执行一些自定义的操作&#xff0c;例如打包、编译、复制文件等。对于新手来说&#xff0c;Maven Assembly插件可能有点复杂&#xff0c;但是我们可以使用一些幽默的方式来解释…...

编程日记 2023/8/14 20:32:25

SpringBoot禁用Swagger3

Swagger3默认是启用的&#xff0c;即引入包就启用。 <dependency><groupId>io.springfox</groupId><artifactId>springfox-boot-starter</artifactId><version>3.0.0</version> </dependency> <dependency><groupId…...

编程日记 2023/8/14 20:31:23

小红书Java后端2023-8-6笔试

小红书推荐系统 时间限制&#xff1a;3000MS&#xff1b;内存限制&#xff1a;589824KB 题目描述 小红书有一个推荐系统&#xff0c;可以根据用户搜索的关键词推荐用户希望获取的内容。现在给定小孩的搜索记录&#xff08;记录是分词后的结果&#xff09;&#xff0c;我们认…...

编程日记 2023/8/14 20:30:22

metaRTC7 demo mac/ios编译指南

概要 metaRTC7.0开始全面支持mac/ios操作系统&#xff0c;新版本7.0.023 mac os demo 包含有srs/zlm的推拉流演示。发布版自带了x64版第三方类库&#xff0c;arm版第三方类库还需开发者自己编译。 源码下载 下载文件metartc7.023.7z https://github.com/metartc/metaRTC/re…...

编程日记 2023/8/14 20:29:20

systemd-journal 占用内存的问题

最近发现部分 Debian 机器的 systemd-journal 占用了非常多内存。这和 Debian 对其的 错误配置有关系&#xff08;查了一下其他发行版&#xff0c;有和 Debian 一样的配置的也有和 Debian 不一样 的配置的&#xff0c;说明这个配置有争议&#xff09;。 systemd-journal 简介 …...

编程日记 2023/8/14 20:28:19

Java # Spring（2）

一、Spring事物 一、分类 编程式事物&#xff1a;代码中硬编码&#xff08;不推荐使用&#xff09; 声明式事物&#xff1a;配置文件中配置&#xff08;推荐使用&#xff09; 分类&#xff1a; 基于xml的声明式事物基于注解的声明式事物 二、隔离级别 ISOLATION_DEFAULT&…...

编程日记 2023/8/14 20:27:17

2021年03月 C/C++（二级）真题解析#中国电子学会#全国青少年软件编程等级考试

第1题&#xff1a;石头剪刀布 石头剪刀布是常见的猜拳游戏。石头胜剪刀&#xff0c;剪刀胜布&#xff0c;布胜石头。如果两个人出拳一样&#xff0c;则不分胜负。 一天&#xff0c;小A和小B正好在玩石头剪刀布。已知他们的出拳都是有周期性规律的&#xff0c;比如&#xff1a;“…...

编程日记 2023/8/14 20:25:13

应用程序运行报错：First section must be [net] or [network]:No such file or directory

应用程序报错环境&#xff1a; 在linux下&#xff0c;调用darknet训练的模型&#xff0c;报错&#xff1a;First section must be [net] or [network]:No such file or directory&#xff0c;并提示&#xff1a;"./src/utils.c:256: error: Assertion 0 failed." 如…...

编程日记 2023/8/14 20:24:12

【ECMAScript】ES6-ES11学习笔记

文章目录 注意事项1.声明变量2.定义常量3.解构赋值4.模板字符串5.简化对象写法6.箭头函数7.参数默认值8.rest参数9.扩展运算符10.Symbol11.生成器函数12.Promise基本语法13.集合set14.Map15.类class16.数值扩展17.对象私有属性18.对象方法扩展19.js文件模块化20.async和await21…...

编程日记 2023/8/14 20:23:09

K8S MetalLB LoadBalancer

1. 简介 kubernetes集群没有L4负载均衡&#xff0c;对外暴漏服务时&#xff0c;只能使用nodePort的方式&#xff0c;比较麻烦&#xff0c;必须要记住不同的端口号。 LoadBalancer&#xff1a;使用云提供商的负载均衡器向外部暴露服务&#xff0c;外部负载均衡器可以将流量路由…...

编程日记 2023/8/14 20:22:07

kubernetes二进制部署2之 CNI 网络组件部署

CNI 网络组件部署 一&#xff1a;K8S提供三大接口1容器运行时接口CRI2云原生网络接口CNI3云原生存储接口CSI 部署 flannelK8S 中 Pod 网络通信&#xff1a;Overlay Network&#xff1a;VXLAN&#xff1a;Flannel:Flannel udp 模式的工作原理&#xff1a;ETCD 之 Flannel 提供说…...

编程日记 2023/8/14 20:21:05

docker通用镜像方法，程序更新时不用重新构建镜像

docker通用镜像方法&#xff0c;程序更新时不用重新构建镜像。更新可执行文件后&#xff0c;重新启动容器就可运行。 功能 1、在demo目录下添加脚本文件start.sh&#xff0c;里面执行demo.jar文件。 2、将demo目录映射到镜像下的 /workspace目录。 3、Dockerfile文件中默认…...

编程日记 2023/8/14 20:20:03

Spring Cloud构建微服务断路器介绍

什么是断路器 断路器模式源于Martin Fowler的Circuit Breaker一文。“断路器”本身是一种开关装置&#xff0c;用于在电路上保护线路过载&#xff0c;当线路中有电器发生短路时&#xff0c;“断路器”能够及时的切断故障电路&#xff0c;防止发生过载、发热、甚至起火等严重后果…...

编程日记 2023/8/14 20:19:02

【网络】每天掌握一个Linux命令 - iftop

在Linux系统中&#xff0c;iftop是网络管理的得力助手&#xff0c;能实时监控网络流量、连接情况等&#xff0c;帮助排查网络异常。接下来从多方面详细介绍它。 目录 【网络】每天掌握一个Linux命令 - iftop工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景…...

编程新知 2025/8/4 15:02:27

逻辑回归：给不确定性划界的分类大师

想象你是一名医生。面对患者的检查报告&#xff08;肿瘤大小、血液指标&#xff09;&#xff0c;你需要做出一个**决定性判断**&#xff1a;恶性还是良性&#xff1f;这种“非黑即白”的抉择&#xff0c;正是**逻辑回归&#xff08;Logistic Regression&#xff09;** 的战场&a…...

编程新知 2025/8/18 10:21:48

服务器硬防的应用场景都有哪些？

服务器硬防是指一种通过硬件设备层面的安全措施来防御服务器系统受到网络攻击的方式&#xff0c;避免服务器受到各种恶意攻击和网络威胁&#xff0c;那么&#xff0c;服务器硬防通常都会应用在哪些场景当中呢&#xff1f; 硬防服务器中一般会配备入侵检测系统和预防系统&#x…...

编程新知 2025/7/23 18:46:38

工程地质软件市场：发展现状、趋势与策略建议

一、引言 在工程建设领域&#xff0c;准确把握地质条件是确保项目顺利推进和安全运营的关键。工程地质软件作为处理、分析、模拟和展示工程地质数据的重要工具&#xff0c;正发挥着日益重要的作用。它凭借强大的数据处理能力、三维建模功能、空间分析工具和可视化展示手段&…...

编程新知 2025/9/9 8:26:07

令牌桶 滑动窗口-＞限流 分布式信号量-＞限并发的原理 lua脚本分析介绍

文章目录 前言限流限制并发的实际理解限流令牌桶代码实现结果分析令牌桶lua的模拟实现原理总结&#xff1a; 滑动窗口代码实现结果分析lua脚本原理解析 限并发分布式信号量代码实现结果分析lua脚本实现原理 双注解去实现限流 并发结果分析&#xff1a; 实际业务去理解体会统一注…...

编程新知 2025/9/24 21:19:34

自然语言处理——Transformer

自然语言处理——Transformer 自注意力机制多头注意力机制Transformer 虽然循环神经网络可以对具有序列特性的数据非常有效&#xff0c;它能挖掘数据中的时序信息以及语义信息&#xff0c;但是它有一个很大的缺陷——很难并行化。 我们可以考虑用CNN来替代RNN&#xff0c;但是…...

编程新知 2025/9/24 18:52:11

OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别

OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别 直接训练提示词嵌入向量的核心区别 您提到的代码： prompt_embedding = initial_embedding.clone().requires_grad_(True) optimizer = torch.optim.Adam([prompt_embedding...

编程新知 2025/7/4 0:50:01

云原生玩法三问：构建自定义开发环境

云原生玩法三问&#xff1a;构建自定义开发环境 引言 临时运维一个古董项目&#xff0c;无文档&#xff0c;无环境&#xff0c;无交接人&#xff0c;俗称三无。 运行设备的环境老&#xff0c;本地环境版本高&#xff0c;ssh不过去。正好最近对 腾讯出品的云原生 cnb 感兴趣&…...

编程新知 2025/9/22 18:06:50

在Ubuntu24上采用Wine打开SourceInsight

1. 安装wine sudo apt install wine 2. 安装32位库支持，SourceInsight是32位程序 sudo dpkg --add-architecture i386 sudo apt update sudo apt install wine32:i386 3. 验证安装 wine --version 4. 安装必要的字体和库（解决显示问题） sudo apt install fonts-wqy…...

编程新知 2025/9/17 10:52:35

【JVM面试篇】高频八股汇总——类加载和类加载器

目录 1. 讲一下类加载过程&#xff1f; 2. Java创建对象的过程&#xff1f; 3. 对象的生命周期&#xff1f; 4. 类加载器有哪些&#xff1f; 5. 双亲委派模型的作用&#xff08;好处&#xff09;&#xff1f; 6. 讲一下类的加载和双亲委派原则&#xff1f; 7. 双亲委派模…...

编程新知 2025/9/23 0:32:25