Chrome keyboard shortcut to pause script execution
While I haven't found the exact solution to this problem, I did come up with a one-liner that can be put in a page (or pasted in the Javascript console) to achieve my goal:
jQuery(window).keydown(function(e) { if (e.keyCode == 123) debugger; });
This will cause execution to be paused when you hit F12.
(debugger is a JavaScript statement that forces a breakpoint.)
Update: Dev Tools has many built-in shortcuts (press F1 for a list), but you must be focused in the Dev Tools window for them to work. Pausing script execution is F8 (when looking at the Sources tab, as of Chrome 45) or Ctrl+/.
The above one-liner might still be useful if you need to stay focused in the page before pausing.
Google's Keyboard Shortcuts Reference lists for "Pause / resume script execution":
- F8 or Ctrl+\ (Windows)
- F8 or Cmd+\ (Mac)
There are easier ways to inspect things in odd states like hover or active. First, find the DOM node in the Elements pane of Chrome Dev Tools. Now you can either right-click the node and look at the "Force Element State" in the context menu, or select the node and look in the Styles tab and find the dashed-box-with-mouse-pointer icon in the top right (next to the +/plus icon which lets you add a new CSS rule to element.style, the element you selected).
When you activate one of these states, the left margin of the elements pane gets a little circle to indicate that you've overridden the natural state of the element on that line.
I wrote a quick little Chrome Extension that allows you to press the Pause button on your keyboard to pause javascript execution
How to get it:
- Chrome WebStore
- Source Code on GitHub
- CRX File
Usage:
- Keep chrome developer tools open
- Press
pause/breakon your keyboard