search

hcfyapp / crx-selection-translate

一站式划词 / 截图 / 网页全文 / 音视频 AI 翻译扩展。
https://hcfy.ai
4.08k stars 540 forks source link

特定情况下划词翻译会导致页面出现垂直滚动条 #2033

Closed lmk123 closed 4 months ago

lmk123 commented 5 months ago

基本信息

划词翻译版本：v10.10.0 浏览器版本：chrome 126 操作系统：macos

重现问题的步骤

  1. 打开此地址
  2. 在最下方的评论框中输入超长文本（例如将此帖内容粘贴 100 次）
  3. 划选评论框中的任意文本

预期行为

页面正常

实际行为

页面底部出现很大一块空白

补充信息

来源：https://github.com/hcfyapp/crx-selection-translate/issues/1372#issuecomment-2180196309

另外，评论里提到的将输入框隐藏后的情况还未测试

imReker commented 5 months ago

补充一个更简单的复现方法 1.创建一个只有textarea的网页，文本框高度200像素 2.疯狂输入，确保文字宽度和长度都超出了屏幕范围。 3.回到文本框最顶端，选中文字 image

imReker commented 5 months ago

输入框隐藏的案例是我的理解错误，实际测试了一下，是对monaco编辑器不兼容。 测试网址：https://microsoft.github.io/monaco-editor/playground.html 任何情况下，划词翻译生成的DIV宽度都是1PX 另外观察到console有一堆划词翻译的error

image

imReker commented 5 months ago

其实里面隐藏了一个问题，就是禁用划词功能，但实际划词还是会产生这个不可见的DIV。想要临时绕过去都不行。因为只有个别网站有用到长文本功能，可以通过禁用划词来绕过去

lmk123 commented 5 months ago

禁用划词功能，但实际划词还是会产生这个不可见的DIV

是的。我已经计划在未来的版本中对功能做懒加载处理，即只在真的需要用到划词 / 网页全文 / 截图等功能时才生成相关的 DIV 节点，不过这大概会是很久之后了，至少得等我完成 mv3 改造、一些比较重要的新功能更新之后了