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

The experimental Protocol Monitor 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:

• Runtime.compileScript
• Runtime.evaluate
• Debugger.scriptParsed
• Debugger.scriptParsed
• Runtime.consoleAPICalled

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.