Step 1: Open Google Chrome
- Begin by opening your Google Chrome browser.
Step 2: Access Developer Tools
The below commands will open the Developer Tools panel, Alternatively you can access them by right-clicking in your chrome browser and selecting “Inspect”
- Windows Users - Press Ctrl + Shift + I
- Mac Users - Press Command + Option + I
Step 3: Go to the Network Tab
- In the Developer Tools panel, find the tab labeled "Network" and click on it. This tab allows you to monitor network activity.
Step 4: Start Capturing Network Traffic
- Ensure that the recording is active. There should be a red circle at the top-left corner of the Network tab. If it's not red, click on the grey circle to start recording.
Step 5: Enable Log Preservation
- Select the checkbox next to “Preserve log” at the top, This ensures that network data isn’t cleared with each page load.
Step 6: Duplicate the issue
- Now, you are ready to duplicate the issue to capture it in the logs. If unsure what you need to do please reach out via your ticket or open a new ticket for the issue.
Step 7: Identify WebSocket Traffic
- WebSocket traffic can be identified by the “WS” sub-tab within the Network tab. Click on "WS" to filter and view only WebSocket traffic.
Step 8: Save the .HAR File
- After completing your interaction on the site and capturing the necessary data by clicking the download icon shown below. This saves all the logged network activity, including WebSocket traffic, into a .HAR file.
Step 9: Choose a Save Location
- A file dialog will appear. Choose where you want to save the .HAR file on your computer, and then click "Save."
Step 10: Share the .HAR File
- You can now review the .HAR file using any compatible viewer or share it for further analysis.
Additional Tips
- Ensure that you only capture the necessary period to avoid an excessively large .HAR file.
- Be aware that .HAR files can contain sensitive information, such as personal data, so handle them with care.