一提到H5测试,做WEB测试的朋友肯定早已经非常熟悉,它包括页面H5功能测试,前端性能测试,浏览器兼容性能测试,以及服务端性能测试。今天我们来一起了解下H5测试的测试点,希望可以帮助大家了解:如何进行H5页面的测试,如何发现问题以及相应的优化规则。
H5页面的测试点汇总:
业务逻辑相关
除基本的功能测试之外,H5页面的测试,需要关注以下几点:
1、登陆
目前H5与native各个客户端都做了互通,所以大家在测试的时候要注意两点:
A、若客户端已登录,那么进入H5后仍然是登录状态。
B、若客户端未登录,进入H5,点击对应按钮OR链接,如果需要登录,须拉起native登录。若取消登录,是否可再次拉起登录,或者停留在的页面是否有对应的登录提示。
ps:本次测试过程中就发现,第一次点击链接,可以拉起登录,第二次却不能。
2、翻页
遇到翻页加载的页面,需要注意内容为1页或者多页的情况。
A、数据分页加载时,注意后续页面请求数据的正确。
ps:这个需要注意在快速操作场景中,请求页数是不是依次递增,快速操作(如第一页尚未loading出来的时候仍然继续上拉操作)时是否发出去对应的请求了。
3、刷新与返回
A、下拉刷新是否仍然处于当前页面。
B、用户主动点击刷新按钮是否仍然处于当前页面。
C、点击返回与back键,回退页面是否是期望页面
ps:本次测试过程中就发现,mtop接口请求成功,但是data内无数据时,返回到的就是个空白页面,无法正常发送请求。
4、 mtop接口返回处理
发现这个出现问题的地方有很多,但是只要有意识的去处理,就很容易避免,主要是以下几种情况:
A、请求成功,且返回有数据,测试mtop接口返回数据的各种场景。
B、请求成功,但data内容为空。
C、请求接口异常,出现ERR_SID_INVALID::SESSION过期,拉起登录。
D、请求接口发生除C中提到的异常之外的异常,通常可归结为一类进行处理。
H5适配相关
H5的适配其实比客户端的相对来说,要少一些,手机品牌之间的差异不大,所以不用太多关注,最容易出现问题的系统,这个要特别关注下:
A、大屏(如720*1280,重点关注页面背景是否完全撑开页面,刷新是否有抖动)、小屏手机(如320*480,重点关注下弹框样式和文案折行)
B、android4.X随机找一个即可。
C、ios9、ios8、ios7。
网络相关
不同网络类型测试
a)考虑2G\3G\4G\wifi网络
b)考虑移动网络2G\3G\4G基站的变化的影响
c)无连接、关闭连接状态
d)弱网络信号状态
e)有网络信号但网络不可达状态
测试注意点
a)从wifi切换到2G/3G网络、从2G/3G网络切换到wifi等
b)弱网络降级:处于2G/3G网络省流量模式的一些特殊处理,比如2G网络下测试,图片多时是否要懒加载等
c)无网络时,执行需要网络的操作,给予友好提示,并确保不会导致应用crash;
d)内网测试时,要注意选择到外网操作是的异常情况处理;
e)弱网络下,检查功能状态是否正常,确保不因提交数据失败而造成异常甚至应用crash;
f)弱网络下,检查数据是否一直处于提交中的状态,如遇数据交换失败要给予提示;
g)弱网络下,执行操作后,在回调没有完成的情况下,退出本webview或者其他操作,有无异常
安全相关
1、明确投放渠道都有哪些
如独客、主客、wap,是否对未投放渠道做了限制,直接通过url请求是否拦截等
2、评估是否需要接入集团安全,如mtee黑白名单等。
3、是否需要接入支付宝实名认证
涉及到金钱相关,如天猫积分,红包等,为了防刷,一般都需要判断是否支付宝实名认证。
4、是否接入windvane,所有请求通过native发出。
操作页面体验相关
1、资源相关
A、页面中有图片的话,淘宝那边建议图片一般不大于50kb,本着一个原则,尽量缩小图片。
B、资源是否压缩、是否通过CDN加载。
C、如何保证二次发布后有效更新。
2、流量
A、对于一些不会变化的图片,如游戏动画效果相关图片,不需要每次都请求的东西,做本地缓存。
B、数据较多时是否做了分页加载。
3、页面展现时间
A、关注页面首屏加载时间。
4、页面提示
A、弱网络下,数据加载较慢,是否有对应的loading提示。
B、接口获取异常时,提示是否友好。
C、刷新页面或者加载新内容时页面是否有抖动。
5、手机操作相关
A、锁屏之后展示页面。
B、回退到后台之后,重新呼出在前台展示。
埋点数据检查
与BI、前端同学一起确认埋点情况。
总结:
随着科技的进步,H5页面的普及和运用正深深的影响着每个行业的发展,我们可以发现在各种各样的App,都从Native APP往Hybird APP发展,比如微信、手机淘宝、支付宝等重量级应用,都在多个入口嵌入了H5,因此,H5的测试需求也是非常大的。
废话少说,最后给大家分享一个小干货——一张图玩转H5测试,其目的在于,当一个测试员拿到一个H5的测试任务时,可以引导你怎么去思考来完整的测试你的业务:
欢迎加入 51软件测试大家庭,在这里你将获得【最新行业资讯】,【免费测试工具安装包】,【软件测试技术干货】,【面试求职技巧】... 51与你共同学习,一起成长!期待你的加入: QQ 群: 755431660