Wx API拦截小程序自动化测试

微信小程序开发教程栏目小程序自动测试

随着小程序的使用越来越多，我们的前端开发也从简单的web开发扩展到了web+小程序的跨端开发。为了提高研发效率，越来越多的web模块需要移植、更新和兼容小程序，实现跨端复用。这些模块也将随着业务的发展而迭代和更新。这时候就需要有好的测试来保证每个模块的可靠性。

因为我们已经把很多现有的web模块迁移到了小程序上，所以web端的测试是比较完整的。所以我们需要考虑的是:

如何快速将现有的web用例迁移到小程序上？

对于新模块，如何快速写出两端用例。

(我们在web端主要用的是木偶师和Jest的搭配。)

你可以直接进入最终计划。

测试模块类型我们目前的模块主要有以下三种类型:

环境无关逻辑层模块和环境相关逻辑层模块和环境相关UI组件模块type 1模块可以与web共享单元测试，无需额外的测试用例开发。

Type 3模块，由于applet和web的差异很大，很难被重用(目前我们的web UI层主要基于React，applet采用原生开发，同时部分页面与kbone同构开发)。

我们在这里主要移植类型2模块的测试用例。

小程序测试工具选择小程序官方目前提供了两个工具来支持小程序测试:

组件单元测试提供了一个测试工具集来支持在nodejs单线程中运行的定制组件。Applet automation为开发人员提供了一个通过外部脚本控制Applet的解决方案。通过将官方工具与Jest、Mocha等测试框架相结合，可以实现小程序环境下的测试。

我们选择了applet自动化。类似于在Puppeteer中运行web端测试，我们可以通过自动化applet和操纵开发人员的工具来实现applet环境中的测试。它们之间的相似性为我们提供了实现测试用例跨端迁移甚至复用的可能性。

如何迁移测试用例以迁移一个报表模块的测试用例为例。下面是一个web报告模块的现有测试用例。

Web测试用例这个用例覆盖的路径是:调用imlog.default.error()方法-& gt；浏览器将发起请求->检查请求参数。

测试('。error()调用是正常的'，async done = & gt{ const opts = { project: 'imlogtest '，}；//检查参数const expector = req = & gt{ try { const URL = req . URL()；const方法= req . method()；const headers = req . headers()；const body = req . postdata()；const data = JSON . parse(body)；期望(url)。toBe(DEFAULT _ URL)；//请求的url符合预期的expect(方法)。toBe(' POST ')；//请求的方法符合预期(头['content-type'])。tobe(' text/plain ')；//请求的contentType符合预期的expect (data.url)。tobe(test _ page _ URL)；//请求体的url字段符合预期的done()；} catch(错误){ done(错误)；} };//监听报表请求，查看参数page.once('request '，expector)；//报表页面。在浏览器中求值((o)= > { const reportor = window . im log . default；reportor . config(o)；reportor . error(“test”)；//Report }，opts)；});主要使用木偶师的页面API复制上面的代码。

Page.evaluate控制页面执行一段逻辑(执行imlog.default.error())。Page.once ('request '，expector)监听页面的请求并获取参数(检测请求是否发起并验证请求参数)。想象applet自动化为我们提供了一些类似于木偶师的API:

miniProgram.evaluate控制applet将代码片段注入AppService并返回执行结果。如果小程序能以监听事件的形式截获wx API的调用参数，那么写测试用例就会方便很多。我们设想的小程序的用例将是以下形式:

测试('。error()调用是正常的'，async done = & gt{ const opts = { project: 'imlogtest '，}；//检查参数const expector = req = & gt{try {// diff:按照特定格式解析applet请求参数const {URL，method，headers，body，data } = parsewxreqparams(req)；期望(url)。toBe(DEFAULT _ URL)；//请求的url符合预期的expect(方法)。toBe(' POST ')；//请求的方法符合预期(头['content-type'])。tobe(' text/plain ')；//请求的contentType符合预期的expect (data.url)。tobe(test _ page _ URL)；//请求体的url字段符合预期的done()；} catch(错误){ done(错误)；} };//监听报表请求，检查参数//todo:miniprogram对象支持once/on等事件方法，比如mini program。一次(“请求者”，期待者)；//向miniProgram.evaluate报告((o)= & gt；{// diff:请求方法挂在applet对象const report or = getapp()上。imlog.defaultreportor . config(o)；reportor . error(“test”)；//Report }，opts)；});复制代码只要我们想办法监听调用api时以事件形式和miniProgram.on形式传递的参数(' API '，fn)。

在这种形式下，web和applet用例之间的唯一区别是:

将网页中页面对象的操作传递给小程序对象，完成网页中窗口下加载的方法。小程序中app下加载的web和小程序中解析请求参数的方式不同。wx API拦截方法首先观察mini-program对象，通过mini-program -automator暴露的MiniProgram.d.ts，可以发现mini-program类本身继承了EventEmitter。

从“事件”中导入{ event emitter }；导出默认类微型程序扩展事件发射器{//...}复制代码需要找到一种方法，在调用api时触发迷你程序对象的emit方法。

有两个自动化API可以帮助我们实现这一点。

MiniProgram.mockWxMethod允许我们覆盖wx对象上指定方法的调用结果。

MiniProgram.exposeFunction在AppService中全局公开方法，供applet端调用测试脚本中的方法。

此时，一个大胆的想法涌上心头。

这几篇文章你可能也喜欢：

• 自动测试小程序的Wx API拦截

本文由主机参考刊发，转载请注明：Wx API拦截小程序自动化测试 https://zhujicankao.com/120636.html