Skip Javascript Framework while Debugging in Chrome

Question

I did research and found this website give my very useful information https://divshot.com/blog/tips-and-tricks/ignoring-library-code-while-debugging-in-chrome/

I did enable blackbox mode for the file pattern as following

(firebug|angular|knockout|jquery|bootstrap|modernizr|respond)

However, if i click the pause button in developer tools and when the mouse is over a page, the script still stop at jquery.min.js with the yellow box showing like the picture.

I just want to debug which function is performed when i did some action like, Click particular button etc.

But the jquery.min.js stop me from knowing this. Do you have any idea how to workaround or to make debugging more easier?

Thank you very much.

Billow

I think this was actually a bug, but I can see where it came from. You write you moved your mouse and it jumped to a blackboxed script. I think this might have actually been by design at first, but later they removed it. It seems to be working fine now. 2 years later. ;-) – Chantilly

Answer 1

You need to enter in one library at a time if you are going to do them like that. Read the docs on blackboxing for more info https://developer.chrome.com/devtools/docs/blackboxing

You can:

• enter the name of a file,
• use regular expressions to target:
  • files that contain a specific name /backbone.js$,
  • certain types of files like .min.js$
• or enter in an entire folder that contains scripts you want to blackbox such as bower_components.

To my knowledge you cannot enter a regex like (thing1|thing2|thing3|etc). That will not work.

Here's a screenshot of what you can do though.

Supreme

The blackbox did work find to my js framework (as you can see it has yellow bar on the jquery.min.js) My problem is the "Pause script execution (F8)" on Developer tools did pause on the blackbox js, but not my actual script. This give me a hard time for debugging. So, i'm wonder how does anyone fix this problem. – Billow

If the file is open it will pause in it. If it still does it when you close all the files, refresh and try stepping through your code again, and it still pauses in the blackboxed script then that sounds like a bug in the feature and should be reported in crbug.com – Supreme

Answer 2

You can use default devtools ignore list.

1. Click on gear at the right side, and include all files you want to skip, by clicking at the "Add pattern ..." button

Pother