diff --git a/src/components/bottomPanel/tabs/terminal/LogsTerminal.vue b/src/components/bottomPanel/tabs/terminal/LogsTerminal.vue index 65e84da316..98cdb450e5 100644 --- a/src/components/bottomPanel/tabs/terminal/LogsTerminal.vue +++ b/src/components/bottomPanel/tabs/terminal/LogsTerminal.vue @@ -19,7 +19,7 @@ import type { Ref } from 'vue' import { onMounted, onUnmounted, ref } from 'vue' import type { useTerminal } from '@/composables/bottomPanelTabs/useTerminal' -import type { LogEntry, LogsWsMessage, TerminalSize } from '@/schemas/apiSchema' +import type { LogEntry, LogsWsMessage } from '@/schemas/apiSchema' import { api } from '@/scripts/api' import { useExecutionStore } from '@/stores/executionStore' @@ -32,27 +32,22 @@ const terminalCreated = ( { terminal, useAutoSize }: ReturnType, root: Ref ) => { - // `autoCols` is false because we don't want the progress bar in the terminal - // to render incorrectly as the progress bar is rendered based on the - // server's terminal size. - // Apply a min cols of 80 for colab environments + // Auto-size terminal to fill container width. + // minCols: 80 ensures minimum width for colab environments. // See https://github.com/comfyanonymous/ComfyUI/issues/6396 - useAutoSize({ root, autoRows: true, autoCols: false, minCols: 80 }) + useAutoSize({ root, autoRows: true, autoCols: true, minCols: 80 }) - const update = (entries: Array, size?: TerminalSize) => { - if (size) { - terminal.resize(size.cols, terminal.rows) - } + const update = (entries: Array) => { terminal.write(entries.map((e) => e.m).join('')) } const logReceived = (e: CustomEvent) => { - update(e.detail.entries, e.detail.size) + update(e.detail.entries) } const loadLogEntries = async () => { const logs = await api.getRawLogs() - update(logs.entries, logs.size) + update(logs.entries) } const watchLogs = async () => {