揭秘 Chromium v84 中隐藏的破坏性 Bug：自行滚动之谜

自行滚动的潘多拉魔盒

最近，Chromium v84 被发现存在一个令人头疼的 bug，会导致网页在加载过程中出现自行滚动。起初，这个问题似乎只是偶尔出现，影响范围有限。然而，随着越来越多的用户报告，它逐渐演变成了一个严重破坏用户体验的普遍问题。

症结所在：浏览器深处的隐患

一开始，我们认为这个问题源于我们自己的代码逻辑存在漏洞。然而，在多个浏览器上进行测试后，我们发现问题似乎根植于浏览器本身，特别是 Chromium v84。

在更深入的调查中，我们发现这个 bug 是由浏览器在处理网页加载过程中的一个细微问题造成的。当新内容加载到页面时，浏览器有时会自动触发滚动事件，从而导致页面意外滚动。

用户体验的滑铁卢

自行滚动问题对用户体验的影响不容小觑。它会打断用户的阅读流程，让他们很难找到他们正在查看的内容。对于依赖精确滚动的任务，如表单填写或图像编辑，它更是致命的。

解决之匙：针对不同场景的策略

解决 Chromium v84 自行滚动 bug 的方法取决于浏览器和用例。以下是一些常见的解决方法：

对于桌面浏览器：

• 更新到 Chromium v84 的最新版本（84.0.4147.125）。
• 使用 CSS 媒体查询禁用触控事件。
• 使用 JavaScript 监听滚动事件并将其重置到页面顶部。

对于移动浏览器：

• 禁用浏览器的滚动特性（例如， overflow-scrolling: touch）。
• 使用 JavaScript 设置页面高度，以防止内容溢出。
• 避免使用会触发滚动事件的元素，例如自动播放视频。

技术指南：代码示例

对于需要更深入控制的开发者，这里提供了一些代码示例：

CSS 禁用触控事件：

@media (hover: hover) {
  body {
    -ms-touch-action: none;
    touch-action: none;
  }
}

JavaScript 重置滚动事件：

window.addEventListener('scroll', () => {
  if (window.scrollY > 0) {
    window.scrollTo(0, 0);
  }
});

结论：从根源上消除自行滚动

Chromium v84 中的自行滚动 bug 是一种令人沮丧的问题，它会严重影响用户体验。通过理解问题的根源并采用适当的解决方法，开发者可以有效地解决这个问题，为用户提供顺畅无缝的浏览体验。