From c501d9fefe90d356081da0f5ddb9cfe792159152 Mon Sep 17 00:00:00 2001
From: Wankko Ree <wkr@wkr.moe>
Date: Wed, 5 Apr 2023 22:04:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=BB=88=E7=AB=AF?=
 =?UTF-8?q?=E5=9C=A8=E7=BD=91=E7=BB=9C=E7=8E=AF=E5=A2=83=E8=BE=83=E5=B7=AE?=
 =?UTF-8?q?=E6=97=B6=E6=97=A0=E6=B3=95=E6=AD=A3=E5=B8=B8=E5=88=9D=E5=A7=8B?=
 =?UTF-8?q?=E5=8C=96=E5=85=A8=E5=B1=8F=E5=B0=BA=E5=AF=B8=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=20(#505)=20(#507)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/host/terminal/terminal/terminal.vue | 31 ++++++++++---------
 1 file changed, 16 insertions(+), 15 deletions(-)

diff --git a/frontend/src/views/host/terminal/terminal/terminal.vue b/frontend/src/views/host/terminal/terminal/terminal.vue
index 7be8f04cb..4c9d16287 100644
--- a/frontend/src/views/host/terminal/terminal/terminal.vue
+++ b/frontend/src/views/host/terminal/terminal/terminal.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, nextTick, onBeforeUnmount } from 'vue';
+import { ref, nextTick, onBeforeUnmount, watch } from 'vue';
 import { Terminal } from 'xterm';
 import { AttachAddon } from 'xterm-addon-attach';
 import { Base64 } from 'js-base64';
@@ -32,12 +32,23 @@ const acceptParams = (props: WsProps) => {
 };
 
 const fitAddon = new FitAddon();
-const loading = ref(true);
+const webSocketReady = ref(false);
+const termReady = ref(false);
 let terminalSocket = ref(null) as unknown as WebSocket;
 let term = ref(null) as unknown as Terminal;
 
+const readyWatcher = watch(
+    () => webSocketReady.value && termReady.value,
+    (ready) => {
+        if (ready) {
+            changeTerminalSize();
+            readyWatcher(); // unwatch self
+        }
+    },
+);
+
 const runRealTerminal = () => {
-    loading.value = false;
+    webSocketReady.value = true;
 };
 
 const onWSReceive = (message: any) => {
@@ -78,6 +89,7 @@ const initErrorTerm = (errorInfo: string) => {
         term.write(errorInfo);
         term.loadAddon(fitAddon);
         fitAddon.fit();
+        termReady.value = true;
     }
 };
 
@@ -119,18 +131,7 @@ const initTerm = () => {
         });
         term.loadAddon(new AttachAddon(terminalSocket));
         term.loadAddon(fitAddon);
-        setTimeout(() => {
-            fitAddon.fit();
-            if (isWsOpen()) {
-                terminalSocket.send(
-                    JSON.stringify({
-                        type: 'resize',
-                        cols: term.cols,
-                        rows: term.rows,
-                    }),
-                );
-            }
-        }, 30);
+        termReady.value = true;
     }
 };