• 13
  • 14
分享
  • H5页面识别及测试点——软件测试圈
  • TIMI 2021-12-02 11:37:46 字数 2315 阅读 1434 收藏 14

我们平时说的H5测试就是HTML5,其实就是:移动端WEB页面。

  • 我们以往的APP是使用原生系统内核的,相当于直接在系统上操作,是我们传统意义上的软件,更加稳定;

  • H5的APP先得调用系统的浏览器内核,相当于是在网页中进行操作,较原生APP稳定性稍差,似乎还没有百万级用户量的H5APP;

  • H5最大的优点是可以跨平台,开发容易,APP的话需要用ANDROID的语言和IOS的语言各自写,H5只要开发一套;

  • 简单的说:H5是基于web,native基于客户端。

一、如何判断一个APP页面是否是H5页面

1、无网络

断开网络,显示404或则错误页面的是H5‘

1.png

2、页面布局

  1. 在手机设置、开发者选项中开启显示布局边界功能;

  2. 进入应用查看布局边界;

  3. 原生应用可以看到各个控件的布局边界,H5只有整个页面的一个边界。

(注:开发者工具是进入<关于手机>,找到<版本号>,有的手机这个版本号是在更多信息里,连续双击<版本号>,会提示开启开发者模式,再返回通用菜单,开启开发者选项)

原生:                                              H5:

2.png3.png

3、长按页面

长按页面,出现特殊标记、放大镜,复制,粘贴等等,甚至手机震动(Android),则表示是H5

4.png

4、加载的方式

打开新页面导航栏下面有一条加载的线的话,这个页面就是H5页面

微信里面打开我们的H5页面常见的有个绿色的加载线条。

5.png

5、导航栏是否会有关闭的操作

APP顶部导航栏当中出现了关闭按钮或者有关闭的图标,那么当前是H5页面

6.png

6、网页提供方

下拉页面的时候显示网址提供方的是H5页面

7.png

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

1、业务逻辑相关

除基本的功能测试之外,H5页面的测试,需要关注以下几点:

1.1登陆

目前H5与native各个客户端都做了互通,所以大家在测试的时候要注意两点:

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

B、若客户端未登录,进入H5,点击对应按钮OR链接。

如果需要登录,须拉起native登录;

若取消登录,是否可再次拉起登录,或者停留在的页面是否有对应的登录提示。

1.2翻页

遇到翻页加载的页面,需要注意内容为1页或者多页的情况。

A、数据分页加载时,注意后续页面请求数据的正确。

ps:这个需要注意在快速操作场景中,请求页数是不是依次递增,快速操作

(如第一页尚未loading出来的时候仍然继续上拉操作)时是否发出去对应的请求了。

1.3刷新与返回

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

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

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

1.4数据的请求与返回:

A:提交了数据,数据是否正确的整理到后台管理系统:结婚请帖来参加婚礼的用户,信息和号码以及参与人数,是否正确的提交后台。

B:发送了请求,是否正确返回你要求的数据:比如我们常见的结婚请帖,是否有收到回执?

2、H5适配相关

H5的适配其实比客户端的相对来说,要少一些,手机品牌之间的差异不大,所以不用太多关注,最容易出现问题的是android2.3系统,这个要特别关注下:

A、大屏(如720*1280,重点关注页面背景是否完全撑开页面,刷新是否有抖动)、小屏手机(如320*480,重点关注下弹框样式和文案折行)

B、android2.3、android4.X随机找一个即可

C、ios5、ios6、ios7

D、浏览器上也要能够进行完美展示

3、安全相关

3.1明确投放渠道都有哪些?

如独客、主客、wap,是否对未投放渠道做了限制,直接通过url请求是否拦截等

3.2是否需要接入支付宝实名认证涉及到金钱相关。

如天猫积分,红包等,为了防刷,一般都需要判断是否支付宝实名认证。

以前我在的公司,有一次为了做推广~发起了一个数钱的活动,每次都是一毛一毛的数,时间是15秒,出现如下bug:

  • 利用脚本数钱,15秒数出了100多~~-?最后出于推广成本的考虑,就把时间限制为5秒;

  • 转发一次就可以奖励多一次机会数钱,结果没有做好限制,朋友的朋友推广,还是可以奖励次数。

4、体验相关

4.1资源相关

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

B、资源是否压缩、是否通过CDN加载。---CDN是什么?---就近地区访问,服务速度会更快。

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

D、对于类似公司名称、offer名称长度的问题,在手机上最好能根据屏幕大小自适应而不是截断,因为手机上是不会有tips可以看的。

截断导致大屏幕下也只能显示几个字,交互不好

4.2流量

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

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

4.3页面展现时间

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

