Chrome控制台 - 整个文件的断点

Question

是否有任何选项可以在chrome控制台的文件中设置类似“断点”的东西（在文件的每行代码中设置断点的快捷方式）？

在尝试理解您知道已执行但不知道代码的哪个部分以及何时执行的第三方脚本时非常有用。

我当前的示例用例：我下载了一个不能按预期工作的脚本（表单验证）。解决问题的最快方法是在JS运行时输入此文件并从那里开始探索它时暂停执行。

Answer 1

如果您可以枚举第三方脚本公开公开的函数（例如，如果它们是对象的所有属性，或者它们的名称是否有模式），您可以创建另一个脚本，动态替换所有这些函数并强制断点：

thirdpartfunc = (function () {
  var oldfunc = thirdpartfunc; 
  return function () {
    debugger;
  oldfunc.call(null, arguments);
}());

适当的绑定（如果适用）。

Answer 2

如果你知道被调用的函数，你可以使用function breakpoints

debug(function);
function(...args);

当你调用该函数时，它将命中断点。这些不会在页面重新加载时保存，但是一旦达到函数断点，就可以设置行断点。

这可能会有点单调乏味。

如果你有一系列功能，你可以做到

[function0, function1].map(debug)

如果有某种babel变换在每个函数的开头插入@Tibos而不是手动插入，那么另一篇文章中的debugger;答案会很好。

Answer 3

对我来说最快捷的方法是在源代码中全局替换函数声明，添加“调试器”;在开始时。换句话说，替换

function [^{]*{

同

$0 debugger;

您的正则表达式可能因您需要的逃脱而异。例如：

function [^{]*\{

您可能还需要多个模式来处理您拥有的所有函数声明。

这与Chrome控制台无关。

Answer 4

不可以。您必须将断点添加到文件包含的各个函数入口点以捕获它可以输入的任何位置。

Answer 5

你不能只在感兴趣的文件中的每个函数的第一行放置一个断点吗？