There are a lot of scenarios when inspecting a site in Chrome where you don't want any click events to fire and you don't want any scripts to run. Or maybe something is animating in and out of the page and you want to capture it at a certain moment. This is a great use case for pausing script execution, which is kind of using the debugger manually by going into the Chrome DevTools and the Sources tab and clicking the pause button to essentially pause the entire page. This will give you a chance to inspect any of the elements and styles you want to inspect. And you don't have to worry about fire and click events or anything that might interrupt your investigation into the elements and styles that you want to find.
Transcript
[00:00] So I found a situation where I would click on this and I like this blur, but it would go away. And if I click on this again, the blur is no longer there. So I can't inspect it or see what it was. So what you can do here is go into your sources panel in the Chrome DevTools. And as soon as the blur appears click on pause down here so that the debugger pauses but you can still inspect the elements and dig down into what you want to look at.
[00:27] So for example this one here, digging down, digging down, had a blur of 80 pixels. And what's nice about this is that all the click events are disabled, everything's disabled until you click run again. So it's even much easier on a page like this when you're in sources, click pause, and then no click events fire you can easily inspect the elements with everything paused.