4.4页面提示

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

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

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

4.5手机操作相关

A、锁屏之后展示页面。

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

C、手指滑动是否流畅,手指点击时焦点是否定位正确,不同机型会不一样。焦点地位后点击是否灵敏。

4.6弱网络体验

5、埋点数据检查

与前端一起确认埋点情况。什么是埋点?

接下来你可能要问,H5测试的工具是什么?很简单。

1:你手上的手机→直接扫描二维码打开链接,进行测试

2:谷歌浏览器→调试成手机模式来进行测试

下载谷歌浏览器,点击浏览器右上角“三”图标,在下拉选项中选择→“更多工具”→“开发者工具”,或者直接按F2;


作者:飞翔的猪~

原文链接:https://www.cnblogs.com/zdx20/p/12445062.html

  • 【留下美好印记】
    赞赏支持
登录 后发表评论
+ 关注

热门文章

    最新讲堂

      • 推荐阅读
      • 换一换
          •   Jmeter与loadrunner是现时下比较火的两个软件,很多的测试人员在面临loadrunner与Jmeter的时候不知道该如何选择,其实当了解这两款软件之后就不会发生这种选择困难症了。下面通过一些异同点来了解一下。  Jmeter与Loadrunner的相同点  1、原理都是通过中间代理,监控与收集并发客户端发现的指令,将他们生成脚本,并发送到应用服务器,再监控服务器反馈结果的一个过程。  2、分布式中间代理,可以设置代理在多台不同的PC中,通过远程控制使多台机器来分担自身的压力,借此达到能给获取更大的并发用户数。  3、录制功能,jmeter与loadrunner都具备的有录制脚本...
            0 0 808
            分享
          • 当一个软件测试工程师刚刚进入行业一到三年的时间,他们通常需要掌握一些基本技能和知识,并且需要学习一些新的技术和工具,以便更好地完成自己的测试工作。以下是一些建议,帮助测试工程师在这个阶段提升自己的技能。掌握基本的测试技能在软件测试领域,有一些基本的技能和知识是必须掌握的。这些技能包括如何编写测试用例、如何执行测试用例、如何记录测试结果等等。测试工程师需要在这些基本技能上建立起扎实的基础,以便更好地完成自己的测试工作。掌握软件测试基本技能需要系统地学习和实践,以下是一些具体的建议:首先,要了解软件测试的基本概念和流程,包括测试的类型、测试的方法、缺陷管理等等。可以通过阅读相关书籍、参加培训课程等...
            0 1 1127
            分享
          •  一、前言工欲善其事,必先利其器最近对 API 接口协作的软件研究了好久,市面上的软件都下载用了一轮,下面给大家介绍其中的最强「神器」 Apifox。Apifox 官网:apifox.cn 在介绍它之前,先说几个场景。如果你是后端、前端或测试,那一定遇到过这些场景。1.1. 场景一、后端视角:我是个 后端 ,遇到过的问题:接口定好,团队里的前端、测试小伙伴找我 要文档 。代码注释好给个 Swagger 还容易被吐槽界面丑、功能弱,不能做到 开发阶段即可并行联调 ,一开始是对接不了、调试不起来的,甚至有时候还会出现前端开发完界面,只能等后端联调。接口联调对接过程中,总会有些接口没预料...
            11 10 1889
            分享
          •   2022软件测试行业前景如何?结果你来预测。链接:http://vote.51testing.com/  (笔给你,你来填~)  我们在使用网站过程中,经常会遇到慢的问题,为了找到原因,一般需要借助工具进行检测,通过工具,可以检测出前端站点加载资源的相关详细情况。  今天,就给大家介绍几款前端性能测试分析工具,结合性能测试工具,实现通过量化的方式测试网站中诸如首字节加载时间(time to first byte)或者渲染时间等表现。其中有些工具还会检查资源是否被缓存,多个 CSS 或 JS 文件是否值得合并,最后自动给出前端性能优化改进建议报告,如果对你有用的话,欢迎收藏转发。 ...
            0 0 9168
            分享
          • 1、什么是 FastHttpUser在介绍FastHttpUser之前,我们先看一下,Locust默认客户端使用的是啥?Locust 默认客户端使用的是python-requests。>> 如果不了解 python-requests,可以看一下小鱼的这篇:《requests库常用到的7个主要方法及控制访问参数》或者官方文档,如果有足够耐心的话:《Requests》我们接着说,使用requests是Pyhton维护非常方便的包,并且在python应用中非常广泛,栗如:爬虫,接口等。所以,官网是非常推荐我们使用HttpUser。但是,如果我们的测试规模非常大,数据量非常大,那么这个时候...
            1 1 24672
            分享
      • 51testing软件测试圈微信