This feature isn't yet supported in the new debugger. If you need to use it, you can, for now, switch back to the old debugger by visiting about:config and setting the "devtools.debugger.new-debugger-frontend" preference to false.
To see the docs for the old debugger, please visit Debugger (before Firefox 52).
In modern web development, we often rely on libraries like jQuery, Ember, or Angular, and 99% of the time we can safely assume that they “just work”. We don’t care about the internal implementation of these libraries: we treat them like a black box. However, a library’s abstraction leaks during debugging sessions when you are forced to step through its stack frames in order to reach your own code. With black boxing, you can tell the debugger to ignore the details of selected sources.
To enable or disable black boxing for a source, select the source in the source list pane and click the eyeball icon at the bottom left:
You can black box several sources at once by opening the developer toolbar and using the dbg blackbox command:
When a source is black boxed:
- Any breakpoints it may have are disabled.
- When “Pause on Exceptions” is enabled in the Debugger settings, the debugger won’t pause when an exception is thrown in the black boxed source; instead it will wait until (and if) the stack unwinds to a frame in a source that isn’t black boxed.
- The debugger will skip through black boxed sources when stepping.