Fix <textarea> overlay

service.js

@@ -2402,21 +2402,32 @@ class BesTAService extends BesPlainTextService {
     const scrollLeft = window.scrollX || document.documentElement.scrollLeft
     const styles = window.getComputedStyle(hostElement)
 
-    textElement.style.zIndex = hostElement.style.zIndex - 1
+    textElement.style.display = styles.display
     textElement.style.font = styles.font
     textElement.style.lineHeight = styles.lineHeight
     textElement.style.whiteSpace = styles.whiteSpace
     textElement.style.whiteSpaceCollapse = styles.whiteSpaceCollapse
     textElement.style.hyphens = styles.hyphens
-    textElement.style.boxSizing = styles.boxSizing
     textElement.style.scrollBehavior = styles.scrollBehavior
+    textElement.style.overflow = styles.overflow
     textElement.style.border = styles.border
     textElement.style.borderRadius = styles.borderRadius
+    textElement.style.borderColor = 'transparent'
     textElement.style.padding = styles.padding
     textElement.style.left = `${rect.left + scrollLeft}px`
     textElement.style.top = `${rect.top + scrollTop}px`
-    textElement.style.width = styles.width
-    textElement.style.height = styles.height
+    textElement.style.width = `${
+      rect.width -
+      parseFloat(styles.borderLeftWidth) -
+      parseFloat(styles.paddingLeft) -
+      parseFloat(styles.paddingRight) -
+      parseFloat(styles.borderRightWidth)
+    }px`
+    textElement.style.height = `${rect.height -
+      parseFloat(styles.borderTopWidth) -
+      parseFloat(styles.paddingTop) -
+      parseFloat(styles.paddingBottom) -
+      parseFloat(styles.borderBottomWidth)}px`
   }
 
   /**

styles.css

@@ -50,9 +50,9 @@
 
 .bes-text-panel {
   position: absolute;
-  overflow: hidden;
   margin: 0px;
   color: transparent;
   border-color: transparent;
   background: none;
+  z-index: -1;
 }