Mac ARM版Chrome全屏缩放时可点击组件光标异常求助

核心结论 #

这是Mac ARM版Chrome的已知渲染bug，根源在于全屏缩放场景下的光标渲染坐标精度偏差，与CSS重置、React框架无关。

疑问解答 #

1. 这是Mac ARM版Chrome已知的全屏缩放相关bug吗？
   是的，该问题属于Chrome在Mac ARM架构下的特定渲染bug，官方问题平台已有相关用户反馈，本质是全屏模式缩放时的渲染层坐标计算偏差问题。

2. 为何全屏+缩放会影响光标渲染，窗口化缩放却正常？
   Chrome全屏模式与窗口模式采用不同的渲染管线：全屏模式会启用针对性的GPU加速优化，缩放时的坐标映射精度出现偏差，导致光标样式的渲染区域与元素实际点击区域错位；窗口模式下的渲染逻辑更保守，不会触发该精度问题。

3. 为何仅顶层组件受影响？
   堆叠组件中，顶层元素是光标检测的直接目标，Chrome的bug会导致其光标样式的渲染区域被错误裁剪或偏移；下层元素因被顶层遮挡，光标无法直接触发其检测逻辑，因此不会显现问题。

4. 是否与CSS重置有关？
   无关。你已验证移除CSS重置后问题仍存在，且bug根源是浏览器渲染逻辑，与样式重置规则无关联。

5. 有无办法在全屏缩放的Chrome中强制光标正常显示？
   提供几个可行的临时解决方案：

• 父容器继承光标样式：给顶层组件的父容器设置cursor: pointer，同时确保顶层组件的pointer-events: auto（不影响原有点击逻辑）；
• 透明伪元素覆盖：给顶层组件添加伪元素，强制覆盖整个区域的光标样式：

  .sidebarButton::before {
    content: '';
    position: absolute;
    inset: 0;
    cursor: pointer;
    pointer-events: none; /* 不干扰点击事件 */
  }
  

• 临时禁用硬件加速：在Chrome设置→系统中关闭「使用硬件加速模式（如果可用）」，但会影响浏览器整体性能，仅作应急方案；
• 等待官方修复：该bug属于特定架构下的渲染精度问题，Chrome后续版本大概率会推送修复补丁。

内容的提问来源于stack exchange，提问作者Nazar Duma