小程序自动化测试

背景

近期团队打算做一个小程序自动化测试的工具，期望能够做到业务人员操作一遍小程序后，自动还原之前的操作路径，并且捕获操作过程中发生的异常，以此来判断这次发布是否会影响小程序的基础功能。

上述描述看似简单，但是中间还是有些难点的，第一个难点就是如何在业务人员操作小程序的时候记录操作路径，第二个难点就是如何将记录的操作路径进行还原。

自动化 SDK

如何将操作路径还原这个问题，首选官方提供的 SDK： miniprogram-automator。

小程序自动化 SDK 为开发者提供了一套通过外部脚本操控小程序的方案，从而实现小程序自动化测试的目的。通过该 SDK，你可以做到以下事情：

• 控制小程序跳转到指定页面
• 获取小程序页面数据
• 获取小程序页面元素状态
• 触发小程序元素绑定事件
• 往 AppService 注入代码片段
• 调用 wx 对象上任意接口
• ...

上面的描述都来自官方文档，建议阅读后面内容之前可以先看看官方文档，当然如果之前用过 puppeteer ，也可以快速上手，api 基本一致。下面简单介绍下 SDK 的使用方式。

// 引入sdk
const automator = require('miniprogram-automator')

// 启动微信开发者工具
automator.launch({
  // 微信开发者工具安装路径下的 cli 工具
  // Windows下为安装路径下的 cli.bat
  // MacOS下为安装路径下的 cli
  cliPath: 'path/to/cli',
  // 项目地址，即要运行的小程序的路径
  projectPath: 'path/to/project',
}).then(async miniProgram => { // miniProgram 为 IDE 启动后的实例
	// 启动小程序里的 index 页面
  const page = await miniProgram.reLaunch('/page/index/index')
  // 等待 500 ms
  await page.waitFor(500)
  // 获取页面元素
  const element = await page.$('.main-btn')
  // 点击元素
  await element.tap()
	// 关闭 IDE
  await miniProgram.close()
})

有个地方需要提醒一下：使用 SDK 之前需要开启开发者工具的服务端口，要不然会启动失败。

捕获用户行为

有了还原操作路径的办法，接下来就要解决记录操作路径的难题了。

在小程序中，并不能像 web 中通过事件冒泡的方式在 window 中捕获所有的事件，好在小程序所以的页面和组件都必须通过 Page 、Component