PractiProject

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™:

  1. Open Google Chrome™

  2. Browse to the target page

  3. In the Google Chrome™ menu (⋮) at the upper right, click More tools > Developer Tools

  4. A window opens (in this window you can find tabs named like: Elements, Console, Network, Performance,...)

  5. Open the Network tab

  6. Press the Preserve log, in the menu under Network

  7. Reproduce the problem as requested by the Support team

  8. 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

  9. In the opened menu, click Save all as HAR with Content

  10. A window opens requesting a location to save the file

  11. Send the file to the Support team for analysis


 

Generating a HAR file in Firefox™:

  1. Open Firefox™

  2. Browse to the target page

  3. In the Firefox ™() at the upper right, go to Web Developer > Network

  4. A window opens (in this window you can find tabs named like: Inspector, Console, Debugger, Network Style Editor,...)

  5. The Network tab is selected

  6. In the menu under Network, on the right side, click the gear with the name Network Settings > Persist logs

  7. Reproduce the problem as requested by the Support team

  8. 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

  9. In the opened menu, click the Save all as HAR option

  10. A window opens requesting a location to save the file

  11. Send the file to the Support team for analysis


 

Generating a HAR file in Microsoft Edge:

  1. Open Microsoft Edge

  2. Browse to the target page

  3. In the Microsoft Edge menu (...), go to More tools > Developer Tools

  4. A window opens (in this window you can find tabs named like: Elements, Console, Debugger, Network, Performance,...)

  5. Open the Network tab

  6. Deactivate Clear entries on navigate by pressing the eighth button (from left to right)

  7. Reproduce the problem as requested by the Support team

  8. Click Export as HAR (third button from left to right)

  9. A window opens requesting a location to save the file

  10. Send the file to the Support team for analysis


 

Generating a HAR file in Internet Explorer:

  1. Open Internet Explorer

  2. Browse to the target page

  3. In the Internet Explorer menu (⚙), click the Developer Tools option

  4. A window opens (in this window you can find tabs named like: F12, DOM Explorer, Console, Debugger, Network,...)

  5. Open the Network tab

  6. Deactivate Clear entries on navigate by pressing the eighth button (from left to right)

  7. Reproduce the problem as requested by the Support team

  8. Click Export as HAR (third button from left to right)

  9. A window opens requesting a location to save the file

  10. 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™:

  1. Open Developer Tools

  2. Click the Settings cogwheel icon at the upper right (or press F1)

  3. Enable Auto-open DevTools for popups under "Global"