Skip to main content

How to open the browser console and collect debug information

Updated

General information

To better analyze the errors you are experiencing, it is useful to look at the error messages in the browser console. You can view this by pressing the "F12" key on the keyboard in any browser. You may also have to click on the "Console" tab. Error messages shown in red are most pertinent.

 

These are the general instructions. Check the corresponding sections below for instructions on how to open the console in your specific browser.

  1. Open the console window before the error occurs

  2. Select the console tab and clear all appearing entries via click on the button with the circle

  3. Select the network tab and clear all appearing entries via click on the button with the circle

  4. Now reproduce the error

  5. Take a screenshot of the browser and console tab open and another one with the network tab open

  6. Finally save the content of the console tab by doing a right mouse click somewhere in the console window. Select "Save as..." in the appearing context menu. Repeat the same on the network tab and click on "Save all as HAR..." in the context menu

  7. Send the screenshots and the two log files to SoSafe support

Chrome

After you opened the menu (Three dots) in the upper-right-hand corner of the browser window and select “More Tools” > “Developer Tools” or pressing F12, a column will open on the right. You may also have to click on “Console” or “Network“. Error messages are marked in red, warnings are in yellow.   

Clear console + network tab:

Chrome DevTools with the Console tab and its clear icon highlighted in one panel, and the Network tab with its clear icon highlighted in a second panel below.

Console + network output:

Chrome DevTools Console tab showing a red parsing error and two source map warnings, next to the Network tab listing several requests including adal.min.js and preflight and xhr calls.

Download console + network tab:

Chrome Console tab with its right-click context menu open and Save as highlighted, next to the Network tab with its context menu open and Save all as HAR with content highlighted.

Edge

After you opened the menu (Three dots) in the upper-right-hand corner of the browser window and select “More Tools” > “Developer Tools” or pressing F12, a column will open on the right. You may also have to click on “Console” or “Network“. Error messages are marked in red, warnings are in yellow.  

 

Clear console + network tab:

Microsoft Edge DevTools with the Console tab and its clear icon highlighted in one panel, and the Network tab with its clear icon highlighted in a second panel below.

Console + network output: 

Microsoft Edge Console tab showing a warning about re-registered icons, next to the Network tab listing several requests including moeerrorux.css, progress.gif, and moe_status_icons.png.

Download console + network tab:

Microsoft Edge Console tab with its right-click context menu open and Save as highlighted, next to the Network tab with its context menu open and Save all as HAR with content highlighted.

Firefox

After you opened the menu (Three lines) in the upper-right-hand corner of the browser window and select “More Tools” > “Web Developer Tools” or pressing F12, a column opens at the bottom. You may also have to click on “Console” or “Network“. Error messages are marked in red, problems are in yellow. If the errors are not displayed all at once, the window can be enlarged by dragging the console margin (green arrow).   

Clear console + network tab:

Firefox Console tab with its clear icon highlighted, next to the Network tab with its own clear icon highlighted above a message to reload the page for details.

Console + network output:

Firefox Console tab showing warnings about a partitioned cookie, an XML parsing error, and a cookie without a proper attribute, next to the Network tab listing requests to reporter.sosafe.de and appsforoffice domains.

Download console + network tab:

Firefox Console tab with its context menu open and Save all Messages to File highlighted, next to the Network tab with its context menu open and Save All As HAR highlighted.

Internet Explorer

Note that Internet Explorer has been discontinued. We recommend using its successor Edge instead.

After pressing F12, a column opens at the bottom.  You may also have to click on “Console”. Error messages are marked in red, warnings are in yellow. If the errors are not displayed all at once, the window can be enlarged by dragging the console margin.

Related articles