Capture console and network logs from your browser

If you’re encountering problems displaying your content on a web browser, the support team may request Chrome, Microsoft Edge, or Safari browser logs for analysis. To assist you in this process, I’ve outlined the types of logs needed and provided instructions on capturing them.

Follow the steps below to capture console and network logs using developer tools on both Windows and Mac. It’s crucial to provide both sets of logs to facilitate effective troubleshooting by the support team.

Windows

Microsoft Edge (Chromium-based)

Console logs

• On Microsoft Edge, click on the three dots icon from the upper-right corner of the web browser.
• Then, click on More tools > Developer Tools. The Developer Tools panel opens.
• From the Developer panel, click on the Console tab.
• Click on the gear icon on the top right sidebar.
• Next, click on the Preserve log checkbox.
• Ensure that the ‘All levels’ is selected.
• Then, click on the Clear button (or CTRL-L from the console page). This is to start clean when replicating an issue.
• Reproduce the issue that you have observed. Save the logs by doing right click> Save as and share it with the support team.

Network Logs

From the Developer panel, click on the Network tab. Reproduce the issue, and save all as HAR with content, zip the file, and share it with the support team.

Google Chrome

Console Logs

From the Settings drop-down menu, select More Tools and then Developer Tools(Ctrl+Shift+I or F12), then switch to the console tab. Replicate the issue and right click on the console and hit save as. This will save the log locally.

Network Logs

• To the right of the address bar, click and then More tools > Developer tools. Chrome’s Developer tools window opens.
• Click the Network tab.
• Enable the Preserve Log check box.
• Click Clear .
• While the console remains open, reproduce the issue.
• After you reproduce the issue, right-click any line and select Save all as HAR with content.

MacOSX

Safari

To get a network log with running on Safari, follow these steps: Console and Network Logs

• Click Safari > Preferences and then the Advanced tab.
• Select the Show Develop menu in the menu bar check box. Safari adds the Develop menu to the browser.
• Close Safari Preferences.
• Navigate to the issue via Safari, and on the Develop menu, click Show JavaScript Console.
• Click the Network tab.
• Leave the console open and reproduce the issue.
• After you reproduce the issue, right-click on any line on the right and select Export as HAR.
• Save the file.

Google Chrome

Console Logs

To open the developer console in Google Chrome, open the Chrome Menu in the upper-right-hand corner of the browser window and select More Tools > Developer Tools. You can also use Option + ⌘ + J (on macOS)

Network Logs

• To the right of the address bar, click and then More tools > Developer tools. Chrome’s Developer tools window opens.
• Click the Network tab.
• Enable the Preserve Log check box.
• Click Clear .
• While the console remains open, reproduce the issue.
• After you reproduce the issue, right-click any line and select Save all as HAR with content.
• Name and save the file.