Skip Javascript Framework when debugging in Chrome

Question

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

I turned on Blackbox mode for the file template as follows

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

However, if I press the pause button in the developer tools and when the mouse moves to the page, the script still stops at jquery.min.js with a yellow box depicting as an image.

I just want to debug which function is executed when I did some action, for example, press a button, etc.

But jquery.min.js don't let me know this. Do you know how to bypass or facilitate debugging?

Many thanks.

Answer 1

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

You can:

• enter the file name,
• use regular expressions to target:
  • files containing the specific name /backbone.js $,
  • some file types like .min.js $
• or enter the entire folder containing the scripts that you want to use in the blackbox, for example bower_components.

As far as I know, you cannot enter a regex (thing1 | thing2 | thing3 | etc.). This will not work.

Here is a screenshot of what you can do though.