Getting started with google-chrome-devtools

Search by filename

While in the sources tab use CTRL+O (+O for Mac) to search by filename.

Go to member (javaScript function/CSS rule)

Use CTRL+SHIFT+O (+SHIFT+O for mac) to navigate to a javaScript function/CSS rule when viewing a file.

Accessing Chrome Dev Tools

While chrome browser is open to any tab (except welcome tabs) you have three options to open Chrome Dev Tools:

Keyboard: Type command ⌘+option+i

Browser Menu: Click ‘Menu’ > ‘More Tools’ > ‘Developer Tools’

browser menu to chrome dev tools

Program Menu (at top of your screen): Click ‘View’ > ‘Developer’ > ‘Developer Tools’

Program Menu to chrome dev tools