From b60dff807db346073bc4983d6e1e9c95cdbeda82 Mon Sep 17 00:00:00 2001
From: oleg <me@olegivaniv.com>
Date: Tue, 15 Apr 2025 09:46:05 +0200
Subject: [PATCH] refactor(editor): Refactor height adjustment method to use
 ref (no-changelog) (#14630)

---
 .../frontend/@n8n/chat/src/components/Input.vue   | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/@n8n/chat/src/components/Input.vue b/packages/frontend/@n8n/chat/src/components/Input.vue
index 428787950cf..7f6bcc9f679 100644
--- a/packages/frontend/@n8n/chat/src/components/Input.vue
+++ b/packages/frontend/@n8n/chat/src/components/Input.vue
@@ -89,7 +89,7 @@ onMounted(() => {
 		resizeObserver.value = new ResizeObserver((entries) => {
 			for (const entry of entries) {
 				if (entry.target === chatTextArea.value) {
-					adjustHeight({ target: chatTextArea.value } as unknown as Event);
+					adjustTextAreaHeight();
 				}
 			}
 		});
@@ -149,7 +149,7 @@ async function onSubmitKeydown(event: KeyboardEvent) {
 	}
 
 	await onSubmit(event);
-	adjustHeight({ target: chatTextArea.value } as unknown as Event);
+	adjustTextAreaHeight();
 }
 
 function onFileRemove(file: File) {
@@ -181,8 +181,9 @@ function onOpenFileDialog() {
 	openFileDialog({ accept: unref(allowedFileTypes) });
 }
 
-function adjustHeight(event: Event) {
-	const textarea = event.target as HTMLTextAreaElement;
+function adjustTextAreaHeight() {
+	const textarea = chatTextArea.value;
+	if (!textarea) return;
 	// Set to content minimum to get the right scrollHeight
 	textarea.style.height = 'var(--chat--textarea--height)';
 	// Get the new height, with a small buffer for padding
@@ -204,9 +205,9 @@ function adjustHeight(event: Event) {
 				:disabled="isInputDisabled"
 				:placeholder="t(props.placeholder)"
 				@keydown.enter="onSubmitKeydown"
-				@input="adjustHeight"
-				@mousedown="adjustHeight"
-				@focus="adjustHeight"
+				@input="adjustTextAreaHeight"
+				@mousedown="adjustTextAreaHeight"
+				@focus="adjustTextAreaHeight"
 			/>
 
 			<div class="chat-inputs-controls">