这是我的一个宠物问题w/chrome调试器。我有一个调用第三方库的函数,它在内部调用了20个其他函数,第20个库函数再次调用了我的库中的另一个函数。
MyFunctionA()
调用libFunctionA()
调用libFunctionB()
...调用libFunctionZ()
calls MyFunctionB(){debugger;}
如果我在MyFunctionB中放置一个调试器,我会看到如下的堆栈跟踪:
- MyFunctionB
- libFunctionZ
- libFunctionY
- libFunctionX
1.......这是一个问题。
1.......这是一个问题。 - MyFunctionA
我想隐藏所有的libFunctions(X,Y,Z等),这样我就可以很容易地在堆栈中只看到我的库函数,如下所示: - MyFunctionB
1...隐藏的库函数.. - MyFunctionA
有没有办法在Chrome或Firefox的调试器中做到这一点?
4条答案
按热度按时间pu3pd22g1#
你可以blacklist那些你不想看到的脚本。
步骤:
1.方法一:
1.单击调用堆栈中要列入黑名单的文件。
1.右键点击源代码,选择“黑名单源”
1.方法2:您可以黑盒完整的文件夹或文件在设置>黑盒,使用一种模式
Next time:当在断点上暂停时,在调用堆栈中,您将看到一条消息,说明被黑盒的帧数。如果需要,您可以显示这些帧,但由于它们是从黑盒脚本发出的调用,因此除非单击“显示”,否则它们将被隐藏。
8ljdwjyq2#
您可以在Chrome + Webpack中隐藏所有不相关的堆栈跟踪行,方法是添加
到Chrome开发人员工具设置中的黑名单源列表。
这是跟踪之后的样子:
特别感谢其他海报@Shishir Arora + @str
mlnl4t2r3#
Mozilla刚刚宣布了this feature was built into Firefox 58 Developer Edition。这很可能意味着它也将在Firefox 58中可用。
类似地,调试器可以识别二十多个常见的JavaScript库,并在调用堆栈中对它们的堆栈帧进行分组。这使得在跟踪bug时,可以轻松地将您编写的代码与框架提供的代码分开:
tzxcd3kk4#
从Chrome 106开始,可以忽略已知的第三方脚本。
进入开发工具设置>忽略列表>勾选自动将已知的第三方脚本添加到忽略列表。
Chrome 106 DevTools中的新功能:
使用自动添加已知的第三方脚本以忽略列表设置,调用堆栈现在只显示与代码相关的帧。
要查看所有帧,请启用“显示忽略列表的帧”。以前,DevTools默认显示所有帧。
如果某个脚本未被自动忽略,则可以将其添加到忽略列表中。在调用栈中,右键单击,选择【添加脚本忽略列表】。