最近没啥事然后有个不是需求的需求。老大突然间看到了小程序自动化工具,于是让我研究一下。
微信官方的文档真的是很简洁。感觉好多地方都没说清楚。。。
小程序自动化官方文档
闲话不多说首先我们要先安装自动化插件
npm i miniprogram-automator --save-dev
任意打开一个小程序进入到微信开发者工具->设置->安全->选择开启服务端口->重新打开开发者工具
说明微信开发者工具端口开启成功!
接下来我们要开启连接微信开发者工具服务端口对应的自动化端口(两个端口是不一样的)
在开发这工具的安装目录下打开命令行工具输入
./cli.bat --auto C:\Users\洪伟江\Desktop\IT自学\testXCX --auto-port 9420
C:\Users\洪伟江\Desktop\IT自学\testXCX是对应要进行项目自动化的小程序目录地址;
9420是自动化的端口
命令行出现如下代码说明自动化开启成功,届时会自动启动微信开发这工具
接下来就可以开始写我们的自动化脚本了
miniprogram-automator自动化插件是基于node的因此我们需要用node来编写脚本。
const automator = require('miniprogram-automator');//引入自动化工具
automator.connect({
wsEndpoint: 'ws://localhost:9420',//连接到9420端口
}).then(async miniProgram => {//连接成功
// 从首页重启
const page = await miniProgram.reLaunch('/pages/index/index')
const joinBtn = await page.$$('.index__card')
await joinBtn[0].tap()//点击事件
let enterPage = await miniProgram.reLaunch('/pages/joinConference/index')//加入会议页面
const input = await enterPage.$$('input')//获取标签名为input的集合
await input[0].trigger('input',{value: 12312312})//input框输入事件,这里的第二个参数对应小程序event事件中的detail下的对象
await page.waitFor(500)//等待500ms
await input[0].trigger('blur')
await page.waitFor(500)
await input[2].trigger('input',{value: 1234})
await page.waitFor(500)
await input[2].trigger('blur')
await page.waitFor(500)
const button = await enterPage.$('button')
await button.tap()
// const page = await miniProgram.reLaunch('/pages/index/index')
// const input = await page.$('input')
// // console.log(await page.data())//获取页面的data数据
// await page.setData({motto: '12242342'})//通过修改直接修改data数据
// await input.trigger('change',{a: '23433534647687990'})//输入框改变的事件
// const test = await page.$('test')//组件
// await test.trigger('test',{a: '12423423'})
// console.log(await test.callMethod('methods'))//组件的事件
}).catch(e => {
console.log('catch a error', e);
});
编写完脚本之后再命令行中启动脚本
接下来就可以看到微信开发者工具的小程序根据你的脚本自动的输入文字和跳转了。还可以进行真机调试哦!!!