H5测试

H5是什么？

H5的全称是HTML5，其实就是：移动端WEB页面。

 

H5与原生 APP的区别：

• APP是使用原生系统内核的，相当于直接在系统上操作，是我们传统意义上的软件，更加稳定。
• H5的APP先得调用系统的浏览器内容，相当于在网页中进行操作，较原生APP稳定性，顺畅性稍差，似乎还没有百万级用户量的H5 APP。
• H5最大的优点是可以跨平台，开发容易。原生APP则需要在android和ios上各开发一套。

简单的说：H5是基于web，native APP基于系统。

 

H5测试应该从哪些方面考虑？

除基本的功能测试之外，H5页面的测试，需要关注一下几点：

1、业务逻辑相关

1.1 登录

　　A、若客户端已登录，那么进入H5后仍然是登录状态。

　　B、若客户端未登录，进入H5，点击对应按钮或链接，如果需要登录，须拉起native登录。若取消登录，是否可再次拉起登录，或者停留在的页面是否有对应的登录提示。

 

1.2 翻页

　　A、数据分页加载时，注意后续页面请求数据的正确。（这个需要注意在快速操作场景中，请求页数是不是依次递增，快速操作）

 

1.3 刷新与返回

　　A、下拉刷新是否依然处于当前页面。

　　B、用户主动点击刷新按钮是否仍然处于当前页面。

　　C、点击返回与back键，回退页面是否是期望页面。

 

1.4 数据的请求与返回

　　A、提交了数据，数据是否正确提交到后台。

　　B、发送了请求，是否正确返回要求的数据。

 

2.H5适配相关

　　A、大屏（如720*1280，重点关注页面背景是否完全撑开页面，刷新是否有抖动）、小屏（320*480，重点关注下拉框，弹窗和文案折行）

　　B、android 2.3，android4.x 随机找一个即可。

　　C、ios5，ios6，ios7

　　D、自带浏览器，微信浏览器

 

3.安全相关

　　3.1 明确投放渠道都有哪些

　　3.2 是否涉及到金钱相关，实名，防刷等

 

4.体验相关

4.1 资源相关

　　A、页面中的图片，本着一个原则，尽量缩小图片。淘宝那边建议图片一般不大于50kb。

　　B、资源是否压缩，是否通过CDN加载。

　　C、如何保证二次发布后有效更新

 

4.2 流量

　　A、对于一些不会变化的图片，如游戏动画效果相关图片，不需要每次都请求的东西，做本地缓存

　　B、数据较多时是否做了分页加载。

 

4.3 页面展现时间

　　A、 关注页面首屏加载时间。

 

4.4 页面提示

　　A、弱网下，数据加载较慢，是否有对应的loading提示。

　　B、接口获取异常时，提示是否友好

　　C、刷新页面或加载新内容时页面是否有抖动

 

4.5 手机操作相关

　　A、锁屏之后展示页面

　　B、回退到后台后，重新呼出在前台展示。

　　C、手指快速滑动是否顺畅，手指点击时焦点是否定位准确。

 

5.埋点数据检查

 

H5测试的工具推荐

• 手机真机
• 谷歌浏览器-手机模式