前端测试checklist

本文提供了一份详尽的UI测试检查清单,涵盖了从页面元素到功能逻辑的各个方面,并针对不同的浏览器和分辨率进行了兼容性验证。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

序号检查项检查点
1页面检查1、控件大小统一、控件齐全、顺序正确(如:单选按钮、复选框、日期控件、输入框、下拉框等、按钮)
2、字体大小统一(字体、字号、颜色、样式、字间距)
3、文本左对齐,数值右对齐
4、图片显示样式、大小、尺寸显示正确
5、页面显示无乱码
6、页面显示无重叠
7、颜色风格统一
8、页面无js错误
9、需要必填的控件,有必填提醒,如 *
10、页面无错别字
11、出错时给出的提醒无歧义,表述清晰
12、页面上提醒用户的文案正确且齐全,包括tips的提示文案
13、合理添加左右滚动条和上下滚动条
14、控件摆放的位置合适(如确认按钮在左、取消按钮在右)
15、适时禁用功能按钮(如权限控制时无权限操作时按钮灰掉或不显示;无法输入的输入框disable掉)
16、用词统一(描述同一个意思的词语被不同地方用到时要统一)
17、title显示正确
18、合理添加返回链接,比如detail页面可以返回到list页面
19、导航位置正确
20、需要添加链接的地方是否都已添加链接并且正确(如:点击公司名称,新窗口打开旺铺)
2功能逻辑检查1、字段输入内容的校验(输入框输入空、小于最小长度、超长时给出合理的提醒;日期控件需要检查非日期格式的情况),注意,不仅需要对各个文本框单独进行校验及文案提醒,还需要考虑全面组合之后的校验及提醒
2、字段为空时的显示校验(字段内容为空时,整个字段不显示还是内容显示为空)
3、字段为极限值的显示校验(超长截取显示,还是完整显示,还是换行显示),当页面各项取值均为极限值时,页面样式显示正常
4、小数的位数显示多少位,是否以四舍五入的方式显示(如:输入1.245,小数位最多两位时,四舍五入为1.25)
5、数字为12位(千亿)时,不以科学计算法显示、不会溢出显示为负数
6、注意小数的点浮点显示的问题(如:输入8.1,不能显示为8.100000000000001)
7、html标识符,对js和html代码作转义处理
8、字母大小写转化(如:memerid都是小写)
9、冷僻字的显示正确,不会显示乱码
10、新增页面默认值的检查(如:单选按钮默认选择“全部”,复选框默认选择“未审核”等,下拉默认选中“请选择”等),修改页面默认显示已有内容。
11.文本框默认提示文案,是否为灰色,鼠标点击之后,文案是否消失
12、删除后是否刷新,页面立即不显示被删除的内容
13、重复提交问题,无法重复提交(刷新重复提交;后退后继续单击提交进行重复提交)
14、异常分支的出错提示(如选择已被删除的记录,单击删除如何提醒;选择已被删除的记录修改如何提醒,a用户删除b用户的记录如何提醒)
15、在新窗口还是原窗口打开(如:list页面中打开detail页面一般都是新窗口打开;成功页面在原窗口打开)
16、弹出窗口被ie拦截的问题
17、检查标签的切换正常
18、要注意与开发的联调,如:注意接口的参数命名是否一致
19、要考虑自动过滤空格的情况(如:输入登录id的输入框需要自动过滤空格,输入金额的输入框需要自动过滤空格)
20、表单提交失败停留在当前页面,已输入的内容不会被清空,或重新选择
21、回车键的功能是否有效(如:输入查询内容单击回车显示查询结果;输入表单内容单击回车,提交表单)
22、文案提醒若有icon,需要检查图案是否合理
23、若有多个radiobutton,需要点击切换,查看是否出现样式异常
3业务相关逻辑测试1、订单提交后不允许修改,那么就不显示修改链接
2、提示文案的逻辑(如:字段名为“电话号码”,则出错显示为“电话号码不能为空”)
3、诚信通logo(个人普及、个人限量、企业普及、企业限量)
4、相同记录是否会报错
5、有时间段的查询时,开始时间不能大于结束时间
6、点击贸易通logo可以弹出对话框
7、需要做违禁词控制的地方是否都做了控制
8、检查单位对不对(比如:金额、重量、体积等)
 
……
4浏览器检查一般情况下检查IE6.0 、IE7.0、firefox(不同浏览器里,CSS/JavaScript存在兼容性问题)
5分辨率检查不同分辨率页面布局显示是否合理,整齐,分辨率一般为1024*768 > 1280*1024 >800*600
6环境问题1、调试代码不要提交到测试环境
2、测试的style环境,不要随意更新,需要规范style的环境更新
3、提测的style分支需要跟主干合并(merge的过程与线上保持一致,也需要进行js文件的压缩),合并的时间点大致如下:提测进行冒烟测试时需要合并、功能测试完成后进入回归测试时需要合并、回归测试阶段如果有重大项目发布也需要合并主干、上预发布之前需要再合并一次主干。
 
   
   
   
   
   
   
   
1. 易用性 : 按钮名称应该易懂,用词准确,屏弃没楞两可的字眼,要与同一界面上的其它按钮易于区分,能望文知意最好。理想的情况是用户不用查阅帮助就能知道该界面的功能并进行相关的正确操作。 易用性细则: 1) 完成相同或相近功能的按钮用Frame框起来,常用按钮要支持快捷方式。 2) 完成同一功能或任务的元素放在集中位置,减少鼠标移动的距离。 3) 按功能将界面划分区域块,用Frame框括起来,并要有功能说明或标题。 4) 界面要支持键盘自动浏览按钮功能,即按Tab键、回车键的自动切换功能。 5) 界面上首先要输入的和重要信息的控件在Tab顺序中应当靠前,位置也应放在窗口上较醒目的位置。 6) 同一界面上的控件数最好不要超过10个,多于10个时可以考虑使用分页界面显示。 7) 分页界面要支持在页面间的快捷切换,常用组合快捷键Ctrl+Tab 8) 默认按钮要支持Enter及选操作,即按Enter后自动执行默认按钮对应操作。 9) 可写控件检测到非法输入后应给出说明并能自动获得焦点。 10) Tab键的顺序与控件排列顺序要一致,目前流行总体从上到下,同时行间从左到右的方式。 11) 复选框和选项框按选择几率的高底而先后排列。 12) 复选框和选项框要有默认选项,并支持Tab选择。 13) 选项数相同时多用选项框而不用下拉列表框//两个的 14) 界面空间较小时使用下拉框而不用选项框。 15) 选项数较少时使用选项框,相反使用下拉列表框。 16) 专业性强的软件要使用相关的专业术语,通用性界面则提倡使用通用性词语。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值