Web测试必备技能——F12定位bug属于前端还是后台

chrom浏览器为例

(1)打开开发者工具,在浏览器菜单栏选择工具-开发者工具,快捷键是F12

(2)打开之后切换到Network页签,操作就可以看到请求响应

(3)再选择响应的链接,切换到Preview页签,可以看到响应的结果数据;切换到Headers页签可以看到请求的地址,请求的方式,结果等信息

(4)Response结果中可以看到返回的数据字段、值

如图,此时页面出现报错

点击该条报错信息

可以根据响应的值判断一些bug所在

  (1)响应中没有数据,则是后端数据没有返回,前端展示为空,则为后端问题。例如:列表中新增一个数据,没有显示,通过请求中可以看到数据total为0,则是后端数据没有返回。

  (2)响应中有数据,但是前端显示错误了,可以根据字段值判断是否前端显示中取错了字段显示,可以判断是前端问题。例如:前端显示内容错误了,把登录用户名显示了登录帐号,则可以在响应中看数据是否返回正确,返回正确而显示错误,则有可能是前端绑定字段错误。

(3)响应中有数据,但是跟自己操作的结果不一致,可以根据数据库查询,如果数据库中也没有记录,可能是代码有问题,没有记录你的操作。例如:注册了一个帐号,但是登录时提示帐号或密码错误,这就可以在数据库表中查看是否有注册的数据。

定位后提交问题

1. 前台的bug通常是功能、界面和兼容性等有关。后台的bug与性能和安全性有关。前台bug定位:按F12在console中查看报错信息,对于出错的js可以在Sources下查看对应报错的资源文件,写入禅道提交给开发即可

2.后台查看日志一台服务器可以部署多个应用,

cd usr/local/测试服务器名称/logs  //查看先进入到服务器的logs目录下(跟据实际日志位置调整)

tail -f catalina.out        //监视catalina.out 文件的尾部内容(默认10行)

转载请附上
原文出处:https://mp.weixin.qq.com/s/U18oC7QHqxcwbjCrtF6IEQ
作者公众号:软件测试er

原文地址:https://www.cnblogs.com/lrence/p/11636808.html

时间: 2024-08-28 18:19:35

Web测试必备技能——F12定位bug属于前端还是后台的相关文章

测试必备技能系列6:软件安装部署是最基本的能力!

今天,老徐再来聊聊测试必备技能 必备技能系列6 软件安装部署,你必须会! 老徐简单陈述观点: 1. 对于刚入门的测试同学 或者还未入门的测试同学 刚开始工作,都是从功能测试开始 那工作之余呢? 当然是学点东西 2. 学习过程中,肯定有很多软件.工具需要自己部署安装摸索 否则,门都入不了,咋学? 3. 入门级,常见有哪些需要安装的? 1)虚拟机 2)linux服务器 3)基本环境部署:mysql jdk apache 等 4)数据库客户端工具 5)bug管理工具:jira等 6)其他,看具体想学的

测试必备技能系列1 :通过mysql命令进行脚本数据导入

老徐,分享测试项目中实际能解决问题的干货! 今日分享: 如何通过mysql命令行,导入mysql脚本文件数据? ----- 解决实际的问题: 工作过程中,经常需要导入mysql脚本文件 很多同学可能会说,直接通过mysql客户端导入,轻松搞定: 但是,很多服务器,为了安全考虑,并不会开放第三方客户端登录权限(当然有很多其他方式处理,今天不探讨): 这个时候,怎么导入脚本? ----- 前提: 你已经会操作mysql 知道mysql是啥 会基本的mysql命令 知道 mysql -u root -

ios测试必备技能, Instruments - Allocation测试内存

 个人觉得, 对于专项的测试, 万变不离其宗的是策略,或者说是方案的设计.  对于执行步骤-预期结果等等这都是设计的过程中最为重要的, Apple为Ios的开发者提供了Instrument这个强大的工具箱,然而工具的使用不能说是自己已经学会了专项的技术, 策略永远是重点. 测试开始: 1 下面执行测试的是我自己写的一款APP,不如所料的是存在问题的(笔者开始学OC不久,而且之前都是脚本语言较多,对于移动端的测试略少,所以才开始学习OC),我们将使用Allocation进行内存测试 2 了解需求,

