How to get the browser network & console logs

Preparation Steps:

1. Open the browser’s Developer Tools tab:

   1. Use keyboard shortcuts:

      1. Windows/Linux: Press Ctrl + Shift + I

      2. macOS: Press Command (⌘) + Option (⌥) + I

   2. Or use the browser’s menu:

      1. Click on the three dots (⋮) or similar menu icon in the top right corner of your browser window.

      2. Select More tools or Settings (depending on your browser).

      3. Choose Developer tools from the menu.

Open

Open Developer Tools Tab

2. Access the Network tab:

   1. Locate the Network tab in the Developer Tools window. If you don't see it readily, look for a double right-angle arrow (>>) symbol at the end of the tab list and click on it to reveal hidden tabs.

   2. Enable capture options: Click the "Preserve log" checkbox in the Network tab to ensure all network activity is recorded. This helps capture the relevant data while reproducing the issue.

Open

Network log tab

3. Access the Console tab:

   1. Look for the Console tab in the Developer Tools window. If it isn't readily visible, follow the same steps as in point 2.a to find it using the double-right arrow symbol.

Reproduce the behaviour:

Close any unnecessary browser tabs to minimize background activity that could interfere with capturing the specific issue.

1. Perform the steps that typically lead to the issue you want to report. This includes navigating the app and interacting with features in the same way you encountered the problem.

2. Once the steps are completed and the behaviour reveals itself:

   • Network tab: Click the downward-pointing arrow button (usually located in the top left corner) to download the HAR file. This file captures all network requests and responses during the recording period.

   • Console tab: Right-click anywhere in the console area and choose "Save as..." to save the console log as a text file. This file captures any error messages or other relevant information displayed in the console during the reproduction.