Chrome keyboard shortcut to pause script execution
Is there a keyboard shortcut in Google Chrome which will break script execution? (Equivalent to pressing the ||
"Pause script execution" button in the Developer Tools Scripts panel.)
I'd like to use the Dev Tools to inspect an element in its mouseover state; the mouseleave
code will obviously run if I try to actually click the pause button!
Update: Dev Tools has many built-in shortcuts (press F1 for a list). Pausing script execution is F8 (when looking at the Sources tab, as of Chrome 45) or Ctrl+/.
The shorcut only works in the main browser window if the Dev Tools are already open to the Sources tab.
If the above shortcut doesn't work, 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.)
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.