– Aug 2018 (they will keep changing)

enter image description here

Elements

Show the source code so you can see if it is what you expect and to see what elements you can use in , what id’s are being used, etc.

enter image description here

Console

Show a command prompt in the browser so you can try out javascript command, page element selectors, jquery locators, etc. against the current DOM

Sources

So you know where the browser is getting (or trying to get) content from. So you can verify calls are coming from correct locations, e.g. prod pages are using prod calls and not staging environment calls by mistake.
enter image description here

Network

So you can see the http get, post, etc. calls and how long they took. You visit this tab and then reload the page and then you can see what’s taking the most time. Allows you to see any sites that are particularly slow including resources such as media and content servers.

enter image description here

Performance

Note Folks often actually want the network for ‘performance’ information.
The performance tab is for examining the performance of the browser itself. You start a profiling tool, perform browser actions, stop the profiling tool and then examine the results. They can show any issues with the rendering of pages

enter image description here

Memory

Browser memory usage, helps to show if inefficient or resource intensive code is being run.

Application

Manifest, service workers

Security

Shows any security issues, e.g. unauthorized

Audits

New tools to diagnose performance, best practices, accessibilty and SEO



Source link https://sqa.stackexchange.com/questions/33139/how-to--chrome-dev-tools-for--or-automation

LEAVE A REPLY

Please enter your comment!
Please enter your name here