Logs tab

The most common technique to debug JavaScript applications is writing console.log statements. While simple and effective, it can be challenging to correlate log statements to a specified request, as well as correlating server logs & browser logs for the same request. Glimpse’s Logs tab solves these problems by bringing together all of the browser and server logs for a single request and showing them in a single display.

Log statements from browser and server in a single view

Log statements from browser and server in a single view

The Logs tab is comprised of two main components:

In addition, the expand/collapse buttons allow for the expansion/collapse of grouped messages and any formatted JSON trees. Note in the figure above, the first statement is a console.log from the server, and the next five are console.log statements from the browser.

Filter bar

The figure below shows the filter bar for the Logs tab. Users can include or exclude events based on whether they occurred in the server or the browser (D), or based on the logging level(E). Filters can be easily reset to their defaults (F).

Easy filtering of a request's log statements.

Easy filtering of a request's log statements.

Log table

The figure below shows the Log table. The table shows the currently selected request’s logging statements after any Filter bar filters have been applied. The “Message” column has styling applied to better reflect the output of the log statement. For example, format parameters will be highlighted, URLs will be auto-linked, and any JSON data will be displayed in a collapsible/expandable tree. Log entries can be expanded individually, or all log entries in the table can be expanded/collapsed via the expand-all/collapse-all button to the right of the filter bar.

The location where a log statement was written is shown in the location column. To see the full path, mouse-over it.

Easily navigate complex log statements with complex JSON.

Easily navigate complex log statements with complex JSON.