Web端常见Bug解析

Web 端常见 Bug 解析

Web 端测试中发现的 Bug 会有各种类型。

常见的 Bug 包含页面布局方面、页面元素方面、功能方面等等。

这种情况，一般是需要自己造数据进行验证的。

前面学习用例设计的时候就说过，页面展示的时候，需要根据长度的边界值去设计用例进行验证。一般来说都会有超长内容的验证。看看文字超长之后，页面展示会不会出现问题。

如果出现问题的话，可能就类似于这样，出现了滚动条，内容被遮盖了一部分。这是不想看到的场景。是需要进行修改的。比如可以折行展示，或者超出部分...，这些解决方案都是可以接受的。

这一类问题一般会出现在兼容测试中。Web 产品需要在各种系统的各种版本的不同浏览器上运行。

PC 端，手机端，win、mac、linux、android、iOS，这些设备上的各种版本的浏览器。这些浏览器的内核和特性会有区别，就会导致在不同浏览器上页面的展示可能会有错乱的问题。

比如图里问题，页面最右侧就没有显示全。

这是属于界面方面的问题，图里是一个注册的界面，但是注册密码的要求没有明确的进行说明，可能用户所有的都输入完成了之后，点击注册，才能得到我们密码不符合要求的提示，这样的用户体验会很差。

所以一般来说，输入框是需要对要输入内容的规则先说明清楚。

这种是对于输入框进行测试的时候，可能会出现的问题。因为 Web 页面本身就是 html 写的，所以在输入框中输入 html 语言片段的话，如果没有进行处理，页面可能会有报错信息。就像图中展示的这样。

功能方面 Bug 是平常工作中最常见的。核心就是功能没有符合需求当中的要求。

比如图里是百度，输入所有关键词后，没有搜索到对应的内容，这就是没有实现我们的需求。

还有一些比较常见的 Bug 是提示信息中带了一些错误码之类的内容，这些内容是不应该暴露给用户的。给用户的应该就是明确的中文提示。

还有一种比较常见的情况，就是 js 脚本会报错。

如果遇到这种情况的时候，得先区分一下造成的原因是什么。

这种情况就涉及到网络请求了，可以到开发者工具的 Network 面板中查看请求发送的状态。通过响应状态码可以简单定位是前端还是服务端出了问题。

这种情况需要排查是否是网络的问题，还是网页性能的问题。如果是性能问题的话，就需要进行针对性的优化了。