/dev tips

🎊   The Modern DevTools course has now started! Visit ModernDevTools.com to find out more   🎊

(165) Local overrides Copy as Fetch (167)

Chrome DevTools: Understand how DevTools works at a deeper level with the protocol monitor

13th March 2018
Understand how DevTools works at a deeper level with the protocol monitor

The experimental Protocol Monitor in Canary displays the underlying requests and responses happening over the DevTools protocol.

For example, when evaluating some JavaScript via DevTools, observe the following messages on the protocol:

Many UI actions, such as inspecting elements, will trigger messages to be sent/received over the protocol. As an exercise, try these actions out yourself and observe the payloads.

Sign up to receive a developer tip, in the form of a gif, in your inbox each week.