原文链接:http://www.blogjava.net/qileilove/archive/2014/07/24/416154.html?utm_source=tuicool&utm_medium=referral

1、业务逻辑相关

  除基本的功能测试之外,H5页面的测试,需要关注以下几点:
  1.1 登陆
  目前H5与native各个客户端都做了互通,所以大家在测试的时候要注意两点:
  A、若客户端已登录,那么进入H5后仍然是登录状态。
  B、若客户端未登录,进入H5,点击对应按钮OR链接,如果需要登录,须拉起native登录。若取消登录,是否可再次拉起登录,或者停留在的页面是否有对应的登录提示。
  ps:本次测试过程中就发现,第一次点击链接,可以拉起登录,第二次却不能。
  1.2 翻页
  遇到翻页加载的页面,需要注意内容为1页或者多页的情况。
  A、数据分页加载时,注意后续页面请求数据的正确。
  ps:这个需要注意在快速操作场景中,请求页数是不是依次递增,快速操作(如第一页尚未loading出来的时候仍然继续上拉操作)时是否发出去对应的请求了。
  1.3 刷新与返回
  A、下拉刷新是否仍然处于当前页面。
  B、用户主动点击刷新按钮是否仍然处于当前页面。
  C、点击返回与back键,回退页面是否是期望页面
  ps:本次测试过程中就发现,mtop接口请求成功,但是data内无数据时,返回到的就是个空白页面,无法正常发送请求。
  1.4 mtop接口返回处理
  发现这个出现问题的地方有很多,但是只要有意识的去处理,就很容易避免,主要是以下几种情况:
  A、请求成功,且返回有数据,测试mtop接口返回数据的各种场景。
  B、请求成功,但data内容为空。
  C、请求接口异常,出现ERR_SID_INVALID::SESSION过期,拉起登录。
  D、请求接口发生除C中提到的异常之外的异常,通常可归结为一类进行处理。
  2、H5适配相关
  H5的适配其实比客户端的相对来说,要少一些,手机品牌之间的差异不大,所以不用太多关注,最容易出现问题的是android2.3系统,这个要特别关注下:
  A、大屏(如720*1280,重点关注页面背景是否完全撑开页面,刷新是否有抖动)、小屏手机(如320*480,重点关注下弹框样式和文案折行)
  B、android2.3、android4.X随机找一个即可。
  C、ios5、ios6、ios7。
  3、安全相关
  3.1 明确投放渠道都有哪些
  如独客、主客、wap,是否对未投放渠道做了限制,直接通过url请求是否拦截等
  3.2 评估是否需要接入集团安全,如mtee黑白名单等。
  3.3 是否需要接入支付宝实名认证
  涉及到金钱相关,如天猫积分,红包等,为了防刷,一般都需要判断是否支付宝实名认证。
  3.4 是否接入windvane,所有请求通过native发出。

 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、回退到后台之后,重新呼出在前台展示。
  4.6 弱网络体验
  5、埋点数据检查
  与BI、前端同学一起确认埋点情况。

