Christopher Juckins

SysAdmin Tips, Tricks and other Software Tools

User Tools

Site Tools


google_chrome_devtools_tips

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

google_chrome_devtools_tips [2018/02/05 20:06]
juckins created
google_chrome_devtools_tips [2018/02/05 20:10] (current)
juckins
Line 1: Line 1:
 ==== Google Chrome DevTools Tips ==== ==== Google Chrome DevTools Tips ====
  
 +To monitor network traffic, identify the webpage you want to inspect, including filling out forms, etc.
 +
 +Push F12 to load Chrome'​s DevTools console in a new pane on the right side of the browser.  ​
 +
 +Click Network at the top of the pane if it is not already selected.
 +
 +A small red circle should be illuminated in the pane indicating it is ready to capture data.
 +
 +Now finish loading the webpage you want to inspect. ​ For example, fill out an HTML form and click "​Search"​ or "​Submit"​.  ​
 +
 +As the page loads the Chrome DevTools pane will populate with data similar to Firefox'​s HttpFox add-on.
 +
 +Once the data stops loading, you can stop capturing the data and search the results like HttpFox.
  
google_chrome_devtools_tips.txt ยท Last modified: 2018/02/05 20:10 by juckins