瀏覽代碼

fix: jumping of text when typing single line in bound text (#5139)

* fix: jumping of text when typing single line in bound text

* add comment
Aakansha Doshi 3 年之前
父節點
當前提交
b30066ca19
共有 1 個文件被更改,包括 8 次插入2 次删除
  1. 8 2
      src/element/textWysiwyg.tsx

+ 8 - 2
src/element/textWysiwyg.tsx

@@ -283,7 +283,14 @@ export const textWysiwyg = ({
       // using scrollHeight here since we need to calculate
       // number of lines so cannot use editable.style.height
       // as that gets updated below
-      const lines = editable.scrollHeight / getApproxLineHeight(font);
+      // Rounding here so that the lines calculated is more accurate in all browsers.
+      // The scrollHeight and approxLineHeight differs in diff browsers
+      // eg it gives 1.05 in firefox for handewritten small font due to which
+      // height gets updated as lines > 1 and leads to jumping text for first line in bound container
+      // hence rounding here to avoid that
+      const lines = Math.round(
+        editable.scrollHeight / getApproxLineHeight(font),
+      );
       // auto increase height only when lines  > 1 so its
       // measured correctly and vertically aligns for
       // first line as well as setting height to "auto"
@@ -298,7 +305,6 @@ export const textWysiwyg = ({
             font,
             container!.width,
           ).split("\n").length;
-
           // This is browser behaviour when setting height to "auto"
           // It sets the height needed for 2 lines even if actual
           // line count is 1 as mentioned above as well