Chrome: Troubleshooting with Developer Tools
How to access Developer Tools:
Option 1:
- On the page where you are experiencing an issue, click the three dots in the top-right corner of the Chrome window.
- Select "More tools" and then click "Developer tools"
Option 2: Use the following keyboard shortcut:
- Windows: Ctrl+Shift+J
- Mac: Cmd+Opt+J
You will see something like shown here in red in the Console tab:
Important Note: When taking a screenshot to report an issue, make sure to capture the entire browser window, including the URL address bar and the Developer Tools console.
Edge: Troubleshooting with Developer Tools
How to access Developer Tools:
Option 1:
-
On the page where you are experiencing an issue, click on the 3 dots in the top right corner on the browser window.
- Select "More tools" and then click "Developer tools"
Option 2: Use the following keyboard shortcut:
- Windows: Ctrl+Shift+J
You will see something like shown here in red in the Console tab:
Important Note: When taking a screenshot to report an issue, make sure to capture the entire browser window, including the URL address bar and the Developer Tools console.
Firefox: Troubleshooting with Developer Tools
How to access Developer Tools:
Option 1:
-
On the page where you are experiencing an issue, click on the 3 lines in the top right corner on the browser window.
-
Select “More tools” and then click “Web Developer Tools”
Option 2: Use the following keyboard shortcut:
- Windows: Ctrl+Shift+J
- Mac: Cmd+Opt+J
You will see something like shown here in red in the Console tab:
Important Note: When taking a screenshot to report an issue, make sure to capture the entire browser window, including the URL address bar and the Developer Tools console.
Safari: Troubleshooting with Developer Tools
1. You need to first enable the developer menu to access the web inspector on Safari:
- Click on the Settings icon in the top right corner of the browser window. Then click on Preferences.
- Click on the Advanced tab.
- At the bottom of the pane, select the “Show Develop menu in menu bar” checkbox.
After enabling the Develop menu, click on the Settings icon in the top right corner of the browser window. Click on 'Show Tab Bar.'
You will see “Develop” in the Menu bar at the top.
2. On the page where you are experiencing an issue:
- Click on “Develop”
- Select “Show Error Console”
You will see something like shown here in red in the Console tab.
Important Note: When taking a screenshot to report an issue, make sure to capture the entire browser window, including the URL address bar and the Developer Tools console.
Comments
0 comments
Please sign in to leave a comment.