Google Chrome遵循开发者控制台记录

Question

我在我的javascript中使用console.log批来调试鼠标移动事件。我遇到的问题是，在Chrome控制台中，不会遵循新条目。

在这些屏幕截图中最佳说明：

第一批日志很好，因为它的大小足以在屏幕上看到所有日志：

几秒钟后：

日志已超过需要我滚动的窗口大小。

这使得调试鼠标移动事件非常困难，因为我必须移动到控制台并向下滚动，从而在日志中添加更多条目。

所以我的问题是：如何让chrome基本上拖尾日志而不是停止并要求我滚动。

Answer 1

打开控制台后，将滚动条向下拖动到窗口底部并松开。它应该为你提供输出。

我花了不少尝试让它在Version 27.0.1438.7 dev-m中运行。但是在Version 27.0.1440.0 canary中，它不仅自动发生，每次我尝试时都可以重新附加自动滚动。

您可以从here下载金丝雀。

Answer 2

默认行为是控制台跟踪（尾部）日志。

但是，我们在DevTools中有一个错误，如果你改变了缩放系数（ cmd + + ），它就不会有效。

我们刚刚解决了这个问题：https://codereview.chromium.org/180733003/你需要一段时间的金丝雀（从这篇文章发布之日起），但是它会在大约10年内发展到Stable周。

Answer 3

这里有一个相当有害的错误（只要我记得就存在于Chrome中），如果您记录任何类型的扩展项目，如DOM元素或某些此类事物，它会与日志的显示混淆，并且导致滚动停止跟随。

我通过应用一些聪明才智解决了这个问题，并找到了令人讨厌的日志，你甚至不需要删除日志语句，你只需要让它“友好”。我经常使用任何这样的日志语句，如

console.log((mouse ? "mouse" : "touch") + " start on", jqtarg[0]);

并将其包装在一个数组中：

console.log([(mouse_not_touch ? "mouse" : "touch") + " start on", jqtarg[0]]);

你也可以尝试做其他的事情，试图让日志更具可读性，比如一个对象（没有经过严格的测试，它仍然可能导致烦人的滚动失败） ：

console.log({"mouse/touch start on": jqtarg[0]});

基于非常少量的测试，如果日志在日志缓冲区中显示为可以直接悬停的项目（而不是要求您先手动扩展它），以使检查器突出显示在你的DOM中的项目，然后它可能会触发“滚动锁定综合症”。

BTW，需要注意的是，如果你反复记录完全相同的东西，Chrome会像这样“堆叠”它们:(参见？我通过推送我的登录对象来修复自动滚动！是的！）

如果你没有真的需要根据精确的坐标看到值，那么更粗略地打印更粗略的值会导致更紧凑的日志（这仍然会给你带来明智的反馈） ）。

更新：有时这一切都无效。有时你只是运气不好，你只需要清理你不需要的所有日志，并记录最少量的信息，以防止它超载并导致它无法向下滚动。