Skip to main content

Browser F12 Dev Tools

Rachel Martin avatar
Written by Rachel Martin
Updated over 2 months ago

Console Tab

To assist Tier 2 and Tier 3 Support and the Development team in troubleshoot web application issues you can make use of the Dev Tools option on Edge and Chrome browsers (Edge is Microsoft’s browser based off Chrome). To open the tools select the F12 key on the keyboard whilst on the browser of choice (or Ctrl + Shift + I or the three dots to the right of the menu bar (…) > More Tools > Developer tools

Console Tab.png


Once it opens you can select tabs (normally it opens to the right of the web page you are on) Console logs can assist in troubleshooting page issues but some tweaks will be needed to gather the appropriate data needed, Select Console and click on “Preserve log” and “Show CORS errors in Console” in addition select the ‘All levels’ dropdown and select “Verbose”, these selections will stay for all future activities unless you clear your cache on the browser. If you now refresh the website you are on new lines should appear

Console Log.png

To save these logs if you right click on the text field you will get the below selection, “Save as…” will allow you save the text as a log file for further analysis

Console log save.png

Sources, Network & Application Tabs

These tabs can provide additional live information around network conditions and the sub applications on the website; Dev may request to screenshot these if needed. They can also be used to clear individual element caches and cookies

F12 Tabs.png
Did this answer your question?