38

I want to inspect elements of my page in development that disappear right after he mouse leaves them. Fot this and other scenarios I want something like a "disable JS" plugin or console-command, that works not only at pageload time, but can completely halt any and every js of the current page at any time.

Does such a solution exist? I would prefer chrome, but accept firefox. Thanks.

Zsolt Szilagyi
  • 4,741
  • 4
  • 28
  • 44
  • 2
    Is that not the puropose of the dev-tools, namely the "debugger" inside chrome? – Thomas Junk Jul 05 '13 at 23:07
  • 3
    @Lilith2k3 I think the problem he's having is that you have to use the mouse to use the debugger, and that makes it difficult to debug scripts that deal with mouse events. – Barmar Jul 05 '13 at 23:11
  • 2
    http://stackoverflow.com/questions/1265623/programmatically-stop-javascript-execution-in-firefox-firebug – user2357112 Jul 05 '13 at 23:25

2 Answers2

51

What worked for me to pause execution:

  1. Open Chrome javascript console (Ctrl+Shift+J)
  2. Go to "sources"
  3. On the right side, click the little "pause" icon, or press F8 to pause script execution.

You can also put in "breakpoints" within the same console. Try the following to use breakpoints:

  1. Open Chrome javascript console (Ctrl+Shift+J)
  2. Go to "sources"
  3. On the right side, click the little "pause" icon, or press F8 to pause script execution.
  4. Now you can click the "Step over", "Step Into", etc functions on the right side to slowly step into the code, line by line.
  5. You can also click on the line number for any of the sources to add a breakpoint. Breakpoints will stop the code execution when it is reached. You can enable/disable breakpoints on the right side next to the other buttons mentioned above.
Katie
  • 45,622
  • 19
  • 93
  • 125
  • 1
    Thanks for the info. I always had trouble trying to inspect js generated elements triggered on hover. Not anymore. :) – lithiumlab Sep 27 '15 at 19:56
  • Nice, but what I really want to do is reduce CPU usage to less than 100% and stop the text from shifting every few seconds. The Ctl-Shift-J and F8 thingy greys out and freezes the whole page. Not what *I* want. I just want to read the page. – Bruce K Aug 19 '19 at 19:15
14

Try using the debugger; directive (relevant MDN article). This acts like a breakpoint and should help you debug your scripts using the normal developer console.

Andrei Bârsan
  • 3,473
  • 2
  • 22
  • 46
  • 1
    Thank you, that did work out just as I needed: 1) Open console, type `debugger;` 2) Press F8 to release the pause. 3) Use the mouse to set whatever state neeed 4) Without leaving with the mouse, press F8 again to pasue scripts. Clicking elements for inspection doesn´t work while paused, but it still works from the elements-tab. – Zsolt Szilagyi Jul 06 '13 at 22:09
  • Great simple Hack...! – Kashyap Kotak Oct 02 '18 at 14:26