python+playwright自动化如何解决文件上传问题

最近在使用python+playwright框架做网页UI自动化,该框架的录制功能很厉害和强大。录制后直接将录制的代码复制到python中,很方面和好用。

在使用该浏览器录制功能的时候,录制的文件上传代码运行不成功。

复制代码
page.locator("div").filter(has_text=re.compile(r"^\+$")).first.click()
page.locator("body").set_input_files("测试pdf文件.pdf")

无论怎样都识别不了并上传文件。

我在网上查询资料,找到了上传文件的第一种方法。

复制代码
# with page.expect_file_chooser() as fc_info:
#     page.locator("div").filter(has_text=re.compile(r"^\+$")).first.click()
# page.pause()
# file_chooser = fc_info.value
# file_chooser.set_files("/Users/zc/desktop/1.png")

这种方法可以成功的上传文件,但是在跑自动化的时候会自动弹出一个页面,需要手动在这个页面上点击启动按钮,才可以成功上传文件。这对于跑自动化不太友好。另外,对于多个文件的上传该功能也不好使用。

为解决文件上传定位不了的问题,使用page.set_input_files()函数来解决,set_input_files有selector和files参数。set_input_files只能使用于input标签中type="file"类型,selector是文件上传入口定位参数,files是上传文件的路径。打开网页使用f12来定位上传文件的前端代码元素。

<div data-v-15edcce14="" class="upload-box">

<input data-v-15edcce14="" type="file" id="upFile" accept="image/png, image/jpeg"><div data-v-12edcce8="" class="icon-before"><span data-v-12edcce8="">+</span></div></div>

尝试使用page.set_input_files('input[id="upFile"]',"/Users/zc/desktop/1.png") 并测试,可以正常上传文件。

如果有多个文件上传,同时文件上传都是 type="file" id="upFile"的input类型的元素。此时我们可以观察其他参数是否不一样,如果不一样的话可以通过其他参数的定位并上传文件。

如果其他参数都一致如何解决问题呢?我们可以通过xpath或元素索引来定位并上传。下面我们讲通过索引来定位并上传文件的方法。

最开始我使用page.locator('input[id="upFile"]'):nth-of-type(index).set_input_files("上传的文件")的方法来上传,但是识别不了上传的入口,尝试寻找识别不了的原因,暂时没有找出来。

page.locator('input[id="upFile"]'):nth-of-type(1).set_input_files("/Users/zc/desktop/1.png")

page.locator('input[id="upFile"]'):nth-of-type(2).set_input_files("/Users/zc/desktop/1.png")

然后我换了下面的索引方式来尝试,文件都可以对应的上传成功。

复制代码
page.locator('input[id="upFile"]').nth(0).set_input_files("/Users/zc/desktop/1.png")
相关推荐
King's King2 小时前
超详细的自动化立体仓库技术标书-模板
运维·自动化
TTBIGDATA2 小时前
【Ambari开启Kerberos】Step1-KDC服务初始化安装-适合Ubuntu
运维·数据仓库·hadoop·ubuntu·ambari·hdp·bigtop
syker3 小时前
NEWBASIC 2.06.7 API 帮助与用户使用手册
开发语言·人工智能·机器学习·自动化
Fr2ed0m4 小时前
Nginx防御HTTP Host头注入漏洞:实战配置漏洞修复教程
运维·nginx·http
安审若无4 小时前
linux怎么检查磁盘是否有坏道
linux·运维·服务器
HalvmånEver4 小时前
Linux的第二章 : 基础的指令(二)
linux·运维·服务器·开发语言·学习
大梦南柯4 小时前
linux创建网站
linux·运维·服务器
刘永鑫Adam4 小时前
代码管理及Linux模拟工具Git for Windows安装使用教程
linux·运维·服务器·git
孙同学_4 小时前
【Linux篇】信号从哪来?到哪去?—— Linux信号的产生方式与保存机制
linux·运维·服务器