How to generate HAR file for support

Summary

A HAR file is usually requested by Technical Support for communication analysis between the browser and application. This file helps us to narrow down the problems that could be causing loading failures and slowness, for example.

Steps

NOTE:
Everything you do in the page, while you are reproducing the problem, is recorded, including sensitive data.
If the problem to be reproduced is related to the login page, for example, username and password can be collected and stored in the HAR file.
Before you send the file to us, open it with a text editor, search for your username and password (by using the editor's search) and replace with "XXXXXXXXX". Erasing instead of replacing or erasing any other text or lines might cause the file to get corrupted and unusable.

Generating a HAR file in Google Chrome™:

Open Google Chrome™
Browse to the target page
In the Google Chrome™ menu (⋮) at the upper right, click More tools > Developer Tools
A window opens (in this window you can find tabs named like: Elements, Console, Network, Performance,...)
Open the Network tab
Press the Preserve log, in the menu under Network
Reproduce the problem as requested by the Support team
As soon as the problem is reproduced, results show up in the table with some columns (Name, Method, Status,...). Click with the right-button of the mouse over any of those results
In the opened menu, click Save all as HAR with Content
A window opens requesting a location to save the file
Send the file to the Support team for analysis

Generating a HAR file in Firefox™:

Open Firefox™
Browse to the target page
In the Firefox ™(≡) at the upper right, go to Web Developer > Network
A window opens (in this window you can find tabs named like: Inspector, Console, Debugger, Network Style Editor,...)
The Network tab is selected
In the menu under Network, on the right side, click the gear with the name Network Settings > Persist logs
Reproduce the problem as requested by the Support team
As soon as the problem is reproduced, results show up in the table with some columns (Name, Method, Status,...). Click with the right-button of the mouse over any of those results
In the opened menu, click the Save all as HAR option
A window opens requesting a location to save the file
Send the file to the Support team for analysis

Generating a HAR file in Microsoft Edge:

Open Microsoft Edge
Browse to the target page
In the Microsoft Edge menu (...), go to More tools > Developer Tools
A window opens (in this window you can find tabs named like: Elements, Console, Debugger, Network, Performance,...)
Open the Network tab
Deactivate Clear entries on navigate by pressing the eighth button (from left to right)
Reproduce the problem as requested by the Support team
Click Export as HAR (third button from left to right)
A window opens requesting a location to save the file
Send the file to the Support team for analysis

Generating a HAR file in Internet Explorer:

Open Internet Explorer
Browse to the target page
In the Internet Explorer menu (⚙), click the Developer Tools option
A window opens (in this window you can find tabs named like: F12, DOM Explorer, Console, Debugger, Network,...)
Open the Network tab
Deactivate Clear entries on navigate by pressing the eighth button (from left to right)
Reproduce the problem as requested by the Support team
Click Export as HAR (third button from left to right)
A window opens requesting a location to save the file
Send the file to the Support team for analysis

Additional Information

What if you are debugging a button that opens a link in a new tab?

If you follow the previous steps, you might face a problem in which the Network console does not open and tracks the new tab. To fix that, you would need to follow the following steps on Google Chrome™:

Open Developer Tools
Click the Settings cogwheel icon at the upper right (or press F1)
Enable Auto-open DevTools for popups under "Global"