一.功能测试
1、关注页面申请。对于每个页面,要查看发送的申请是否正确,申请的接口是否有反复,接口申请是否正确返回等。可通过chrome中自带的开发工具查看网络申请。
关注是否有冗余接口申请,是否有不必要的反复接口刷新申请。 冗余和反复的接口申请会导致流量节约和响应速度变慢。
2、关注application cache
(http://www.html5rocks.com/zh/...), local storage(http://www.html5china.com/HTM...), cookie中值是否正确,页面是否有应用application cache, local storage存放数据。革除这些数据后性能是否正确,获取数据失败后是否有重试机制。(能够用下图Chrome开发工具,进行查看和革除,也可用postman,soupUi等)。 留神:老版chrome开发者模式下在resource下查看cache,新版chrome在application下查看。
3、session生效机制。对于要登录的,须要用到session的中央,要留神模仿session生效时,性能业务逻辑是否失常。
4、返回逻辑:对于页面中的返回,以及浏览器自带的返回的测试。 页面中的返回要思考业务逻辑,敌对返回到相应档次,须要从用户角度思考返回的转跳逻辑,不能呈现死循环。并要留神返回后是否须要刷新页面申请,比方领取完后返回订单列表,最好刷新
展现上一步购买的订单。
5、页面刷新,刷新时的申请链接是否正确。
(1)下拉刷新是否依然处于以后页面
(2)用户被动点击刷新按钮是否依然处于以后页面
(3)刷新页面或者加载新内容时页面是否有抖动。
6、图片适配,是否依据不同屏幕和分辨率做适配,高端机取双倍尺寸的图;是否对于2G网络,或低端机独自解决,不取高清图或缩小一些特效动画成果;最好加上webp图片的反对,可缩小流量;在中低端机上思考是否须要让前端独自解决,去掉简单解决。并
对中低端机只取原图,不取高清图。留神:webp格局只对android无效,放在IOS上反而会起副作用。
7、是否要减少转场动画,loading动画,点击动画等。以晋升体验。须要在动画成果和卡顿上掂量。
8、对于隐衷模式,不存cookie,不开javascript执行等,测试是否性能失常,或给出提醒。
9、接口降级,接口异样时如何解决,前端要给出敌对提醒。
10、对于申请比较慢时,要有loading图案,图案在数据进去后要隐没,且不能与转场动画等其它有抵触。
11、输入框的校验:特殊字符显示,过滤黑词,js是否会执行,一连串长字母是否会换行等。 比方只输出空字符的解决。
12、弱网络降级:处于2G/3G网络省流量模式的一些非凡解决,比方2G网络下测试,图片多时是否要懒加载等。网络情况差的场景,可提醒文案,但不能闪退。
13、网络切换:从wifi切换到2G/3G网络、从2G/3G网络切换到wifi等
14、H5与Native切换:切换时登录信息是否记录、流程是否顺畅、是否呈现中断闪退等问题。 留神验证 登录信息是否能互通。 不能呈现native曾经登录,进入h5后持续让登录,切实技术实现不了的可toast提醒用户持续登录。
(1)若客户端已登录,那么进入H5后依然是登录状态。
(2)若客户端未登录,进入H5,点击对应按钮OR链接,如果须要登录,须拉起native登录。若勾销登录,是否可再次拉起登录,或者停留在的页面是否有对应的登录提醒。 (注:本次测试过程中就发现,第一次点击链接,能够拉起登录,第二次却不能)
15、Pad上测试须要留神:横屏和竖屏下的显示成果可能不同,还有横屏换成竖屏、竖屏换成横屏。留神横竖屏切换时输入框的不同。
16.返回性能
通过H5页面(非手机自带返回键)的返回功能键返回,能够返回到正确的页面(上一级/退出h5)
点击返回与back键,回退页面是否是冀望页面
17.屏幕切换
横屏竖屏互相切换,能适应,布局不乱,或页面只反对横或竖屏限度
18.分辨率适配更好
倡议采纳响应式设计(如:offerlist页面大屏显示3行,小屏显示2行)
1)分辨率高(如7201280,重点关注页面背景是否齐全撑开页面,刷新是否有抖动)、分辨率低(如320480,重点关注下弹框款式和文案折行)
2)android4.2版本以上的设施轻易测试一两台即可
3)苹果近几年罕用的零碎版本手机
19.页面关上模式
倡议页面在手机上从list点击进入detail页面,要在原窗口关上,通过页面页头返回按钮返回,不须要通过手机返回键返回,交互体验好
20.页面申请验证
关注页面申请,是否会有多余的申请,或者申请后有多余的数据返回,尽量精简,否则会节约流量。
21.图片适配
图片适配测试,依据不同屏幕和分辨率做适配,以及适配后的清晰度,高端机取双倍尺寸的图
22.用浏览器chrome f12进行测试
H5的页面在PC端也是能拜访的,chrome对H5反对最好,性能的测试能够在PC端chrome下先测试,也能够在手机上间接测试,这个看集体习惯。(ie系列**ie8,及以下都反对的不好,这个能够与PD确认H5页面在这些PC浏览器上不反对)
23、滑动、定位
手指滑动是否晦涩,手指点击时焦点是否定位正确,不同机型会不一样。焦点定位点击是灵活。
24、对于相似公司名称、offer名称长度的问题,在手机上最好能依据屏幕大小自适应而不是截断,因为手机上是不会有tips能够看的。截断导致大屏幕下也只能显示几个字,交互不好
25、手机测试要特地关注交互是否敌对,与PC机的事件模型不一样,可能会导致一些体验的问题,比方:弹出层的点击,是否会穿透,影响到弹出层上面的页面。
26、对于一些浮层做的页面,例如地图、产品分类等浮层,留神拖动后是否能够看到它上面的页面,拖动后边缘是否有留白
27、手机端的浏览器测试的时候也要革除一下缓存,因为图片和文件会被缓存下来,所以首次拜访和二次拜访体验不一样。例如UC浏览器的分明缓存在设置-》零碎设置-》根本设置--》革除记录中。
28.关注页面首屏加载工夫。
29、文件导入导出:
1、模板下载性能:
个别导出导出性能会有一个模板下载性能,此性能须要查看模板是否能够失常下载,失常关上,查看Excel模板文件和网站中的数据字段是否统一即可。
2、文件导入性能
1) 谬误提醒,
如果导入的excel表格中中某一行或者某一字段格局不对或者数据为空,是否能够失常导入正确局部的数据,对谬误的数据进行提醒。
2)导入其余格局的文件
当导入的文件格式不正确时,零碎是否做出正确的判断,并给出对应的谬误提醒。
3)反复导入雷同的文件
反复导入雷同的文件是否能够导入胜利,如果能够导入胜利,数据将如何解决,比方笼罩或者疏忽?
4)不应用下载的模板,本人新建excel导入
本人手动新建excel或者对其余excel进行批改,使excel格局和模板统一,这种状况下数据填写正确的话,应能够正确的导入零碎。
5)表头查看:包含去掉、批改、新增列、列之间切换等
3、文件导出性能
1)导出的excel表格的格局查看,次要查看导出的excel格局是否合乎预期,各字段是否正确。另外导出的excel文件名是否有要求。如果有要求,是否正确。
2)数据查看,导出全副数据性能是否正确,到处局部数据性能是否正确,抉择数据为空时是否能够导出。导出的数据内容是否与网页中的内容统一。
二.适配测试
1)H5机型适配
在我的项目测试计划给出时,确认是否要确定测试机基线,即是否要以几款机型作为最低适配需要。可参考目前利用市场占有散布。
操作系统适配范畴:ios 8-10固件版本的iphone必须笼罩,ios7可选笼罩,android 4.4-6.x必须笼罩,4.0-4.3可选笼罩,4.0以下能够不care。像小米,魅族这种自定义os版本的机子,其实底层也对应着规范的谷os零碎版本。
对于ios, android大版本肯定要笼罩,对于零碎版本,先看大版本占用状况,再抉择大版本中占用率较高的小版本。如4.3, 5.0大版本当选几个占用率较高的小版本测试。罕用的有:ios:8.x.x, 9.3.5;android: 4.3.1, 4.4.2 等。
机型品牌适配范畴:参考团体内后端统计的top机型。对于ios,要笼罩iphone 6/6s/6p, iphone 7,iphone5等。
对于android,如三星、小米、华为,htc, lenovo,中兴,魅族,阿里云等。屌丝机型 华为,中兴,vivo,oppo,魅族占有率很高,所以这几个屌丝机型肯定要笼罩到。三星上的H5问题防不胜防,相当极品。小米近一两年的机型适配问题不想2s那么多了。
三星常见的H5适配问题:css加载不进去,控件操作无响应。小米常见的H5适配问题是UI,比方button会把这个按钮四个角冗余显示,tab切换异样。 实时滚动信息时卡死等。
对于有些手机厂商有自已定制操作系统,要独自适配,如小米,魅族。留神三星的假零碎版本。
在抉择机子时,要兼顾屏幕尺寸和分辨率。笼罩到支流的屏幕尺寸和分辨率,并组合一下,当初支流是1920大屏,但肯定要找几款小屏手机笼罩。留神三星的
适配时不能光选性能好的机子,肯定要适配几款中低端机。华为和中兴的国产机,可抉择适配一下。
2)手机浏览器适配
须要笼罩:自带浏览器(默认的浏览器内核)为主,有足够工夫时再笼罩chrome,UC浏览器(最新版)和QQ浏览器(最新版)。
3)容易呈现适配问题的机型:
三星i9100G,对于按钮款式,输入框的区域要重点关注。
android 5.X 谷原生的nenux系列。
大屏高分辨率手机要适配一款,如三星galaxy note4
对于反对webp的机子要测试。如三星galaxy note2,或三星s3
4)工具
1.市面上各种云测平台,个别都能够独自测试H5适配。
2.可借助浏览器的开发者模式。
三.性能测试
1) 须要关注的性能指标:
页面加载工夫/页面大小/页面申请数/ DomReady工夫/图片等资源文件大小/申请谬误数
2) 各种云测平台
3) 其余性能测试工具:dyna trace,yslow,page speed,firebug等等
2)翻页测试:
当遇到翻页加载的页面,须要留神内容为1页或者多页的状况。
(1)数据分页加载时,留神后续页面申请数据的正确。
注:这个须要留神在疾速操作场景中,申请页数是不是顺次递增,疾速操作(如第一页尚未loading进去的时候依然持续上拉操作)时是否收回去对应的申请了。
四.平安测试
1)明确投放渠道都有哪些 :
如独客、主客、wap,是否对未投放渠道做了限度,间接通过url申请是否拦挡等
2)评估是否须要接入团体平安,如mtee黑白名单等
3)是否须要接入支付宝实名认证:
波及到金钱相干,如天猫积分,红包等,为了防刷,个别都须要判断是否支付宝实名认证
4)是否接入windvane,所有申请通过native收回
1)、从代码层级剖析html5新个性带来的安全漏洞。常见的:
通过formaction属性进行XSS
通过autofocus属性执行自身的focus事件
多个autofocus竞争焦点来触发blur事件
通过的poster属性执行Javascript
通过autofocus触发的onscroll执行Javascript
具体原理和其余破绽可见http://html5sec.org/#html5
2)、从手机用户角度列举手机网页存在的一些平安问题(非测试角度),大抵有以下:
歹意url。包含html链接、短链接、短信中的url、扫二维码产生的url
通过XSS窃取数据库内容。各种XSS可参见http://html5sec.org/#html5
自BeEF的打(BeEF有点相似fiddler,具体可见
https://github.com/beefprojec...)。包含cookie窃取、披露设施地理位置、打骚扰电话、不须要的下载
拜访不平安的web服务。
听挪动网站流量。
五. H5上线后回归
H5波及到的各种资源文件,在测试环境(包含预发环境),个别都是内域,正式上线,RD童鞋有把资源文件(或者说url中的链接忘了批改)漏发的危险,所以上线后肯定要用外网环境再疾速回归下。最简略的就是用本人的4G网络回归跟踪线上。
六.H5测试与PC端测试不同的点
1、通过H5网页(非手机的返回性能)的返回性能能够返回,不会呈现无奈返回的状况。
2、横屏竖屏互相切换,能自适应,并且布局不会乱掉;
3、为能在不同分辨率的手机上能更好的展现,倡议采纳响应式设计(如:offerlist页面在大屏时显示3行,小屏时显示2行)
4、在手机上从list点击进入detail页面,要在原窗口关上,这样能够通过页头的返回按钮返回,而不须要通过手机的返回键返回,这样交互上更敌对。
5、关注页面申请,是否会有多余的申请,或者申请后有多余的数据返回,尽量精简,否则会节约流量。
6、图片适配测试,依据不同屏幕和分辨率做适配,以及适配后的清晰度,高端机取双倍尺寸的图
7、H5的页面在PC端也是能拜访的,chrome对H5反对最好,性能的测试能够在PC端chrome下先测试,也能够在手机上间接测试,这个看集体习惯。(ie系列包含ie8,及以下都反对的不好)
8、手指滑动是否晦涩,手指点击时焦点是否定位正确,不同机型会不一样。焦点点击是否灵活。
9、对于相似公司名称、offer名称长度的问题,在手机上最好能依据屏幕大小自适应而不是截断,因为手机上是不会有tips能够看的。截断导致大屏幕下也只能显示几个字,交互不好
10、手机测试要特地关注交互是否敌对,与PC机的事件模型不一样,可能会导致一些体验的问题,比方:弹出层的点击,是否会穿透,影响到弹出层上面的页面。
11、对于一些浮层做的页面,例如地图、产品分类等浮层,留神拖动后是否能够看到它上面的页面,拖动后边缘是否有留白
12、手机端的浏览器测试的时候也要革除一下缓存,因为图片和文件会被缓存下来,所以首次拜访和二次拜访体验不一样。例如UC浏览器的分明缓存在设置-》零碎设置-》根本设置–》革除记录中。
七、H5各种测试总结:
(1)需要设计测试:
尽早的理解需要相熟需要、参加需要评审与设计,通过原型图以及实在用户体验和用户习惯来查看需要的合理性以及是否有更好地实现办法等。
这样能把问题发现在源头,缩小前期因需要变更引起开发和测试的迭代老本。
在需要阶段即染指测试性能点的编写和记录,也合乎尽早染指测试的准则。
(2)接口测试
依据开发同学提供的接口文档,能够通过Jmeter 等工具进行测试。
次要关注点为:
接口返回的数据冀望的是否统一;
接口入参的边界值校验 ;
查看接口的容错性 比方对于传输数据类型谬误是否解决等,整型的输出小数、中英文等;
接口的性能状况,调用接口数据返回的工夫,接口反馈慢必定影响用户体验。
接口的安全性:接口局部敏感信息是否加密传输等
mtop接口返回解决:
发现这个呈现问题的中央有很多,然而只有无意识的去解决,就很容易防止,次要是有以下几种状况:
(1)申请胜利,且返回有数据,测试mtop接口返回数据的各种场景。
(2)申请胜利,但data内容为空。
(3)申请接口异样,呈现ERR_SID_INVALID::SESSION过期,拉起登录。
(4)申请接口产生除C中提到的异样之外的异样,通常可归结为一类进行解决。
(3)功能测试
测试重点,依据业务逻辑和性能进行测试,次要是可用性。
(4)用户界面测试
依据测试和评审批改过的UED(用户体验设计),测试开发递交的测试包。
格调、款式、色彩是否协调,不仅包含HTML5自身,因为HTML5会嵌入App外面,所以要思考 H5 的格调、款式、色彩是否与app自身协同,不至于心心相印,包含用户习惯等也最好保持一致或相近,最好在设计初期就有色彩、按钮、图片、背景、边框等具体布局和对立。
然而正是因为H5的可移植性,同一服务会嵌入到N家客户的产品中,难以与各家都齐全对立,所以在设计中就应该思考这些问题。
(5) 兼容性测试
手机HTML5次要利用是嵌入在app或者微信公众号外面,所以兼容性次要是iOS、Android 2个零碎各种支流机型的适配。
A、手机屏幕大小
B、支流手机机型
C、手机操作系统,iOS和Android各版本
D、浏览器:零碎自带浏览器和支流浏览器
(6)网络测试
因为H5零碎很多是云服务,所有响应速度广泛较慢。咱们测试的时候个别会用Wifi,速度会绝对可观点。
咱们应该察看在4G、3G、甚至2G的网下,弱网测试,看响应工夫是否在忍耐范畴内页游。
工夫过长的话,须要提醒优化代码做改善。
(7) 平安测试
因为咱们对应的产品部利用HTML5把一些通用性能做成了云服务,能够嵌入多家客户的App,依据渠道划分,所以安全性显得尤为重要。
(8) 性能测试
随着对接客户的减少,对服务的性能方面的要求也会减少。对于云服务的模块须要做性能测试。