LeetCode 代码编辑器选中代码后渲染有问题

[Monk-MT]

在 LeetCode 编辑代码时，若没有选中代码，能正常渲染。但如果选中了代码，就会导致渲染出现问题。两种情况渲染出的样式不一样。

你使用的浏览器（名称&版本）：chrome 130.0.6723.117（正式版本） （64 位）
脚本管理器（名称&版本）：篡改猴 (Tampermonkey) 5.3.2
脚本版本：2024.11.02.1

问题网址：https://leetcode.cn/problems/path-sum-iii/?envType=study-plan-v2&envId=top-100-liked
错误图片：

脚本设置备份：
FontRendering-backup-chrome-2024-11-12T20-45-55Z.zip

[F9y4ng]

问题应该出在monaco editor的行内样式和选中样式上，而且你的选中样式并不是脚本渲染的，而是编辑器的样式。

脚本的自定义等宽字体选中渲染效果如下：

老生常谈，在大部分编辑类站点中使用字体渲染由于字宽、字高、字体缩放造成的坐标偏移等情况，会造成各种各样的问题。有些可以修复，有些不能。所以，在此类站点中建议排除渲染。

[F9y4ng]

更具体点说应该是问题出在‌这个零宽字符上，不同的等宽字体对该零宽字符的处理结果不同，就会造成选取时包含该零宽字符的部分出现宽度不同，从而造成视觉上的改变。根本上来说，就是由于自定义等宽字体造成对‌（零宽非连接符）的处理异常。所以和以上结果一致，只有排除渲染才能从根本上解决问题。

另外，monaco editor的选取处理与代码字符显示是分离处理的，如果在开启了字体比例缩放，那么各种原因综合在一起，造成了选取样式错误、对零宽非连接符处理、代码选取坐标偏移等等异常问题。