前端常见功能测试用例
说起测试和开发之间的关系，有时能和平相处，更多是矛盾重重。究其根本，矛盾都来源于bug，也终止于bug。有些可能是心理上的矛盾，有些就直接导致了面红耳赤的争执。
因此，每个开发都应该懂一些测试， 在日常的工作中多站在对方的角度思考问题，多体谅对方，将自己能力范围内的工作做好，问题解决好，为对方营造一个舒适的解决问题的环境，对方自然将你的好看在眼里，记在心里。
【1】搜索或查询
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 单独遍历各查询条件，测试按各查询条件是否都能够查询出相应的值. | 查询出符合条件的记录 | ||
| 设置界面上所有查询条件进行查询,单击查询按钮后，测试执行查询操作后,查询条件是否能保留 | 能够执行查询,且已输入/选择的查询条件能够保留 | ||
| 随机对各查询条件进行组合查询，测试是否能够实现组合查询 | 各查询条件下存在相应的值 | 能够执行查询 | |
| 在各字符串类型字段中输入非精确值进行查询，测试是否能够实现糊模查询 | 各查询条件下存在相应的值 | 能够执行查询 | |
| 测试是否控制了各种非法字符的查询 | 输入@#$%^&*() ~'"%-like=?等符号 |
查询不到任何记录 | |
| 设置条件查询出记录后，翻到最后一页，再更改查询条件，测试各查询条件查询出记录后再切换条件查询是否正确。 | 第一个查询条件查询出来的记录页数必须多于第二个查询条件查询出来的记录页数 | 查询出相应的记录 | 第一次查询条件范围比第二次大，不一定说要存在分页 |
| 设置查询条件，点击查询按钮，测试未查询到任何记录时，是否会给予相应的提示 | 该查询条件下无任何记录 | 提示‘未查到任何记录，请放大查询条件试试！’ | |
| 设置查询条件，按回车键，测试是否支持回车查询 | 执行查询条件 | 可针对特定的场景不一定要实现 | |
| 对于英文字母是否区分大小写 | 不区分，通过大写字母Admin可以搜索到admin | ||
| 输入各查询条件，前中后包含空格 | 前后包含空格去掉空格查询，中间包含空格查不出记录 | ||
| 进行组合查询条件后，测试是否能够清空某一个查询条件 | 能够清空，每一个查询框都配有清空按钮 | ||
| 不输入或输入空格查询 | 提示请输入关键字查询 或 默认查询出所有记录 | ||
| 输入查询值，测试存在日期型查询字段时,查询是否正确 | 存在输入范围内的记录. | 能够执行查询 | |
| 输入查询值，测试当存在开始日期及结束日期进行查询 | 1、开始日期大于结束日期 | 1、给予提示信息。 | |
| 2、开始日期等于结束日期 | 2、能够正常查询。 | ||
| 3、开始日期小于结束日期，但两者格式不一 | 3、进行格式化后能够正常查询 | ||
| 超日期范围的查询 | 输入1890-01-01或2999-01-01进行查询 | 查询不到任何记录 | |
| 输入非完整的日期或其它数据，测试对日期型字段查询时,是否对非法数据进行了控制 | 如：2015-08~2015-09-30、205-02-02、2015-7-7、2015-07-或其他数据汉字、字母、特殊字符或随便输入数字 | 进行了格式化输入或给予明确提示 | |
| 输入不存在的日期进行查询 | 2015-02-30、2015-13-01、2015-07-32 | 给予提示信息 | |
| 输入不符合项目设定的日期类型，是否会做格式转换 | 如要求格式是2015-07-20，输入的是2015/07/20、2015.07.20等 | 自动转换或者不符合格式要求 | |
| 输入查询条件后，点重置 | 重置后,已输入或已选择的值都恢复为默认值 | ||
| 不输入或输入空格搜索 | 提示请输入关键字 |
【2】日期格式
| 测试步骤 | 测试数据 | 预期结果 |
| 输入正确的日期 | 如：2011-5-11 | 验证通过，输入正确 |
| 测试对日期数据的溢出是否进行了控制？ | 1、输入符合要求的年月，输入32日，如1989-11-32 2、输入符合要求的年日，输入13月，如1989-13-12 3、输入符合要求的年，月输入4、6、9、11月，日输入31日 4、输入符合要求的非闰年，月输入2，日输入29，如2009-2-29 5、输入符合要求的闰年，月输入2，日输入30，如2008-2-30 |
给予提示信息，不允许提交 |
| 测试是否对日期型数据进行了格式化输入？ | 1、输入不合法的日期，如2009-09、2009-09- 、200-2-2等 2、输入不符合该项目的日期格式，（如项目日期格式为2009-10-10，而输入的是2009/10/10、2009.10.10等） 3、随便输入数字，如1、22、456等 |
给出错误提示 |
| 测试是否对时间型数据是否进行了格式化输入？ | 1、输入空白 2、输入汉字或字母 3、输入特殊字符串NULL、null、 空格的转义字符； | |
| ；< /tr>等 | 进行了格式化输入，不可以输入非时间之外的数据 |
【3】输入框
| 测试步骤 | 测试数据 | 预期结果 |
| 输入中英文空格 | 如果必填的话：提示不能为空； | |
| 不输入任何字符或者输入空格 | 提示不能为空 | |
| 输入超长字符，超过边界值的，看页面显示 （不符合长度要求） | 大于或小于制定长度 | 给予提示信息 |
| 在各输入框中输入相应的值，测试输入框对空格的处理机制(空格) | 1、前面存在空格 2、后面存在空格 3、前/后都存在空格 4、中间存在空格 |
1、2、3能够正常去掉空格保存； 4 连同空格一起进行保存 |
【4】数字输入框
| 测试步骤 | 测试数据 | 预期结果 |
| 尝试输入字母，中文，标点或其他符号 | 提示输入字符不符合要求 | |
| 测试对输入框输入空格+数字 | 1、前面存在空格 2、后面存在空格 3、前/后都存在空格 4、中间存在空格 |
1、2、3能够正常去掉空格保存； 4 连同空格一起进行保存 |
| 按tab、空格键，测试输入框对快捷键的使用 | 光标能在输入框中来回切换 | |
| 测试0或非整数类型是否支持，是否符合业务逻辑 | 给与提示信息 |
【5】密码输入框
| 测试步骤 | 测试数据 | 预期结果 |
| 输入数字，测试密码是否转换成星号或其它符号 | 能将密码转换成星号或其他字符 | |
| 按tab键，测试输入框对快捷键的使用 | 光标能在输入框中来回切换 | |
| 若只允许输入字母，尝试输入数字；反之；尝试输入字母 | 提示输入字符不符合要求 | |
| 利用复制，粘贴等操作强制输入程序不允许的输入数据 | 给予提示信息 |
【6】上传图片（上传文件）浏览/选择按钮
| 测试步骤 | 测试数据 | 预期结果 |
| 文件类型正确，文件大小合适 | jpg或gif的格式图片，文件大小为4.9M | 上传成功 |
| 文件类型正确，文件大小不合适 | jpg或gif的格式图片，文件大小为5.1M | 上传的附件中大小不能超过5M |
| 文件类型正确，文件大小合适(临界值) | jpg或gif的格式图片，文件大小为5M | 上传成功 |
| 文件类型错误，文件大小合适的校验 | doc；.xls；ppt；bmp；jpeg；psd；tiff；tga；png；swf；svg；pcx；dxf；wmf；emf；lic；eps；.txt等格式文件，文件大小合适 | 提示“只能上传jpg或gif格式图片 |
| 文件类型和文件大小合法 | 上传一个0kb的图片 | 提示信息：“请重新上传文件，或者是不能上传0kb的图 |
| 文件类型和文件大小合法 | 上传一个正在使用中的图片（即打开该图片，在上传该图片） | 上传成功 |
| 文件类型和文件大小合法 | 手动输入一个存在的图片地址 | 上传成功 |
| 文件类型和文件大小合法 | 手动输入一个不存在的图片地址 | 提示：“请正确选择要上传的文件 |
| 文件类型和大小都合法 | 手动输入一个存在的图片名称 | 提示：“请正确选择要上传的文件的路径” |
| 连续多次选择不同的图片，查看是否上传最后一次选择的图片 | 多次选择图片，再点击“上传按钮” | 上传的是最后一次选择的图片 |
| 上一次上传失败后，再进行上传操作，测试上传失败后，是否还能继续上传 | 能够正常进行上传 |
【7】数据导入
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 选择一个文件，点击上传按钮，测试是否能够完成数据导入功能？ | 文件内的数据都符合格式 | 正常完成导入，导入成功后，给予明确的提示信息 | 对数据文件的导入，如果是Excel文件，存在多个sheet，是否可以导入 |
| 选择一个文件，点击上传按钮，测试导入文件中的数据异常，导入是否能正确判断？ | 文件内的数据部分符合要求，部分不符合要求 | 检查完后，能够给予有多少不符合条件的记录提示，且可以点击链接查看具体不符合条件的记录；提供继续/终止两种选择；继续则忽略不符合条件记录继续导入；终止则停止本次导入，退出本次导入 | a、两个sheet内容一致； |
| 选择一个文件，点击上传按钮，测试导入文件中的数据异常，导入是否能正确判断？ | 文件内的数据全部不符合要求 | 同上 | b、一个sheet内容符合要求，一个为空白； |
| 选择一个文件，点击上传按钮，测试导入文件中的数据异常，导入是否能正确判断？ | 文件内的数据关键字段值在数据库中不存在 | 同上 | c、两个sheet内容不一致，个字段数据都是真实存在的； |
| 选择一个文件，点击上传按钮，测试导入文件中的数据异常，导入是否能正确判断？ | 文件内的数据格式不符（如匹配字段名、表名等不同） | 同上 | 比如要求输入名字和手机号，文件内确是名字和身份证 |
【8】文件的导出或下载（考虑文件名内容是否有乱码）
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 导出文件是否为空 | 看实际情况，若原本就没数据，导出可以为空，但是必须带各个字段名，数据可为空 | ||
| 导出文件名为特殊字符的情况 | 不该存在特殊字符 | 导出要采用多个浏览器检测，之前碰到在火狐浏览器正常，却在其他浏览器显示乱码 | |
| 导出全部资料的情况，导出的信息是否正确 | 信息要正确 | ||
| 导出部分资料的情况，导出的信息是否正确 | 信息要正确 | ||
| 导出大量数据时的时间是否在合理的时间范围内 | |||
| 导出目的磁盘空间已满的情况下，导出是否有友好的处理方式 | 可以给予友好的提示，存储空间不足等 | ||
| 导出目的的文件夹为只读的情况下，导出时是否有友好的的提示信息 | 先将目标文件夹状态改成只读形式 | 要提示 |
【9】分页
| 测试步骤 | 测试数据 | 预期结果 |
| 输入页数，点击go按钮，测试是否能执行翻页操作 | 正常转向所输入的页面，且当前页数及当前页的数据显示正确 | |
| 检测翻页功能栏的记录总条数统计是否正确 | 记录总条数统计正确 | |
| 点击首页、上一页、下一页、未页，测试各页面转换是否正常 | 正常进行转向，且当前页数及当前页数据显示正确 | |
| 测试在各边界面值再进行翻页是否正确 | 1、已在首页，点击首页或上一页； | 能够正常提示或不会报错，当前页数及当前页的数据显示正确 |
| 2、已在未页，点击未页或下一页； | ||
| 输入页数，点击go按钮，测试是否对所输入的页数进行了判断 | 1、输入非正整数 | 1、4、5限制不允许输入； |
| 2、输入超出的页数 | 2、3自动转到未页或给予提示 | |
| 3、输入超大的数值 | ||
| 4、输入字符、中文 | ||
| 5、输入特殊字符 | ||
| 对数据操作（增删）后是否正确显示数据 | 对分页列表中存在删除操作时，删除几条记录，页数是否更新 | 页数更新，信息正确显示 |
| 搜索后执行翻页，是否正确 | 正常 |
【10】全选
| 测试步骤 | 测试数据 | 预期结果 |
| 点击全选按钮，测试是否实现了全选当前页的功能 | 1、部分记录已被选中 2、全选前没有被选中的记录 | 当前页的全部记录被选中 |
| 点击全选按钮后，再点击全选按钮，测试全选按钮勾选状态变更是否正确 | 当前页的全部记录被取消选中 | |
| 点击全选按钮后，再去掉某些记录的勾选，测试全选按钮勾选状态变更是否正确 | 当前页的全选按钮取消选中 | |
| 将当前页的所有记录单个单个全部勾选，测试全选按钮勾选状态变更是否正确 | 当前页的全选按钮被选中 |
【11】删除
| 测试步骤 | 测试数据 | 预期结果 |
| 选择一条记录，执行删除操作，测试是否能正常进行删除操作 | 能够正常完成删除操作 | |
| 不选择任何记录，直接点击删除按钮，测试是否对无选择记录进行删除做了控制 | 提示‘请选择一条记录！’或删除按钮呈灰色显示或默认选择一条记录 | |
| 选择一条记录，点击删除按钮，测试删除时是否会给予相应的提示，并按所选项执行 | 提示‘您是否真的要删除所选中的记录？’，点击取消，不进行任何操作，回到原界面，点击确定删除，界面刷新不显示此条记录，停留在所删除记录所在页，总记录数-1 | |
| 设置条件查询出记录后翻页，选一条记录，点击【删除】并确定删除，测试删除边界值是否正常 | 翻页后，只存在一条记录 | 界面正常刷新至上一页，页数等于原页数-1。 |
| 勾选多条记录，点击删除按钮，在弹出的提示框中，点击确定，测试是否可以进行批量删除多条数据 | 能够正常批量删除多条数据 | |
| 选择记录进行删除，测试当删除相关连的信息时，是否给予明确的提示信息 | 1、所删除记录被其它引用，不允许被删除。 | 1、给予明确提示信息，不允许被删除（不给予确认删除的提示信息） |
| 2、所删除记录被其它引用，允许被删除。 | 2、给予明确提示信息，让用户确认是否删除，可选择是否继续，且被引用的信息也跟着删除掉了 |
【12】保存
| 测试步骤 | 测试数据 | 预期结果 |
| 进行新增或修改操作，输入相关内容后，多次提交保存，测试是否限制了重复保存 | 重复点击保存或 快速点击 | 在提交反馈之前，按钮呈灰色显示不允许点击 |
| 进行保存操作，测试当保存操作所费时间较长时，是否能提供进度条 | 当反馈时间达到12S以上时。 | 给予‘正在处理中’的进度条提示 |
【13】修改
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 勾选一条记录，进行修改保存，测试是否能正常进行修改操作 | 能够正常进行修改保存，更新数据库中相应的值 | ||
| 未选择记录，点击修改按钮，测试是否对无选择记录进行修改做了控制 | 提示‘请选择一条记录！’或修改按钮呈灰色显示或默认选中第一条记录 | ||
| 选择一条记录，点击修改按钮，进行修改，点击确定按钮，测试是否对重复的记录进行了控制 | 将关键字段修改成一个已存在的值 | 提示‘该XX已存在，请重新输入 ！’，光标停在XX输入框处 | |
| 选择一条记录，点击修改按钮，再点击返回按钮，测试取消修改时是否会给予提示 | 不修改任何内容 | 直接返回原记录所在页 | |
| 勾选多条记录，点击修改按钮，测试是否对勾选多个记录进行修改进行了控制。 | 提示‘您选择了多条记录，系统将修改第一条记录，且弹出第一条记录进行修改 | ||
| 修改引用的信息 | 引用的信息 | 提示不能修改，页面没有保存按钮 | |
| 选择一条记录进行修改保存，测试信息修改是否正常 | 该信息被其他模块引用 | 能够正常进行修改保存，且被引用的信息也跟着修改 | 例如员工信息里的公司名称，那么在公司信息里这个名称做了修改，员工信息里面包含公司名称的也全部做了修改，相反员工信息里面针对公司名称照道理不允许修改 |
【14】添加
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 执行新增操作，测试是否能正常进行新增 | 输入必填字段 | 能正常完成新增操作 | |
| 只填写界面上标识的必填字段（即标识*号）号的字段，测试界面上必填字段控制与数据库必填控制是否一致 | 能够正常进行保存 | ||
| 输入相关数据后，进行保存，测试当因任何原因无法提交时，原输入的内容是否保存 | 制造提交失败的数据，比如某个字段输入不符合要求 | 提交失败后，界面的数据仍保留，不会清空 | |
| 执行新增操作，测试新增记录是否排在首行 | 对排序没有特殊要求的界面 | 满足新增记录排在首行的规则 | 不一定在首行，有些可能是按编号排序 |
| 执行新增操作，关键字段与数据库中已存在的值重复，测试是否对重复值进行了判断 | 重复提交以增加过的记录 | 提示该信息已经存在，请重新输入的提示信息 | |
| 执行新增操作，测试是否对各字段的长度进行了限制 | 各输入的值都大于表中定义的长度 | 在各输入框中，输入的内容达到所定义的长度时，则限制无法输入了。（如果输入的为中文字符，则控制到一半的长时就够了） | |
| 操作新增操作，测试是否对各输入框的非法字符进行了控制 | 在各输入框中，输入@#$%^&*() ~%[]-/’等。 |
1、不允许输入或提示‘你输入的 **中存在非法字符，请重新输入 2、允许输入保存后，能够正常回显 |
|
| 在各输入框中输入相应的值进行新增保存，测试对各输入框中，输入内容前中后包含空格 | 1、前面存在空格 2、后面存在空格 3、前/后都存在空格 4、中间存在空格 |
1、2、3能够正常去掉空格保存； 4 连同空格一起进行保存
|
|
| 在多行文本框中输入文字及回车进行保存，测试在多行文本框中，是否允许存在回车符 | 存在一个或多个回车键 | 能够正常进行保存及显示 | |
| 测试针对特殊字段限制是否正常 | 1、主页地址 2、电话号码 3、E-mail地址 |
1、主页地址中可输入\ 2、电话号码中可输入\- 3、E-mail地址中输入@ |
具体查看各个输入框对应校验，如电话号码 |
| 测试是否对必填字段进行了检查 | 关键字段不输入或输入空格 | 提示‘请输入XX，光标停留在第一个需输入的输入框处 | 光标离开输入框时便提示不符合标准 |
| 点击‘新增’按钮，在弹出的页面中，输入及选择相应信息，点击取消（返回）按钮，测试点击取消（返回）时是否会给予相应的提示 | 给予‘是否需要保存’的提示 | 需要这个提示比较好 | |
| 输入非负整型数据，测试是否对数值型数据进行了格式化输入 | 1、输入正常的正整数 2、输入0、负数、小数 3、输入超大值（超出该字段定义范围） 4、输入非数值（如数值+字符；字符+数值； |
进行了格式化输入控制； 1、能够正常输入 2、不允许输入 3、给予提示信息 4、不允许输入或提交时给予提示信息。 |
|
| 输入整型数据，测试是否对数值型数据进行了格式化输入 | 1、输入正整数、0、负整数 2、输入小数 3、输入超大值（超出该字段定义范围） 4、输入非数值（如数值+字符；字符+数值；纯字符）
|
进行了格式化输入控制： 1、能够正常输入 2、不允许输入 3、给予提示信息 4、不允许输入或提交给予提示信息。 |
|
| 输入浮点型数据，测试是否对数值型数据进行了格式化输入 | 1、输入正数、0、负数 2、输入超大值（超出该字段定义范围） 3、输入超出精度范围值（超出该字段定义精度） 4、输入非数值（如数值+字符；字符+数值；纯字符） |
进行了格式化输入控制： 4、不允许输入或提交给予提示信息。 |
|
| 对于有图片上传功能的编辑框，若不上传图片，查看编辑页面时是否显示有默认的图片 | 最好设置一直默认的图片，当用户没有上传图片时，使用默认图片显示 | ||
| 提交数据时，连续多次点击，查看系统会不会连续增加几条相同的数据或报错。 | 避免用户多次点击情况 | ||
| 点击新增按钮，输入信息后，点重置 | 能够清空已输入的数据，但不清空新增时默认生成的数据 |
【15】邮箱格式
| 测试步骤 | 测试数据 | 预期结果 |
| 为必填项时，不输入任何字符或输入空格 | 不输入任何信息 | 校验不通过，给予提示信息 |
| 输入中文空格 | ||
| 输入英文空格 | ||
| 输入中文或英文 | ||
| 字符串中没有@和点 | ceshi163com 全部转成大写测试一遍 | |
| 字符串中有@和没有点 | ceshi@163com | |
| 字符串中没有@和有点 | ceshi163.com | |
| 字符串中有特殊字符 | [email protected] | |
| 第一个字符串为@ 或点 | .test或@test | |
| 字符串的最后一位是@或点 | test@163. | |
| @和点之间没有字符串 | [email protected] | |
| 字符串中多于两个@符号 | ||
| 字符串长度小于6，大于30个字符 | werw, [email protected] | |
| 字符串中有汉字 | 邮箱格式@qq.com | |
| 输入@前面有分隔符的情况 | [email protected]校验可通过 |
|
| 输入@后面有多个分隔符（小数点） | [email protected]校验可通过 |
【16】身份证号码
| 测试步骤 | 测试数据 | 预期结果 | |||||||||||||
| 测试对身份证号码的溢出是否进行了控制 | 1、输入少于15位的身份证号码：如：36031219880708 2、输入大于15位的身份证号码：如：3603121988101058 3、输入少于18位的身份证号码：如：36031219897521456 4、输入大于18位的身份证号码：如：3603121987052874123
|
给予提示信息，不允许提交 | |||||||||||||
| 测试是否对数字型数据是否进行了格式化输入 | 1、输入特殊字符串NULL、null、 空格的转义字符； 3、输入字母 1、不输入任何信息 2、输入中文空格 3、输入英文空格 |
【17】电话号码
| 测试步骤 | 测试数据 | 预期结果 | 备注 |
| 测试是否对数字型数据是否进行了格式化输入 | 1、输入汉字或字母 2、输入特殊字符串NULL、null、 空格的转义字符； |