Help us make DevTools Tips better! Fill out this survey to tell us more about your DevTools habits and frustrations.
-
Inspect and debug iframes
If the page you are working on contains an iframe which you want to inspect and debug, you can actua... Read moreSupported by:
-
View console logs from non-Safari browsers on an iPhone
Using the about:inspect special page you can see your website's logs in Chrome or Edge running on iP... Read moreSupported by:
-
Disable abusive debugger statements that prevent inspecting websites
Some websites make it impossible to use DevTools by adding debugger statements in their code. The st... Read moreSupported by:
-
Manipulate global objects on page load, before other scripts run
When a page loads, and all of its global objects are ready, but before the JavaScript code of the pa... Read moreCategories:Supported by:
-
Find inactive CSS styles
Sometimes we write CSS code that's entirely valid but has absolutely no effect at all, and this can... Read moreSupported by:
-
Debug popups that appear on hover using the debugger statement
In Debug popups that appear on hover using JS we described how to pause the debugger to inspect popu... Read moreSupported by:
-
Simulate pseudo CSS classes
If you use :hover, :active, and other such pseudo-classes in CSS, you can actually simulate these st... Read moreSupported by:
-
Cut down on console noise using live expressions
Using the Console of DevTools to log information that changes a lot is a bad idea. First of all, you... Read moreSupported by:
-
Console.log() for the web with logpoints
Using the console to log some information is a very common way to debug your JavaScript. But you can... Read moreSupported by:
-
Debug popups that appear on hover using JS
Have you ever been frustrated because you couldn't style a popup or tooltip that appeared on hover?... Read moreSupported by:
-
Monitor all events dispatched on an element
You can use the monitorEvents global function in the Console panel to log all of the events dispatch... Read moreSupported by:
-
Pause script execution when the DOM changes
If you want to know what JavaScript code removes, adds, or modifies a DOM element in the page, you c... Read moreSupported by:
-
Play a sound when a line of JavaScript is executed
Sometimes pausing execution when a line of JavaScript is executed is too much, sometimes you only wa... Read moreCategories:Supported by:
-
Unminify JavaScript code to easily read and debug it
Sometimes, the JavaScript code that runs on a website is minified and really hard to read. This is c... Read moreSupported by:
-
Use the debugger statement to pause script execution
If you prefer to use console.log() statements rather than the JavaScript debugger because you find i... Read moreSupported by: