运行环境
- 开发者工具版本 v1.02.1907232及以上:目前我使用的是stable v1.02.1907300(稳定版)
- 基础库版本为 2.7.3 及以上:直接选用最新的即可
- 安装 Node.js 并且版本大于 8.0:目前我使用的是v10.15.1
初始化
1. 新建文件夹存放测试代码
mkdir miniprogram-demo-test
2. 下载依赖
小程序自动化 SDK 本身不提供测试框架,官方使用 Jest 测试框架来编写小程序自动化测试(需要自己去学习)
$ npm i miniprogram-automator --save-dev //在需要测试的项目目录下安装小程序自动化SDK
$ npm i miniprogram-automator jest //Jest依赖
$ npm i jest -g //Jest依赖
3. 下载小程序Demo,并导入开发者工具
Git地址:(https://github.com/wechat-miniprogram/miniprogram-demo)
编写测试脚本(还需要到项目中实战,具体API见官网)
1. 打开CLI/HTTP 调用功能:操作步骤如下
- 打开小程序
- 选择【安全设置】
- 选择【安全】
- 勾选【开启】按钮
2. 创建测试脚本index.spec.js
3. 编写测试脚本,思路如下
- 启动并连接工具
- 重新启动小程序到首页
- 断开连接并关闭工具
示例代码如下:
const automator = require('miniprogram-automator')
describe('index', () => {
let miniProgram
let page
beforeAll(async () => {
miniProgram = await automator.launch({ //第一步:启动并连接工具
//cliPath可以设置也可以不设置,如果未设置则默认从/Applications/wechatwebdevtools.app/Contents/MacOS/cli寻找
// cliPath: '/Applications/wechatwebdevtools.app/Contents/MacOS/cli',
projectPath: '/Users/${username}/IdeaProjects/miniprogram-demo-test/miniprogram-demo' //${username}需要更改为你的电脑的username
})
page = await miniProgram.reLaunch('/page/component/index') //第二步:重新启动小程序到首页
await page.waitFor(500)
}, 30000)
afterAll(async () => {
/**
* miniProgram.close() 表示:断开与小程序运行时的连接并关闭项目窗口
* miniProgram. disconnect() 表示:断开与小程序运行时的连接
*/
await miniProgram.close() //第三步:断开连接并关闭工具或者使用
})
// 编写测试代码
/**
* 测试顶部描述
* 通过.index - desc 选择器获取目标元素
* 目标元素应该是个 view 组件
* 目标元素应该包含有“以下将展示小程序官方组件能力”的文本
*/
it('desc', async () => {
const pageStack = await miniProgram.pageStack
console.log("查看页面堆栈数量:" + pageStack)
const desc = await page.$('.index-desc')
expect(desc.tagName).toBe('view')
expect(await desc.text()).toContain('以下将展示小程序官方组件能力')
console.log(await desc.wxml())
console.log(await desc.outerWxml())
console.log(await desc.style('color'))
//滑动位置错误到话,会引起报错,如下两行代码有问题
// await miniProgram.pageScrollTo(160);
// console.log("将页面滚动到指定位置")
})
/**
* 测试列表项
* 获取列表元素集合
* 目标元素集的个数应该是 8 个
* 第一个列表元素的标题应该是“视图窗器”
*/
it('list', async () => {
const lists = await page.$$('.kind-list-item')
expect(lists.length).toBe(8)
const list = await lists[0].$('.kind-list-item-hd')
expect(await list.text()).toBe('视图容器')
})
/**
* 测试列表项行为
* 点击列表标题应该展示或隐藏子列表
* 点击子列表项应该会跳转到指定页面
*/
it('list action', async () => {
const listHead = await page.$('.kind-list-item-hd')
expect(await listHead.attribute('class')).toBe('kind-list-item-hd')
//tap:点击元素,可以理解为点击事件
//element.longpress:长按,例子中没有举例
await listHead.tap()
await page.waitFor(200)
expect(await listHead.attribute('class')).toBe(
'kind-list-item-hd kind-list-item-hd-show',
)
await listHead.tap()
await page.waitFor(200)
expect(await listHead.attribute('class')).toBe('kind-list-item-hd')
await listHead.tap()
await page.waitFor(200)
const item = await page.$('.index-bd navigator')
await item.tap()
await page.waitFor(500)
const currentPageInfo = await miniProgram.currentPage
console.log("获取当前页面信息:" + currentPageInfo)
const systemInfo = await miniProgram.systemInfo
console.log("获取当前系统信息:" + systemInfo)
expect((await miniProgram.currentPage()).path).toBe('page/component/pages/view/view')
/*
* 以下注释的四个执行失败,因为该方法 需要跳转的应用内非 tabBar 的页面的路径
*/
// const JumpPage = await miniProgram.navigateTo('/page/component/index')
// console.log("保留当前页面,跳转应用的某个页面:=="+JumpPage.path)
// const redirectPage = await miniProgram.redirectTo('/page/component/index')
// console.log("关闭当前页面,跳转到应用内的某个页面:"+redirectPage.path)
const tabBarPage = await miniProgram.switchTab("/page/component/index")
console.log("关闭其他非tabBar页面,并跳转到指定到tabBar页面")
})
})
执行脚本,查看执行情况
jest index.spec.js
如果控制台输出以下信息:说明执行成功
PASS ./index.spec.js (5.341s)
index
√ desc (18ms)
√ list (14ms)
√ list action (1274ms)
Test Suites: 1 passed, 1 total
Tests: 3 passed, 3 total
Snapshots: 0 total
Time: 6.378s
Ran all test suites matching /index.spec.js/i.
微信官方文档: https://developers.weixin.qq.com/miniprogram/dev/devtools/auto/
网友评论