微信小程序测试总结篇

此文已由作者吴琪惠授权网易云社区发布。

欢迎访问网易云社区，了解更多网易技术产品运营经验。

下载工具包

1. 点击下载工具包并安装，点击下载

2. 准备好开发代码（从git/svn下载）

3. 打开工具，登录微信账号，导入测试代码

4. ps:微信小程序的测试需要微信开发者权限以及项目代码权限，需要找项目负责人

使用开发者工具测试

1、支持选择不同屏幕的模拟机，支持选择wifi、4G等网络环境下测试

2、清缓存，比较常用的是退出微信登录，模拟未登录态

3、切换微信账号是指换一个微信账号登录开发者工具：

4、编译模式

微信开发者工具默认了一种编译模式，指定的页面为：pages/index/index，页面参数为空，编译成功后进入到小程序的首页。

但在一些场景下，我们需要直接指定编译到某个页面，比如：

• 页面入口还没有实现，无参数进入页面

比如严选周年庆时，周年庆入口和周年庆页面的开发不是同一个人，页面已经完成开发但入口还没能实现，为了能够及时测试，QA需要直接进入到页面测试，这时候，我们可以这样设置：

编译模式 --> 新增模式 --> 指定页面，编译时选择自定义编译模式进入到指定页面

• 需要添加参数的编译模式

另一种场景，比如拼团，我们需要一个非常复杂的前置条件（比如开团，参团，验证手机号，验证新人身份，凑齐3个人）才能进入到多个人拼团成功的页面，在这个页面有一个显示的bug需要复现，因为复现的路径太复杂，我们可以通过自定义编译模式直接进入到拼团成功页，查看页面显示情况，节省测试复现时间。

5、调试器辅助测试

整体上，调试工具分为 7 大功能模块：Wxml、Console、Sources、Network、Appdata、Storage、Sensor、Trace，简单说下几个常见使用的panel

1、console下跟chrome基本一致，查看控制台报错信息

2、network，查看页面请求、响应值

3、wxml跟chrome的element基本一致，这里是 wxml 转化后的界面，可以看到真实的页面结构。我们可以通过修改一些参数值来测试字符串过长、过短、截断、为空等问题

4、Appdata是页面的动态数据，是接口返回的请求值，我们可以通过修改appdata的值来伪造接口返回，他能实时的反馈到界面上显示，能节省很多QA造数据的时间。

5、source是用于当前项目的脚本文件的，可用于断点调试，精准提bug

6、storage 用于显示当前项目的一些数据存储的信息，比如我们显示的是登录认证的cookie等，当我们编辑cookie/session来伪造假的登录数据来参与拼团、下单等操作，验证服务端是否会返回正确的响应。

6、设置代理，进入设置-->代理设置，默认使用系统代理，可通过修改hosts来指定请求网络，或者可以手动设置代理，如图设置了fiddler的代理路径，可通过fiddler抓包

真机测试

通过点击预览按钮，生成二维码，使用有开发者权限的微信，打开微信扫一扫二维码进入真机体验。开发板允许打开调试和性能窗口进行简单的页面请求调试和性能数据查看。

远程调试

点击远程调试之后，等待设备接入调试，待微信扫一扫进入之后，进入远程调试状态，这个功能能够方便开发定位不同型号手机上出现的问题。

网易云免费体验馆，0成本体验20+款云产品！ 

更多网易技术、产品、运营经验分享请点击。

相关文章：
【推荐】 jQuery到Vue的迁移之路