The Console panel is responsible for rendering all logs coming from the current page.
The Console panel UI is built on top of React. It defines set of React components in
The React architecture is described on the following diagram.
There are several external components we use from the WebConsole:
ObjectInspector/Rep: Used to display a variable in the console output and handle expanding the variable when it’s not a primitive.
Frame: Used to display the location of messages.
SmartTrace: Used to display the stack trace of messages and errors
TabboxPanel: Used to render a network message detail. This is directly using the component from the Netmonitor so we are consistent in how we display a request internals.