DevTools features that I used in my daily work

Mobile

• Device simulators
• Remote debug Android devices

DOM elements

• Editing HTML using the inspector tool:

  

• Editing CSS from the “Elements” Tab:

  

• Gettin element's xpath

• Reorder elements in DOM

• Inspect elements states

  

• Catch DOM Break-Points

  

Console

• Inspecting Console tab to catch errors
• Manipulate with DOM via JS in Console tab

Sources

• Inspect server files

  

• Make the DOM changes made locally persistent

  

Network

• Log network activity

• Simulate a slower network connection

  

• Capture screenshots

  

• Inspect a resource's details

  

  Headers

  - Getting HTTP headers
  - Getting Status code
  - Getting Request Method
  - Getting POST data
  

  Preview

  - Getting rendered HTML or images
  

• Filter resources

  • Filter by resource type1

• Block requests

• Change User-Agent

  

Application

• View, edit, and delete cookies

  

• View and edit local storage

  

• View Cache data

  

Other

• Override geolocation