fix: correctly resize textarea

frontend-park-mail-ru · Dec 17, 2024 · 4897b8c · 4897b8c
1 parent 7dd2ad3
commit 4897b8c
Showing 1 changed file with 16 additions and 9 deletions.
diff --git a/src/components/ChatWindow/ChatWindow.ts b/src/components/ChatWindow/ChatWindow.ts
@@ -90,28 +90,35 @@ export default class ChatWindow extends BaseComponent {
         const textArea = this.thisElement.querySelector(
             '.js-message-input'
         ) as HTMLInputElement;
-        textArea.oninput = () => {
-            setTimeout(function () {
-                textArea.style.cssText =
-                    'height:' + textArea.scrollHeight + 'px';
-            }, 0);
+
+        const resizeTextArea = () => {
+            textArea.style.cssText = 'height: auto';
+            textArea.style.cssText = 'height:' + textArea.scrollHeight + 'px';
         };
 
+        textArea.oninput = resizeTextArea;
+
         const sendMessageButton = document.getElementById(
             'js-send-message-button'
         ) as HTMLButtonElement;
 
-        sendMessageButton.onclick = () => {
+        /** Sends message and clears input */
+        const sendMessage = (e: Event) => {
+            // Prevent from new line
+            e.preventDefault();
+            e.stopPropagation();
+
             const text = textArea.value;
             this.sendMessage(text);
             textArea.value = '';
+            resizeTextArea();
         };
 
+        sendMessageButton.onclick = sendMessage;
+
         textArea.onkeydown = (event) => {
             if (!event.shiftKey && !event.ctrlKey && event.key === 'Enter') {
-                const text = textArea.value;
-                this.sendMessage(text);
-                textArea.value = '';
+                sendMessage(event);
             }
         };
     }