前期准备

微信小程序作为现在流行的一种应用载体,很多小伙伴都有对其做自动化测试的需求,由于腾讯系 QQ、微信等是基于腾讯自研 X5 内核,不是谷歌原生 webview,所以调试会有些许差异(现在很多 app 产品也开始流行采用 X5 内核作为其内嵌 Web 浏览服务)。

genymotion、夜神等模拟器是intel的X86架构,很多app安装不了,比如微信、qq等(虽然说可以通过安装arm解释器来解决该问题,但是进行X5内核调试的话也会出现问题),建议最好是一台真实的手机来做。

需要注意的是 X5 内核只支持手机,模拟器是不支持的。调试和抓取小程序webview这些都需要真机完成
链接:http://testingpai.com/article/1615452452052


1、        打开手机微信调试模式

微信基于腾讯自研X5内核,所以需要对手机开启X5调试模式,设置允许抓取小程序的Inspect,方便对页面元素进行定位,这些工作的前提都需要开启调试模式

 

打开webview微信小程序的开关

1、 往文件助手或微信好友发送http://debugx5.qq.com,这个页面可正常打开,X5内核的设置页面

 

微信开发工具自动运行设置 微信自动程序_微信开发工具自动运行设置

2、 如果点击这个http://debugx5.qq.com,进到的页面提示当前非X5内核,按照给出的提示操作,聊天框输入http://debugtbs.qq.com并点击,提示要在聊天输入框输入debugmm.qq.com/?forcex5=true

3、 根据提示,在聊天输入框输入debugmm.qq.com/?forcex5=true,并点击,弹出如下

 

微信开发工具自动运行设置 微信自动程序_chrome_02

4、 成功切换之后,再点击http://debugx5.qq.com,就可以进到X5调试内核页面

 

微信开发工具自动运行设置 微信自动程序_微信_03

5、 首次打开,要安装线上内核,点击【安装线上内核】,会自动开始下载,下载完成后,提示重启,点击重启;最好将微信也一起结束进程重启一下。

6、 点击DebugX5,进可以进到第一步的页面,设置抓取小程序webview的开关了

 

微信开发工具自动运行设置 微信自动程序_webview_04

7、 如果第六步报“debugx5页面仅在x5内核时有效,由于当前没有使用X5内核,无法打开Debugx5”,这个时候微信重启,重新打开吧

 

微信开发工具自动运行设置 微信自动程序_微信开发工具自动运行设置_05

2、        验证是否能抓到微信小程序的webview

前提条件:手机通过数据线连接到电脑端,电脑端打开chrome,输入chrome://inspect/#devices,即可在这里看到连接的设备和抓取到信息。

 

微信开发工具自动运行设置 微信自动程序_webview_06

 

 

 

Chrome 自带的 inspect 工具识别小程序/内嵌 Web 页面需要访问外网

建议使用:uc-devtools进行抓取inspect,国内有些限制,抓取到的inspect为空白。下载地址:https://dev.ucweb.com/(注:不能在谷歌浏览器下载,弹不出下载提示框)

 

微信开发工具自动运行设置 微信自动程序_微信开发工具自动运行设置_07

打开微信,调起小程序,就可以查看抓到的webview了

3、        !!!微信最新版本不能抓取到webview

安装了微信最新版本,操作小程序,怎么都抓不到小程序的webview

解决方案:降低微信版本到7.0.22

 

操作方法:
1、有些应用商场是有历史版本可以下载的,可先下载应用商城,搜索微信,选择历史版本,选择7.0.22进行安装(7.0.10版本太低,登录提示要用新版本)

豌豆荚可用

2、卸载最新版本前,先将手机的聊天记录备份到电脑端,使用完之后,可以将电脑端的聊天记录恢复到手机

3、重装了7.0.22版本的微信后,打开微信小程序的webview的方法同第一大点的步骤,抓不到,重启再试试!

参考文章:

实际操作

1、配置chromeDriver

和app自动化类似,依靠appium做自动化,小程序本质上还是 Web 页面,我们可以通过 chromeDriver 驱动小程序页面执行,小程序因为使用的 X5 内核是经过腾讯二次开发过之后的,所以 chromeDriver 驱动与 webview 版本匹配并不严格按照官方 Appium 说明的匹配规则,这里试验了几个版本的 chromeDriver,发现 V2.40 版本

下载地址:https://npm.taobao.org/mirrors/chromedriver

下载完毕后解压,将 chromeDriver 替换到 Appium 的自带 chromeDriver 所在路径:

Appium.exe所在路径\resources\app\node_modules\appium\node_modules\appium-chromedriver\chromedriver\win

下载完成后,到appium配置驱动的执行路径,设置前置,使用这个前置启动

 

微信开发工具自动运行设置 微信自动程序_webview_08

2、获取小程序的对应进程名

在获取小程序进程名前,要先获取微信的包名

com.tencent.mm

获取小程序的进程名

adb shell dumpsys activity top | findstr ACTIVITY

 

微信开发工具自动运行设置 微信自动程序_微信_09

3、uc-devtools进行元素的定位,编写定位元素的定位

微信开发工具自动运行设置 微信自动程序_chrome_10

 

 

3、代码实现

1、 和app自动化一样,要先打开app,打开app的配置信息

 

微信开发工具自动运行设置 微信自动程序_chrome_11

 

 

微信开发工具自动运行设置 微信自动程序_微信_12

2、启动微信进入到主页-> 下滑展开小程序列表-> 点击对应小程序

3、进入到小程序,实际上是webview,需要切换到webview进行操作,这个时候就需要用到切换上下文,switch_to.context()

4、切换到小程序之后,实际上是操作chrome页面,定位元素要用回要用webdiriver的定位元素的BY

参考:(详细讲解了小程序)