Web自动化必知：常见弹框处理与iframe操作实践总结

📝 面试求职： 「面试试题小程序」 ，内容涵盖 测试基础、Linux操作系统、MySQL数据库、Web功能测试、接口测试、APPium移动端测试、Python知识、Selenium自动化测试相关、性能测试、性能测试、计算机网络知识、Jmeter、HR面试，命中率杠杠的。（大家刷起来…）

📝 职场经验干货：

软件测试工程师简历上如何编写个人信息（一周8个面试）

软件测试工程师简历上如何编写专业技能（一周8个面试）

软件测试工程师简历上如何编写项目经验（一周8个面试）

软件测试工程师简历上如何编写个人荣誉（一周8个面试）

软件测试行情分享（这些都不了解就别贸然冲了.）

软件测试面试重点，搞清楚这些轻松拿到年薪30W+

软件测试面试刷题小程序免费使用（永久使用）

近期在完成商业化付费触点UI自动化过程中，遇到了无法定位到会员购买弹框的问题，在经过一顿百度后发现，原来是因为弹框是iframe类型导致，iframe弹框无法像普通的对话弹框那样去定位，所以这里分享总结了下弹框的类型以及定位方式，仅供学习参考。

01 浏览器原生弹框

浏览器原生弹框的类型、触发方式以及特点

02 自定义模态弹框

天空一碧如洗，灿烂的阳光正从密密的松针的缝隙间射下来，形成一束束粗粗细细的光柱，把飘荡着轻纱般薄雾的林荫照得通亮。

03 特殊类型（重点iframe）

天空一碧如洗，灿烂的阳光正从密密的松针的缝隙间射下来，形成一束束粗粗细细的光柱，把飘荡着轻纱般薄雾的林荫照得通亮。

04 Playwright 下 iframe定位方法

第一：基础定位

# 通过iframe属性定位
frame = self.page.frame_locator('iframe#payment-frame')
# 通过父容器定位
frame = self.page.locator('.modal-container >> iframe').frame_locator()

第二：内容操作

# 在iframe内操作元素
frame.locator('#credit-card').fill('4111111111111111')
frame.locator('text=确认支付').click()
# 切换回主文档
self.page.main_frame

第三：动态处理iframe

# 等待iframe加载完成
frame = page.wait_for_selector('iframe.modal-iframe').content_frame()
# 监听iframe加载事件
with page.expect_frame_load(page.frame('iframe')):
    page.click('text=打开支付'

05 iframe 特殊场景处理

跨域iframe

# 确保允许跨域访问（测试配置）
context = browser.new_context(
    permissions=['cross-origin-isolated']
)

多层嵌套iframe

# 逐层定位
parent_frame = page.frame_locator('iframe#level1')
child_frame = parent_frame.frame_locator('iframe#level2')
child_frame.locator('button').click()

综上，通过识别<iframe>标签及其嵌套特征，结合Playwright的frame API，可以可靠地操作各类iframe弹框，建议优先使用frame_locator()而非直接frame()方法，后者在动态加载时易失效。

最终实践

通过页面dom结构获取iframe信息：

1.包含iframe标签，确认弹框类型是iframe

2.iframe的id信息

UI自动化脚本：

最后： 下方这份完整的软件测试视频教程已经整理上传完成，需要的朋友们可以自行领取【保证100%免费】

​​