事件源头
我在 Next.js 项目中发现了一个 bug : 当手机浏览网页时, 会出现一个错误的水平移动.
快速定位bug
我使用下面的代码片段来快速定位导致水平滚动的元素. 该代码片段的作用是: 记录所有比文档( document )宽度更宽的元素, 而这些元素通常就是导致水平滚动的元素.
debug小技巧
如果你是使用 Chromium 内核浏览器(比如 Chrome, Brave, Edge, etc.), 你就可以通过右键在 console 中出现的元素, 并选择" Scroll into view "来快速跳转到对应的元素.