web端页面详细测试点（一）

根据日常工作总结，将涉及到的一些web端页面相关的测试点罗列整理出来。

一、导航测试

导航一般位于页面顶部或者侧边区域，在一个项目中，它主要起着链接站点或者连接软件内的各个页面的作用。常用测试检查点如下：

  1. 导航是否直观，能否直接反应系统的主要功能。

  2. 页面结构、导航与菜单等展示风格是否一致。

  3. 导航的链接跳转是否正确，如：不同的导航跳到同个页面，或不同的导航跳到不同的页面

  4. 导航条tab键来回跳转切换，能否正确显示。

  5. 链接如果带参数，跳转到不同页面，传递的参数是否正确。

  6. 导航条各级之间有上下级关系时，进入下级页面，再返回，是否能正常返回上级页面。

以上为导航条基本功能的检测点，除此外，还需要检查：

  1. 各个导航之间的相互影响，如：两个导航使用的js模块不一，涉及到页面加载，页面展示等的检查。

  2. 导航条与其他控件组合在一起时，在不同的页面上，看到的导航条是否一致等检查。

 

二、输入框测试

输入框一般分为文本输入与数字输入。在一个项目中，输入框一般在新建和编辑页面中出现。常用测试检查点如下：

2.1 文本输入框（字符型输入）：

  1. 长度检查：最小长度、最大长度、最小长度-1、最大长度+1、超长字符

  2. 边界值检查：最大边界值、最大边界值+1、最小边界、最小边界值-1

  3. 空格检查：仅空格、字符前有空格、字符后有空格、字符前后有空格。

  4. 字符串检查：如输入注入的字符串，是否能正常保存。

    a 输入特殊字符串：null、NULL、<HTML>、<JavaScript>

    b 输入脚本代码：如document.write(‘xxx’)

  5. 多行文本框输入：tab键、enter键

    a 允许回车换行、保存后再显示能够保存输入的格式；

    b 仅输入回车换行，检查能否正确保存（若能，检查保存结果，若不能，查看是否有正常提示）

2.2 数字输入框（数值型输入）：

  1. 边界值：最大值、最小值、最大值+1、最小值-1

  2. 位数：最小位数、最大位数、最小位数-1、最大位数+1、输入超长值、输入整数

  3. 异常值、特殊字符：输入空白（NULL）、空格或"~!@#$%^&*()_+{}|[]\:"<>?;',./?;:'-=等可能导致系统错误的字符、禁止直接输入特殊字符时，尝试使用粘贴拷贝查看是否能正常提交、word中的特殊功能，通过剪贴板拷贝到输入框，分页符，分节符类似公式的上下标等、数值的特殊符号如∑，㏒，㏑，∏，+，-等、不能直接输入，就copy，是否数据检验出错；

  4. 输入负整数、负小数、分数、输入字母或汉字、小数（小数前0点舍去的情况，多个小数点的情况）、首位为0的数字如01、02、科学计数法是否支持1.0E2、全角数字与半角数字、数字与字母混合、16进制，8进制数值、货币型输入（允许小数点后面几位）

  5. 输入正数、负数、0、0.0、+0.0、-0.0、指数、对数、分数、整数、小数、复数、科学计数法的测试，全角的数字、超大整数，超大的小数，超小的小数

2.3 输入框其他逻辑：

  1. 输入框内容为必填或选填，必填时是否增加判定，并在不符合预期时进行校验提醒。

  2. 唯一性，有些名称检查唯一。如：输入的项目名称不可以重复

  3. 输入框可以自动带出值时，需检查带出的值的正确性

  4. 输入带有空格时，是否自动过滤处理

  5. 编辑类的输入框，当鼠标移除输入框，检查是否从输入框移除焦点

  6. 输入框的UI设计是否符合规范

 

三、按钮测试

按钮：在常用系统中，按钮一般用于确认提交等操作，测试检查点如下：

  1. 按钮是否可用：如启用、禁用状态是否符合逾期

  2. 按钮是否可点，有弹出框的弹出框是否符合预期。

  3. 自然状态、鼠标悬浮和按钮按下的状态下，按钮的状态

  4. 按钮的功能实现是否正常（存储db，与其他模块交互等是否正常）

  5. 按enter键，能否正常操作按钮实现功能。

  6. 按tab键，能否在不同的按钮或其他控件间切换。

  7. 按钮在鼠标悬浮、选中、点击、等操作下的状态是否符合预期

  8. 错误信息提醒是在前端js判断，还是后台判断？点击按钮后，提示话术显示是否正确。

  9. 对于危险操作，是否有进行预警提示。如删除后不可恢复的数据，是否有进行提醒。

 

四、单选框

