Use this guide to access your browser logs when asked by the Searchie Support team to do so
Access your browser's console and network logs Use this guide to access your browser logs when asked by the Searchie Support team to do so. (Google Chrome, Mozilla Firefox and Safari) WillWhen you report an issue or a bug to our team, you may be asked to send some browser information that could seem daunting to locate at first. This quick explainer article is going to show you how you can find your browser's console or generate a HAR file for our network team to debug. We'll explain the process for the following browsers:
-
Google Chrome
-
Mozilla Firefox
- Safari
Google Chrome
To open the dedicated Console panel:
-
On Windows/Linux, press Ctrl + Shift + j
-
On Mac, press Cmd + Option + j
To open the dedicated Network panel:
-
On Windows/Linux, press Ctrl + Shift + i
-
On Mac, press Ctrl + Option + i
You can also open the Developer Tools panel where these features are located by clicking the three dots dropdown menu on the top-right of your browser and clicking “More tools > Developer tools”.
Once inside the Developer Tools panel, you can navigate to the various panels at the top of the window.
Mozilla Firefox
To open the dedicated Console panel:
-
On Windows/Linux, press Ctrl + Shift + k
-
On Mac, press Cmd + Option + k
To open the dedicated Network panel:
-
On Windows/Linux, press Ctrl + Shift + e
-
On Mac, press Cmd + Option + k
You can also open the Web Developer Tools panel by selecting the dropdown menu in the top-right of your browser and clicking “More tools > Web Developer Tools”.
Once inside the Web Developer Tools panel, you can navigate to the various panels at the top of the window.
Safari
In Safari, console and network logs are available as a part of the "Develop" menu. By default, these options are disabled. To enable the "Develop" menu, follow these steps:
-
Open Safari
-
Go to “Safari > Preferences” (from the toolbar at the top of your screen)
-
Go to the "Advanced" tab
-
Enable “Show Develop menu in menu bar”
Once you’ve enabled the Develop menu, you can open the Console by pressing Cmd + Option + C. You can also right-click on the webpage and select "Inspect Element" and the Develop menu will appear.
Once inside the Develop menu, you can navigate to the various panels at the top of the window.
Generating a HAR File
HAR file information is a visual representation of what is happening with your browser's network. It's extremely helpful for debugging network errors or problems with buffering, loading, or other unexpected behaviour.
Depending on which browser you are using, there are a few ways to generate a HAR file. Below we will break down each browser using some steps from above.
Google Chrome
Navigate to the Network tab as explained above. Ensure the round button at the top-left of the window is red and select the "Preserve Logs" checkbox. Next, you must recreate the issue you're experiencing. Try loading that faulty file, get that buffering problem to rear its ugly head, etc..
Once you have recreated what you would like to capture, you can save the HAR file by clicking the download button in the top-right of the window as shown below.
Firefox
Navigate to the Network tab as explained above. Once you have recreated the issue and captured it in the Network tab, you can export it to a HAR file by clicking on the gear icon in the top-right and selecting "Save All As HAR".
Safari
Navigate to the Network tab as explained above. Once you have recreated the issue and captured it in the Network tab, click the "Export" button in the top-right of the menu.
