I'm trying to create a rotating banner (JavaScript & CSS). For debugging and making changes on the CSS etc in the developers' console, I want to pause the JavaScript execution while I make changes and then run it or so on. So, is there a way to pause the script execution in the browser?
2
-
12F8.katspaugh– katspaugh2011-12-06 07:54:57 +00:00Commented Dec 6, 2011 at 7:54
-
The answer you seek is here stackoverflow.com/questions/17931571/…Abram– Abram2017-12-17 18:47:02 +00:00Commented Dec 17, 2017 at 18:47
Add a comment
|
3 Answers
As katspaugh mentions in their comment:
F8
This only works for me from the Sources tab of the Developer Tools window in Chrome 59.0.3071.115 (on Mac OS X).
Comments
You are looking for "breakpoints".
Which browser are you using?
Chrome supports breakpoints right away in its developer tools:
F12 (or Ctrl-Shift-I), "Script" tab, select script from dropdown, click the line number.
Update:
On PC: F12 or Ctrl+Shift+I / On Mac: Cmd+Alt+I
select "Sources" tab, select script from the file pane on the left, click the line number.
In Firefox use the Firebug extension:
On PC and Mac: F12,
"Script" tab, activate & reload if needed, select script from dropdown, click line number.
When your Javascript pauses at a breakpoint, both browsers offer you the usual debugging tools to single step through the code, inspect & change variable values, watch expressions,...
10 Comments
Travis Heeter
My javascript is minified automatically. Is there a function like console.pause(); I can put in the javascript code, which will stop execution?
Jpsy
@TravisHeeter: Most browsers support the
debugger; keyword in JS code to trigger their debugger. This is equivalent to setting a breakpoint in the code.
Katharine Osborne
What is the Mac equivalent to open the script tab?
Katharine Osborne
@Jpsy thanks :-) I found the sources clarification elsewhere as well. F12 is mapped to a volume button on my Mac so I'm a bit baffled by that one. I'm sure there is a way to remap it (or some arcane key combo to access it).
Jpsy
@KatharineOsborne: You have to hold down the Fn key to access the F1 to F12 functions of the upper key row. There is also a checkbox in the keyboard settings that allows you to invert that behavior. If activated the F1 to F12 function will be the default and you need to press the Fn key to access volume, brightness, etc.
|
You can write a pause code yourself. Pause javascript excution using debugger. In the chrome console, run:
window.addEventListener('keydown', function(event) {
if (event.defaultPrevented) {
return; // Should do nothing if the default action has been cancelled
}
let handled = false;
if (event.keyCode == 121) {
handled = true;
debugger; // 121 is the keyCode of F10
}
if (handled) {
// Suppress "double action" if event handled
event.preventDefault();
}
});
Highlight element with inspector
Hit F10
3 Comments
dwjohnston
F12 is a bad keycode to use, it's the native dev tools one
bharal
it's like he/she was so close then fell over and knocked themselves out during their pre-victory dance
Zihao Zhao
Special thanks to @dwjohnston. I updated the keycode to use F10.