单选框：一般用于实现多个中选择一个的功能，常见测试点如下：

  1. 默认是否有选中

  2. 是否只能选中一个

  3. 选中后的功能是否正确。

  4. 与接口交互传递的值正确性检查

 

五、复选框

复选框：一般用于实现多选功能，常见测试点如下：

  1. 多个复选框一个都不选

  2. 多个复选框全部选中

  3. 多个复选框部分被选中

  4. 当复选框太多时，是否提供全选和全不选的功能

  5. 复选框与其他组合时，比如选中某个复选框，就出现某种效果，检查不同组合时的展示情况。

  6. 与接口交互传递的值正确性检查

 

六、左右选择框

左右选择框：一般用于选择数据。左侧是待选择数据，右侧是已经选择的数据，右侧可删除。常见测试点如下：

  1. 左侧数据展示区数据是否符合预期
  2.  左侧数据为空时是否展示正确
  3. 左侧数据过多时是否有滚动条。
  4. 左侧能否展开，展开后显示数据是否正确。首次进入是否展开。
  5. 添加左侧数据到右侧后，右侧数据是否默认展开。
  6. 添加一条左侧数据到右侧，左侧数据置灰检查，右侧数据正确性检查
  7. 添加全部数据到右侧，左侧数据置灰检查，正确性检查。
  8. 右侧删除一条数据，左侧对应数据不再置灰，数据正确性检查
  9. 右侧删除全部，左侧数据不再置灰，正确性检查
  10. 两侧数据是否有个数提示，有的话，添加和删除后，个数提示是否正确。
  11. 添加大量数据，确认后，检查处理的速度。

 

七、日期/时间测试

在系统中，日期与时间一般由输入与选择两种方式结合。下面分别从输入与选择两方面进行介绍，常用测试检查点如下：

7.1日期/时间输入测试

  1. 合法性检查：

    年输入：超过4位；年的格式范围不在1900-3000之间；

    月输入：[0、1、12、13]

    日输入：0日、1日、32日

    组合1：月输入[1、3、5、7、8、10、12] ——日输入[31]

    组合2：月输入[4、6、9、11]——日输入[30] [31]

    组合3：输入非闰年——月输入[2] 日期输入[28、29]

    组合4：输入闰年——月输入[2] 日期输入[29、30]

    时分秒规则：00：00：00 - 23：59：59

    时输入：[0、1、12、13]

    分输入：[0、1、59、60]

    秒输入：[0、1、59、60]

  2. 异常值、特殊字符：输入非数字、负数、空白或NULL、输入~！@#￥%……&*（）{}[]等可能导致系统错误的字符

7.2日期/时间选择测试

  1. 是否有初始日期/时间。如：默认显示当前日期/时间

  2. 日期格式是否正确，年月日是否限制。（格式如：yyyy-mm-dd、yyyy.mm.dd、yyyy 、yyyymm、yyyymmdd）

  3. 时间格式是否正确，时分秒是否限制。（格式如：hh:mm:ss；hhmmss；hh:mm; ）

  4. 切换年月日，当天关联的数据是否正确。如：查看下2010年的考勤，带出来的数据是否正确

  5. 检查测试场景：开始日期 < 截止日期,开始日期 > 截止日期,开始日期 = 截止日期

  6. 用up-down按钮、下拉框切换时分秒是否正确

  7. up-down按钮调整分和秒自增或自减时是否自动进位或退位（如满60秒分加1）

  8. 系统涉及的时间是否取值为服务器的时间

 

八、下拉框测试

下拉框，在系统中一般用于实现筛选功能。常见测试检查点如下：

  1. 初始默认值是否显示正确，如：有的显示全部，有的默认选中某一项，有的显示“请选择”

  2. 下拉选项是否可以为空，是否可以编辑。

  3. 拉选项的内容是否正确显示、对齐方式及选项排列顺序是否符合预期。

  4. 下拉框的长度或高度超出设定时，是否有滚动条，上下滚动，左右滚动亦或者鼠标悬浮提示。

  5. 当下拉框选项很多时，检查是否有被底层覆盖亦或者选项重复的情况。

  6. 当下拉框弹出时，当选择一个选项后，下拉框是否自动收回。

  7. 当下拉框弹出时，鼠标点击控件外区域/选项/下拉框，下拉框能否收回。

  8. 当光标定位到下拉选项时，是否支持键盘快捷操作，如↑,↓,Home ,End ,PageUP ,PageDown等。

  9. 当有预览效果的下拉框时，光标悬浮于选项时，应检查显示的预览效果是否正确。

  10. 下拉选项内容是否可变，当可变时应验证其正确性。

  11. 可编辑下拉列表框新增或删除选项值后，选项是否正确显示。

  12. 可编辑下拉列表框是否可以插入新选项值，插入值的有效/无效等价类验证（包括空格、全半角字符、特殊字符等情况）、长度验证以及重复性验证。

  13. 下拉框数据被存储后，在其他地方显示时，需对传递的数据正确性进行检查。比如下拉框选项按数字传递，而其他页面显示时应该显示对应的文字。

  14. 组合筛选的情况，有级联操作的，只有选择了前一个数据后，才能进行下一个的选择。比如省市之间，只有选择了省份，才能继续选择市，否则市不可选。

  15. 当用于实现组合筛选功能时，选择不同的选项，列表中展示筛选的结果，内容，默认排序等检查。

  16. 切换选项，检查不同浏览器，下拉框显示是否出现变形

 

