Fix status flicker during WebSocket reconnect loop

connect() was unconditionally calling setStatus('connecting', ...) at the
top of each attempt, causing a visible flicker over "Disconnected —
retrying..." every 3 seconds during the retry loop.

Fix: add everConnected flag (was missing from Neutralino version);
connect() only shows "Connecting..." on the first attempt. onclose now
uses everConnected instead of _hadError to determine state. onerror no
longer sets its own status — onclose is the sole status updater on
disconnect, eliminating a second flicker source. everConnected is reset
on Save so pointing at a new server shows "Connecting..." cleanly.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
nonna
2026-03-12 01:19:51 +00:00
parent 92d79a7d45
commit add0f803cd

View File

@@ -11,6 +11,7 @@ const STORAGE_KEY = 'kokoro-config';
// ---------------------------------------------------------------------------
let config = { ...CONFIG_DEFAULTS };
let ws = null;
let everConnected = false; // true after first successful onopen
let reconnectTimer = null;
const audioQueue = [];
const AUDIO_QUEUE_MAX = 25;
@@ -138,13 +139,19 @@ function connect() {
}
clearReconnectTimer();
setStatus('connecting', 'Connecting...');
// Only show "Connecting..." on the very first attempt.
// Once we've ever connected, preserve "Disconnected — retrying..." until
// onopen fires so there's no flicker during the reconnect loop.
if (!everConnected) {
setStatus('connecting', 'Connecting...');
}
try {
ws = new WebSocket(getWsUrl());
ws.binaryType = 'arraybuffer';
ws.onopen = () => {
everConnected = true;
setStatus('connected', 'Connected — waiting for audio');
};
@@ -171,16 +178,17 @@ function connect() {
};
ws.onclose = () => {
const hadError = ws && ws._hadError;
ws = null;
setStatus(hadError ? 'error' : 'connecting',
hadError ? 'Disconnected — retrying...' : 'Reconnecting...');
if (everConnected) {
setStatus('error', 'Disconnected — retrying...');
} else {
setStatus('connecting', 'Connecting...');
}
scheduleReconnect();
};
ws.onerror = () => {
if (ws) ws._hadError = true;
setStatus('error', 'Connection error');
};
} catch (e) {
console.error('WebSocket connection failed:', e);
@@ -312,6 +320,8 @@ async function init() {
saveBtn.classList.remove('saved');
}, 1500);
// Treat as fresh connection to the new server
everConnected = false;
connect();
});