h5 测试关注点的更多相关文章

  1. APP,H5测试要点

    APP测试重点 一,运行测试 运行过程中,是否有加载提示: 运行速度是否流畅: 各个模块之间的切换是否正常: 二,更新测试:打开旧版app时,是否有更新提示,且在不同的手机版本上都能更新成功:打开新版 ...

  2. H5测试(转载)

    可能有些朋友不明白啥是H5,但其实生活中我们经常会碰到. 比如,你经常收到的朋友虐狗第一式—结婚请贴. 你的朋友圈,可能会经常看到宝妈们虐狗第二式—晒可爱宝宝的相册. 你有可能也收到过这样,非常直观, ...

  3. H5测试

    H5是什么? H5的全称是HTML5,其实就是:移动端WEB页面. H5与原生 APP的区别: APP是使用原生系统内核的,相当于直接在系统上操作,是我们传统意义上的软件,更加稳定. H5的APP先得 ...

  4. 一张图玩转H5测试

    背景 随着各种H5页面的普及和运用,并深深的影响着我们各个业务的发展,前两年也对H5测试的有着不少积累,但都是根据项目的要求,这里测试下,那里测试下,今年上半年专门成立了H5测试研究虚拟小组,专门研究 ...

  5. H5测试区别与PC端测试关注点

    除了基本的业务逻辑功能测试之后,H5页面的测试,需要关注以下几点: 1.  通过H5网页(非手机的返回功能)的返回功能可以返回,不会出现无法返回的情况. 2.  横屏竖屏相互切换,能自适应,并且布局不 ...

  6. H5测试与PC端测试不同的点

    1.通过H5网页(非手机的返回功能)的返回功能可以返回,不会出现无法返回的情况. 2.横屏竖屏相互切换,能自适应,并且布局不会乱掉: 3.为能在不同分辨率的手机上能更好的展示,建议采用响应式设计(如: ...

  7. 微信小程序和微信H5测试中易出Bug的点和注意事项

    一.微信小程序 易出Bug的点: 小程序的分享转发功能 背景:小程序项目开发基本完毕也都已经测过几轮,功能上基本没有什么问题,但是上线后却被客户发现通过分享转发小程序给别人,别人无法正常打开的情况 原 ...

  8. native与H5优缺点及H5测试

    一.native(原生)与H5优缺点介绍 native(原生)优点 1.运行速度快 2.可以应用到底层的API 3.便捷性与易用性 4.打开会比较节省流量 native(原生)缺点 1.不同操作系统需 ...

  9. 移动端H5测试调试利器 chrome://inspect/#devices

    使用 chrome://inspect/#devices,可以使安卓手机里的WebView也能和chrome一样审查元素,调试和测试移动端H5页面. 我使用的是三星S6 (该功能支持安卓系统4.4及以 ...

随机推荐

  1. 【Django】request 处理流程(转)

    Django 和其他 Web 框架的 HTTP 处理的流程大致相同,Django 处理一个 Request 的过程是首先通过中间件,然后再通过默认的 URL 方式进行的.我们可以在 Middlewar ...

  2. JAVA环境变量关于

    1.为什么要设置classPath? 用于通知JVM Java基础类库的位置.classPath告诉类装载器去哪里寻找第三方类库 自JDK1.5之后便不需要再配置这个变量了 2.为什么安装两个JRE( ...

  3. 阿里消息队列中间件 RocketMQ源码解析:Message发送&接收

  4. 53. leetcode557. Reverse Words in a String III

    557. Reverse Words in a String III Given a string, you need to reverse the order of characters in ea ...

  5. 表达式求值(二叉树方法/C++语言描述)(一)

    使用二叉树对算数表达式(以下简称为表达式)进行求值,实质上是将表达式转换为二叉树,对其进行后序遍历,得到后缀表达式的同时可以求得表达式的值.转换和求值的过程也需要借助数据结构栈的帮助. 二叉树数据结构 ...

  6. [转]为什么大型网站前端使用 PHP 后台逻辑用 Java?

    最近纠结了一下,如果开发一个大型的网站,我到底应该使用php还是jsp,后台到底使用php还是用java,我的选择要么是php要么是java,因为我喜欢linux.unix,当然window平台也必须 ...

  7. Open-Falcon第三步安装Agent (小米开源互联网企业级监控系统)

    安装Agent 每台机器上,都需要部署agent,agent会自动采集预先定义的各种采集项,每隔60秒,push到transfer. cd $WORKSPACE/agent/ mv cfg.examp ...

  8. 干货--Excel的表格数据的一般处理和常用python模块。

    写在前面: 本文章的主要目的在于: 介绍了python常用的Excel处理模块:xlwt,xlrd,xllutils,openpyxl,pywin32的使用和应用场景. 本文只针对于Excel表中常用 ...

  9. 360春秋杯CTF比赛WRIteUP

    题目:where is my cat? 地址:http://106.75.34.78 访问网页出现证书错误的问题,查看证书如下: 抓包发现: Accept-Encoding: gzip, deflat ...

  10. webpack2+node+react+babel实现热加载(hmr)

    前端工程化开发的一个重要标志就是热替换技术,它大大的提高开发效率,使我们专注于写代码,webpack2中的热替换相比较1更加简洁. 1. 先看效果 2.目录结构 3.项目目录结构文件描述 bin 执行 ...