![102a7c7b5e618d740d4367d6b18d42c9.png](https://i-blog.csdnimg.cn/blog_migrate/4b752289a6c2e4d7e5e1b9aaec2c5421.jpeg)
背景
最近呢,刚好我司的电商管理后台需求稳定,没有迭代,就尝试做了 web UI 自动化测试。 路漫漫其修远兮, 在自动化的道路上迎来了第一个坎—— 文件上传,基本上的上传按钮都为非 input 标签。做过UI自动化测试的小伙伴都知道,文件上传这个功能在很多系统中都会存在,比如个人信息系统有上传个人头像功能,邮件系统有发送邮件附件功能,电商系统有多处上传图片功能,那么我们在selenium中应该如何操作呢?一般上传文件按钮的类型可以分为两种,即input类型,非input类型。
对于通过 input 标签实现的通过上传,可以将其看作一个输入框,通过 send_keys()传入本地文件路径从而模拟上传功能。如下图所示:利用autoit工具编写合适的脚本,并将脚本编译成可执行文件
定位到上传文件按钮,点击此按钮,打开os窗口
执行可执行文件,文件上传成功
环境搭建
首先是环境的搭建----AutoIt的安装,这个超级简单,下载后直接下一步就行了。
AutoIt官网下载地址:https://www.AutoItscript.com/site/AutoIt/downloads/
![0de2b04f4f5ffeb1be155adf14b14032.png](https://i-blog.csdnimg.cn/blog_migrate/312b78ea09421eeec3b1dc2e8d3fa1b7.jpeg)
下载后直接安装,就可以使用了~
单个文件上传
好,工具准备好了,我们就来用单个文件的上传练个手,此时我们已经定位到了打开文件按钮,点击该按钮后弹出下图所示的文件上传窗口:
1、打开AutoIt Windows Info工具,用鼠标拖住工具上的Finder Tool的图标到要识别的控件上,即拖到“打开”按钮上,左侧会生成一些数据信息:
![b4af940b64d02b053e5773281db3a269.png](https://i-blog.csdnimg.cn/blog_migrate/bdca80bf70af9abd5a9577ab9155b59b.jpeg)
如截图所示:窗口的Title为文件上传,Class为#32770。打开按钮的class 为“Button”,Instance为1。我们就是利用控件的这些信息,定位控件,编写脚本。
2、根据以上所识别的控件信息,在SciTE-Lite中编辑脚本信息,此处的D:\ym1.png为存放图片的地址,保存后生成au3文件。
如果是Firefox浏览器,则为:
WinActivate("文件上传");ControlSetText("文件上传", "", "Edit1", "D:\ym1.png");Sleep(2000);ControlClick("文件上传", "", "Button1");
如果是Chrome浏览器,则为:
ControlFocus("打开","text","Edit1")WinWait("[CLASS:#32770]","",10)ControlSetText("打开","","Edit1","D:\ym1.png")Sleep(2000)ControlClick("打开","","Button1")
说明:
ControlFocus("title", "窗口文本", controlID) ,设置输入焦点到指定窗口的某个控件上
WinWait("title","窗口文本", 超时时间) ,暂停脚本的执行直至指定窗口存在为止
Sleep(延迟) ,使脚本暂停指定时间段
ControlClick("title", "窗口文本", 控件ID, 按钮, 点击次数) ,向指定控件发送鼠标点击命令
3、AutoIt脚本编写完成后进行保存,然后打开auit编译脚本工具---Aut2exe.exe,将au3文件转换成exe文件。
![b798c34e6fed1ff57c0aa5d14258e137.png](https://i-blog.csdnimg.cn/blog_migrate/21e38edccd01b494ab0869b258f6ecb5.png)
4、在转换成.exe文件后,我们在cmd中执行该exe文件,确认脚本是否正常执行-----直接将exe文件拖拽到cmd里,执行回车,在文件上传窗口出现对应的文件就代表可以正常执行。
![3ea5aa8d36012875aefc1adfb230f2da.png](https://i-blog.csdnimg.cn/blog_migrate/69fa5d815eb473dd2340a65b4134f52f.png)
![3f92b45face39bbb75c85142d5a9a6fe.png](https://i-blog.csdnimg.cn/blog_migrate/4f04cfc575936113a1e4035d57d9d235.png)
5、上一步执行成功后,就可以用执行Python脚本了。
![aef80d45ca9dbb8f806273f77d0372d1.png](https://i-blog.csdnimg.cn/blog_migrate/9b0293b4dbb3f947039e9e072e91dc66.png)
OK,单个文件的上传到这边就结束了。
多个文件上传
然而,在实际测试过程中,我们碰到更多的是需要上传多个文件,其实单个文件和多个文件上传,主要是脚本信息的区别,通过参数化文件路径来实现多个文件的上传。
那我们就用我司的电商管理后台上传商品详情图片为例来实践一下吧:电商管理后台-商品管理-新增-上传图片-弹出选择图片界面:
使用AutoIt Windows Info 工具识别控件信息,如下图所示:
![7a6d589c25729e55359d04744f2bc3f4.png](https://i-blog.csdnimg.cn/blog_migrate/8ea0c8620f5f3f60b283faa73d347421.jpeg)
![f70b2e2bf4940de9f5c9de11a20e67c2.png](https://i-blog.csdnimg.cn/blog_migrate/3759dde7c99f93043a467df5a3ecac22.jpeg)
元素定位好后,打开 SciTE Script Editor编辑器,编写脚本:
$CmdLine[0] ;参数的数量
$CmdLine[1] ;第一个参数 (脚本名称后面)
$CmdLine[2] ;第二个参数
都是从cmd传入参数。
脚本编写完成后进行保存,同样将au3文件转换成exe文件:
![4cad262ee30c92158eaf2fa202512b3f.png](https://i-blog.csdnimg.cn/blog_migrate/fb18b509b5c573f4f765e895d3c8ecc2.png)
现在我们用Python来执行这个exe文件就能实现多个文件上传了!
至此,文件上传就解决啦,其他文字属性的元素就比较简单了,以后只要run一下就可以自动新增商品了,省时省力。
正在写web自动化的你,如果有其他更好的文件上传的方法,可以一起交流哦~