每个Web开发者必备的9个软技能

每个Web开发者必备的9个软技能.对于一份工作,你可能专注于修炼自己的内功,会在不自觉中忽视软技能.硬技能决定你是否能得到工作,而软技能能够表明你是否适合这份工作和适应工作环境等.所有的公司都有属于自己的文化,并努力将这些文化传承下去,所以他们必须确保每一位新员工能够适应这个环境. 许多硬技能很容易获得并可很快的提高,而软技能由于和你性格等联系紧密,可想要改变他们是一件很困难和缓慢的事情.这里有七个核心的软技能,适用于大多数的企业,它们不分行业,但作为Web开发者不应该忽视其中的任何一个.但是,

JavaScript是WEB前端开发的必备技能

在过去,JavaScript只是被用来做一些简单的网页效果,比如表单验证.浮动广告等,所以那时候JavaScript并没有受到重视.自从AJAX开始流行后,人们发现利用JavaScript可以给用户带来更好的体验,甚至利用这一优点开发了大型网页游戏,于是这门小语言被重视了起来. 现在,很多公司会招专门的JavaScript工程师,通常JavaScript是WEB前端开发的必备技能.简单介绍了JavaScriptr的好处,并不代表大家就会去学习甚至把它学好,兴趣是很关键的,我认为兴趣是最好的老师,

web前端开发工程师必备技能

看到这个标题的大都是前端开发边缘的同学,有多少能直言不讳的说自己是前端工程师呢?不是打击谁谁谁,而是我们需要反思一个问题:什么才是真正意义上的前端开发呢? 前端开发这个职业始于几年前,至今已发展的初步成熟了.如果你打算进入这个行业,你要做好的准备,因为要学的要懂得的实在不少:如果你已经在这个行 业一两年了,也请你不要放弃对前端开发的继续追寻和研究:更老一点的,也就不能说什么了,是你们让更好的前端发展至今,在此抱以感激! 上述一段,也就是把前端的开发者总概了一下,下面我们来看看前端需要什么技能?

【转载】运维职业向!我是怎么入得运维行业?运维工程师入门必备技能以及打怪升级篇

前言:转载 陈浩一个从事安全运维向的前辈文章.写的很好.人非常nice,遇到了问题,qq上很快就回复了我. 大道三千 入门最难,凡事入了行,也就什么都好说了,好的自然不断努力奋斗修行,不好的自然很快就被淘汰.恭谨勤勉,时不我待~ ---------------------------------------------------------------------------------------------------------------------------------------

接口测试:如何定位BUG的产生原因

转自公众号<QA之道> 我们从在日常功能测试过程中对UI的每一次操作说白了就是对一个或者多个接口的一次调用,接口的返回的内容(移动端一般为json)经过前端代码的处理最终展示在页面上.http接口是离我们最近的一层接口,web端和移动端所展示的数据就来自于这层,那么我们如何知道在测试过成功UI上的每一次点击都触发调用了那些接口呢?请在下面的场景中找答案. 如下场景: 你负责测试某一个电商网站一个用户的订单列表功能,测试过程中你发现页面上展示的订单数量与实际数据库里的数量不一致,请大家结合自己平

web测试笔记

工具总结: 网站兼容性测试工具:multibrowser Cookie工具:iecookiesview 超链接工具:xneu,http link validor http协议的请求相应抓包工具:httpdebugger pro 服务器:tomcat 安全测试工具:nmap(主机端口服务os等嗅探),scrawlr(sql注入工具) 性能测试工具:ab,jmeter,lr,qtp,百度统计和排名www.alexa.cn网站 Web:通过浏览器访问服务器, B/S 架构 Web技术学校网站:www.