九、列表测试

列表，在系统中一般常用于同类型数据的展示、配合单条或多条数据被选中后执行的一些功能操作。常见测试检查点如下：

  1. 列表的列名字段与对应的内容取值的正确性。非必要的列是否是否不显示

  2. 选择列表选项后，执行操作是否成功。

  3. 列表列宽是否合理，超过列表显示区域时是否及时出现滚动条（包括垂直和水平方向）

  4. 列表数据为空时，显示是否正确。

  5. 列表翻页功能是否正确。

  6. 列表和翻页，筛选的组合检查，翻页后，再做筛选，是否会自动跳到第一页。

  7. 列表与标签切换，筛选的组合检查，在同一区域，标签不同显示出来的列表数据不同。

  8. 默认的列表排序功能是否合预期。如：按日期正序排序。

  9. 列表排序可变时，点击进行排序，每一页的排序是否能正确排序

  10. 列表是否有全选功能，全选功能检查。

  11. 列表其他附加功能（比如：新增、编辑、删除、导出等）是否正常

  12. 能否用键盘快捷键选择选项（上下键、Enter、Space等）

  13. 能否用Shift键+点击连续多选、用Ctrl键+点击选择性多选、Ctrl+All键全选、直接用鼠标点击多选选项。

  14. 单击或双击列表信息，是否会报错

十、图表测试

在常用系统中，关于图表类的实现一般用echart控件来实现。在echart中，含有很多可视化图表，以下为几个常用的图标，测试检查点如下：

10.1柱状图

  1. 数据为空时的显示

  2. 多个柱状差异比较大时的显示，比如一个数据是1000，一个时1，检查页面显示情况。

  3. 柱状图的范围区分是否符合预期

  4. 鼠标悬浮时，浮层的显示内容检查。

  5. 选择不同的时间框，图形内容是否随时间变化，变化值是否正确。

10.2曲线图

  1. 图表的维度符合预期。

  2. 图表有时间轴的，检查时间轴的间隔是否符合预期。

  3. 某一天无数据，其他天有数据时，图表展示是否正常。

  4. 对比曲线图时，一般通过颜色区分不同曲线的意义。

  5. 鼠标悬浮到曲线上，能展示当前点的数据。

  6. 和时间框组合，选择不同的时间，折线图的数据是否自动变化，且显示正确。

  7. 实时折线图，检查实时的数据是否正常展示。

10.3圆环图：

  1. 环形图一般显示为百分占比，测试点如下：

  2. 图的百分比值是否显示正常

  3. 图中心显示的数字长度检查，过长是不是能正常显示

  4. 非0的百分比，环形占比是否符合预期

  5. 显示多个项的百分比时，各项的颜色是否与提示一致。

  6. 100%占比和0%占比时的显示情况检查。

  7. 鼠标浮动到对应项上，是否有浮层提示对应的值，同时检查值是否显示正确。

  8. 选择不同的时间框，图形内容是否随时间变化，变化值是否正确。

4、树形图
  1. 树形图展开和关闭是否正常。
  2. 树形图展开多层，一屏放不下时，是否有滚动条。
  3. 树形图展开多层，是否能全部展开，上下是否显示正常。
  4. 树形图无数据时显示情况
  5. 只有单层时和多层时的显示情况。
  6. 选择不同的时间框，图形内容是否随时间变化，变化值是否正确。
5、地图
  1. 地图中的数据块的数据是否和存储的一致。
  2. 鼠标移动到某一块，悬浮层内容显示检查。
  3. 选择不同的时间框，图形内容是否随时间变化，变化值是否正确。
  4. 地图一般和其他的表格数据配合使用，检查各区域的数据是否和图表中数据一致。
  5. 没数据的情况，地域的颜色显示。

 

参考文章：

【web常见控件介绍】https://blog.csdn.net/Songruibb/article/details/80359210

 【web测试策略】https://www.cnblogs.com/8080zl/p/11120807.html#c1

【web页面测试总结】https://blog.csdn.net/mig_davidli/article/details/52213047

 

 

 

posted @ 2020-09-23 18:19  未知姐姐  阅读(1496)  评论(0)    收藏  举报