@noverachat/sdk-web 0.5.0 → 0.5.2

package/dist/index.cjs

@@ -403,14 +403,26 @@ var ReconnectingWs = class _ReconnectingWs {
   // heartbeats and a stale typing event is worse than no event.
   outboundQueue = [];
   static OUTBOUND_QUEUE_CAP = 200;
+  /**
+   * 연결 시도의 세대 번호 — `connect()`/`close()` 마다 올린다.
+   *
+   * `openOnce()` 는 `urlBuilder()`(토큰 발급 왕복)를 await 하는 동안 아직
+   * 소켓이 없어서, 그 틈에 들어온 `close()` 는 닫을 대상을 찾지 못한다.
+   * 이어서 새 `connect()` 가 `explicitClose` 를 되돌리면, 뒤늦게 깨어난
+   * 앞선 시도가 **아무도 닫지 않는 소켓**을 하나 더 만든다(React StrictMode 의
+   * mount → cleanup → mount 에서 재현). 불리언 하나로는 "이미 취소됐다"를
+   * 알릴 수 없으므로 세대 번호로 판별한다.
+   */
+  gen = 0;
   get currentState() {
     return this.state;
   }
   async connect() {
     this.explicitClose = false;
-    await this.openOnce();
+    await this.openOnce(++this.gen);
   }
   close() {
+    this.gen++;
     this.explicitClose = true;
     this.setState("closed");
     if (this.pingTimer) clearInterval(this.pingTimer);
@@ -443,7 +455,8 @@ var ReconnectingWs = class _ReconnectingWs {
     );
     return true;
   }
-  async openOnce() {
+  async openOnce(gen) {
+    if (gen !== this.gen) return;
     this.setState(this.attempt === 0 ? "connecting" : "reconnecting");
     const WSImpl = this.opts.WebSocketImpl ?? globalThis.WebSocket;
     if (!WSImpl) throw new Error("No WebSocket implementation available");
@@ -452,7 +465,11 @@ var ReconnectingWs = class _ReconnectingWs {
       url = await this.opts.urlBuilder();
     } catch (err) {
       this.opts.logger?.("error", "url_builder_failed", err);
-      this.scheduleReconnect();
+      if (gen === this.gen) this.scheduleReconnect();
+      return;
+    }
+    if (gen !== this.gen) {
+      this.opts.logger?.("info", "ws_open_aborted_stale", { gen, current: this.gen });
       return;
     }
     const ws = new WSImpl(url);
@@ -517,8 +534,9 @@ var ReconnectingWs = class _ReconnectingWs {
     const delay = exp + jitter;
     this.opts.logger?.("info", "ws_reconnect_scheduled", { attempt: this.attempt, delay });
     this.setState("reconnecting");
+    const gen = this.gen;
     setTimeout(() => {
-      void this.openOnce();
+      void this.openOnce(gen);
     }, delay);
   }
   startPings() {
@@ -826,7 +844,15 @@ var MessageCollection = class {
       this._messages.splice(0, this.hydratedCount);
       this.hydratedCount = 0;
     }
-    this._messages.unshift(...page.items.map(chatMessageFromHistory));
+    const indexById = /* @__PURE__ */ new Map();
+    this._messages.forEach((m, i) => indexById.set(m.id, i));
+    const fresh = [];
+    for (const item of page.items.map(chatMessageFromHistory)) {
+      const at = indexById.get(item.id);
+      if (at === void 0) fresh.push(item);
+      else this._messages[at] = item;
+    }
+    this._messages.unshift(...fresh);
     this.oldestCursor = page.nextCursor;
     this._hasMore = page.hasMore;
     this.emit("replaced");
@@ -997,8 +1023,26 @@ var MessageCollection = class {
     this.bus.removeAll();
   }
   // ── event handlers ──────────────────────────────────────────────
+  /**
+   * 수신 프레임을 컬렉션에 넣는다.
+   *
+   * 두 가지를 방어한다 — backfill(`chat.backfill()`)은 재연결 시 앵커
+   * 이후를 **다시** 실어오므로, 이미 들고 있는 메시지가 섞여 오고 화면보다
+   * 오래된 메시지도 함께 온다:
+   * - **중복**: 같은 id가 이미 있으면 무시한다.
+   * - **순서**: 뒤에서부터 자리를 찾아 꽂는다. 실시간 프레임은 항상 마지막
+   *   메시지보다 새로우므로 비교 1번으로 끝나고(빠른 경로), 옛 메시지가
+   *   섞여 올 때만 탐색이 일어난다.
+   */
   onIncoming(f) {
-    this._messages.push(chatMessageFromLive(f));
+    const msg = chatMessageFromLive(f);
+    let i = this._messages.length - 1;
+    for (; i >= 0; i--) {
+      const cur = this._messages[i];
+      if (cur.id === msg.id) return;
+      if (!idGreater(cur.id, msg.id)) break;
+    }
+    this._messages.splice(i + 1, 0, msg);
     this.emit("inserted");
   }
   onUpdated(f) {
@@ -2163,6 +2207,16 @@ var NoveraChat = class {
   readDebounceMs;
   logger;
   connectedOnce = false;
+  /**
+   * 방별 "실시간 파이프라인으로 본 최대 message_id" — 재연결 핸드셰이크의
+   * `?since=`와 backfill 시작점.
+   *
+   * **의도적으로 낮게 유지한다.** 히스토리 로드(REST)는 이 값을 올리지
+   * 않는다 — 앵커가 낮으면 backfill이 이미 가진 것까지 다시 주는 쪽으로
+   * (안전), 높으면 못 받은 것을 영영 건너뛰는 쪽으로(치명) 실패하기
+   * 때문이다. 중복은 수신 측(`MessageCollection.onIncoming`)의 id dedupe가
+   * 흡수하므로, "빠뜨린 갱신"으로 보고 올리지 말 것.
+   */
   lastMessageIdByRoom = /* @__PURE__ */ new Map();
   /** Most recently dispatched presence event key, `${userId}:${at}:${online}`.
    *  Used to drop the N-1 shared-room copies of a single online/offline

package/dist/index.d.cts

@@ -666,6 +666,17 @@ declare class ReconnectingWs {
     private explicitClose;
     private outboundQueue;
     private static readonly OUTBOUND_QUEUE_CAP;
+    /**
+     * 연결 시도의 세대 번호 — `connect()`/`close()` 마다 올린다.
+     *
+     * `openOnce()` 는 `urlBuilder()`(토큰 발급 왕복)를 await 하는 동안 아직
+     * 소켓이 없어서, 그 틈에 들어온 `close()` 는 닫을 대상을 찾지 못한다.
+     * 이어서 새 `connect()` 가 `explicitClose` 를 되돌리면, 뒤늦게 깨어난
+     * 앞선 시도가 **아무도 닫지 않는 소켓**을 하나 더 만든다(React StrictMode 의
+     * mount → cleanup → mount 에서 재현). 불리언 하나로는 "이미 취소됐다"를
+     * 알릴 수 없으므로 세대 번호로 판별한다.
+     */
+    private gen;
     constructor(opts: ReconnectingWsOptions);
     get currentState(): WsState;
     connect(): Promise<void>;
@@ -912,6 +923,17 @@ declare class MessageCollection {
     /** Unsubscribe from the room and flush the pending read watermark. The
      *  collection must not be used afterwards. */
     dispose(): void;
+    /**
+     * 수신 프레임을 컬렉션에 넣는다.
+     *
+     * 두 가지를 방어한다 — backfill(`chat.backfill()`)은 재연결 시 앵커
+     * 이후를 **다시** 실어오므로, 이미 들고 있는 메시지가 섞여 오고 화면보다
+     * 오래된 메시지도 함께 온다:
+     * - **중복**: 같은 id가 이미 있으면 무시한다.
+     * - **순서**: 뒤에서부터 자리를 찾아 꽂는다. 실시간 프레임은 항상 마지막
+     *   메시지보다 새로우므로 비교 1번으로 끝나고(빠른 경로), 옛 메시지가
+     *   섞여 올 때만 탐색이 일어난다.
+     */
     private onIncoming;
     private onUpdated;
     private onDeleted;
@@ -1386,6 +1408,16 @@ declare class NoveraChat {
     private readDebounceMs;
     private logger;
     private connectedOnce;
+    /**
+     * 방별 "실시간 파이프라인으로 본 최대 message_id" — 재연결 핸드셰이크의
+     * `?since=`와 backfill 시작점.
+     *
+     * **의도적으로 낮게 유지한다.** 히스토리 로드(REST)는 이 값을 올리지
+     * 않는다 — 앵커가 낮으면 backfill이 이미 가진 것까지 다시 주는 쪽으로
+     * (안전), 높으면 못 받은 것을 영영 건너뛰는 쪽으로(치명) 실패하기
+     * 때문이다. 중복은 수신 측(`MessageCollection.onIncoming`)의 id dedupe가
+     * 흡수하므로, "빠뜨린 갱신"으로 보고 올리지 말 것.
+     */
     private lastMessageIdByRoom;
     /** Most recently dispatched presence event key, `${userId}:${at}:${online}`.
      *  Used to drop the N-1 shared-room copies of a single online/offline

package/dist/index.d.ts

@@ -666,6 +666,17 @@ declare class ReconnectingWs {
     private explicitClose;
     private outboundQueue;
     private static readonly OUTBOUND_QUEUE_CAP;
+    /**
+     * 연결 시도의 세대 번호 — `connect()`/`close()` 마다 올린다.
+     *
+     * `openOnce()` 는 `urlBuilder()`(토큰 발급 왕복)를 await 하는 동안 아직
+     * 소켓이 없어서, 그 틈에 들어온 `close()` 는 닫을 대상을 찾지 못한다.
+     * 이어서 새 `connect()` 가 `explicitClose` 를 되돌리면, 뒤늦게 깨어난
+     * 앞선 시도가 **아무도 닫지 않는 소켓**을 하나 더 만든다(React StrictMode 의
+     * mount → cleanup → mount 에서 재현). 불리언 하나로는 "이미 취소됐다"를
+     * 알릴 수 없으므로 세대 번호로 판별한다.
+     */
+    private gen;
     constructor(opts: ReconnectingWsOptions);
     get currentState(): WsState;
     connect(): Promise<void>;
@@ -912,6 +923,17 @@ declare class MessageCollection {
     /** Unsubscribe from the room and flush the pending read watermark. The
      *  collection must not be used afterwards. */
     dispose(): void;
+    /**
+     * 수신 프레임을 컬렉션에 넣는다.
+     *
+     * 두 가지를 방어한다 — backfill(`chat.backfill()`)은 재연결 시 앵커
+     * 이후를 **다시** 실어오므로, 이미 들고 있는 메시지가 섞여 오고 화면보다
+     * 오래된 메시지도 함께 온다:
+     * - **중복**: 같은 id가 이미 있으면 무시한다.
+     * - **순서**: 뒤에서부터 자리를 찾아 꽂는다. 실시간 프레임은 항상 마지막
+     *   메시지보다 새로우므로 비교 1번으로 끝나고(빠른 경로), 옛 메시지가
+     *   섞여 올 때만 탐색이 일어난다.
+     */
     private onIncoming;
     private onUpdated;
     private onDeleted;
@@ -1386,6 +1408,16 @@ declare class NoveraChat {
     private readDebounceMs;
     private logger;
     private connectedOnce;
+    /**
+     * 방별 "실시간 파이프라인으로 본 최대 message_id" — 재연결 핸드셰이크의
+     * `?since=`와 backfill 시작점.
+     *
+     * **의도적으로 낮게 유지한다.** 히스토리 로드(REST)는 이 값을 올리지
+     * 않는다 — 앵커가 낮으면 backfill이 이미 가진 것까지 다시 주는 쪽으로
+     * (안전), 높으면 못 받은 것을 영영 건너뛰는 쪽으로(치명) 실패하기
+     * 때문이다. 중복은 수신 측(`MessageCollection.onIncoming`)의 id dedupe가
+     * 흡수하므로, "빠뜨린 갱신"으로 보고 올리지 말 것.
+     */
     private lastMessageIdByRoom;
     /** Most recently dispatched presence event key, `${userId}:${at}:${online}`.
      *  Used to drop the N-1 shared-room copies of a single online/offline

package/dist/index.js

@@ -368,14 +368,26 @@ var ReconnectingWs = class _ReconnectingWs {
   // heartbeats and a stale typing event is worse than no event.
   outboundQueue = [];
   static OUTBOUND_QUEUE_CAP = 200;
+  /**
+   * 연결 시도의 세대 번호 — `connect()`/`close()` 마다 올린다.
+   *
+   * `openOnce()` 는 `urlBuilder()`(토큰 발급 왕복)를 await 하는 동안 아직
+   * 소켓이 없어서, 그 틈에 들어온 `close()` 는 닫을 대상을 찾지 못한다.
+   * 이어서 새 `connect()` 가 `explicitClose` 를 되돌리면, 뒤늦게 깨어난
+   * 앞선 시도가 **아무도 닫지 않는 소켓**을 하나 더 만든다(React StrictMode 의
+   * mount → cleanup → mount 에서 재현). 불리언 하나로는 "이미 취소됐다"를
+   * 알릴 수 없으므로 세대 번호로 판별한다.
+   */
+  gen = 0;
   get currentState() {
     return this.state;
   }
   async connect() {
     this.explicitClose = false;
-    await this.openOnce();
+    await this.openOnce(++this.gen);
   }
   close() {
+    this.gen++;
     this.explicitClose = true;
     this.setState("closed");
     if (this.pingTimer) clearInterval(this.pingTimer);
@@ -408,7 +420,8 @@ var ReconnectingWs = class _ReconnectingWs {
     );
     return true;
   }
-  async openOnce() {
+  async openOnce(gen) {
+    if (gen !== this.gen) return;
     this.setState(this.attempt === 0 ? "connecting" : "reconnecting");
     const WSImpl = this.opts.WebSocketImpl ?? globalThis.WebSocket;
     if (!WSImpl) throw new Error("No WebSocket implementation available");
@@ -417,7 +430,11 @@ var ReconnectingWs = class _ReconnectingWs {
       url = await this.opts.urlBuilder();
     } catch (err) {
       this.opts.logger?.("error", "url_builder_failed", err);
-      this.scheduleReconnect();
+      if (gen === this.gen) this.scheduleReconnect();
+      return;
+    }
+    if (gen !== this.gen) {
+      this.opts.logger?.("info", "ws_open_aborted_stale", { gen, current: this.gen });
       return;
     }
     const ws = new WSImpl(url);
@@ -482,8 +499,9 @@ var ReconnectingWs = class _ReconnectingWs {
     const delay = exp + jitter;
     this.opts.logger?.("info", "ws_reconnect_scheduled", { attempt: this.attempt, delay });
     this.setState("reconnecting");
+    const gen = this.gen;
     setTimeout(() => {
-      void this.openOnce();
+      void this.openOnce(gen);
     }, delay);
   }
   startPings() {
@@ -791,7 +809,15 @@ var MessageCollection = class {
       this._messages.splice(0, this.hydratedCount);
       this.hydratedCount = 0;
     }
-    this._messages.unshift(...page.items.map(chatMessageFromHistory));
+    const indexById = /* @__PURE__ */ new Map();
+    this._messages.forEach((m, i) => indexById.set(m.id, i));
+    const fresh = [];
+    for (const item of page.items.map(chatMessageFromHistory)) {
+      const at = indexById.get(item.id);
+      if (at === void 0) fresh.push(item);
+      else this._messages[at] = item;
+    }
+    this._messages.unshift(...fresh);
     this.oldestCursor = page.nextCursor;
     this._hasMore = page.hasMore;
     this.emit("replaced");
@@ -962,8 +988,26 @@ var MessageCollection = class {
     this.bus.removeAll();
   }
   // ── event handlers ──────────────────────────────────────────────
+  /**
+   * 수신 프레임을 컬렉션에 넣는다.
+   *
+   * 두 가지를 방어한다 — backfill(`chat.backfill()`)은 재연결 시 앵커
+   * 이후를 **다시** 실어오므로, 이미 들고 있는 메시지가 섞여 오고 화면보다
+   * 오래된 메시지도 함께 온다:
+   * - **중복**: 같은 id가 이미 있으면 무시한다.
+   * - **순서**: 뒤에서부터 자리를 찾아 꽂는다. 실시간 프레임은 항상 마지막
+   *   메시지보다 새로우므로 비교 1번으로 끝나고(빠른 경로), 옛 메시지가
+   *   섞여 올 때만 탐색이 일어난다.
+   */
   onIncoming(f) {
-    this._messages.push(chatMessageFromLive(f));
+    const msg = chatMessageFromLive(f);
+    let i = this._messages.length - 1;
+    for (; i >= 0; i--) {
+      const cur = this._messages[i];
+      if (cur.id === msg.id) return;
+      if (!idGreater(cur.id, msg.id)) break;
+    }
+    this._messages.splice(i + 1, 0, msg);
     this.emit("inserted");
   }
   onUpdated(f) {
@@ -2128,6 +2172,16 @@ var NoveraChat = class {
   readDebounceMs;
   logger;
   connectedOnce = false;
+  /**
+   * 방별 "실시간 파이프라인으로 본 최대 message_id" — 재연결 핸드셰이크의
+   * `?since=`와 backfill 시작점.
+   *
+   * **의도적으로 낮게 유지한다.** 히스토리 로드(REST)는 이 값을 올리지
+   * 않는다 — 앵커가 낮으면 backfill이 이미 가진 것까지 다시 주는 쪽으로
+   * (안전), 높으면 못 받은 것을 영영 건너뛰는 쪽으로(치명) 실패하기
+   * 때문이다. 중복은 수신 측(`MessageCollection.onIncoming`)의 id dedupe가
+   * 흡수하므로, "빠뜨린 갱신"으로 보고 올리지 말 것.
+   */
   lastMessageIdByRoom = /* @__PURE__ */ new Map();
   /** Most recently dispatched presence event key, `${userId}:${at}:${online}`.
    *  Used to drop the N-1 shared-room copies of a single online/offline

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@noverachat/sdk-web",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "NoveraChat browser/Node SDK — WebSocket + REST client with optimistic UI, reconnection and gap-fill",
   "license": "MIT",
   "type": "module",

package/src/client.ts

@@ -57,6 +57,16 @@ export class NoveraChat {
   private readDebounceMs: number;
   private logger: ClientOptions["logger"];
   private connectedOnce = false;
+  /**
+   * 방별 "실시간 파이프라인으로 본 최대 message_id" — 재연결 핸드셰이크의
+   * `?since=`와 backfill 시작점.
+   *
+   * **의도적으로 낮게 유지한다.** 히스토리 로드(REST)는 이 값을 올리지
+   * 않는다 — 앵커가 낮으면 backfill이 이미 가진 것까지 다시 주는 쪽으로
+   * (안전), 높으면 못 받은 것을 영영 건너뛰는 쪽으로(치명) 실패하기
+   * 때문이다. 중복은 수신 측(`MessageCollection.onIncoming`)의 id dedupe가
+   * 흡수하므로, "빠뜨린 갱신"으로 보고 올리지 말 것.
+   */
   private lastMessageIdByRoom = new Map<string, MessageIdStr>();
   /** Most recently dispatched presence event key, `${userId}:${at}:${online}`.
    *  Used to drop the N-1 shared-room copies of a single online/offline

package/src/features/message-collection.ts

@@ -223,7 +223,18 @@ export class MessageCollection {
       this._messages.splice(0, this.hydratedCount); // 스냅샷 통째 폐기 → 서버가 이긴다
       this.hydratedCount = 0;
     }
-    this._messages.unshift(...page.items.map(chatMessageFromHistory));
+    // id 기준 upsert — 이미 들고 있는 메시지는 서버 버전으로 교체하고, 없는
+    // 것만 앞에 잇는다. `load()`가 두 번 불려도(React StrictMode의 mount →
+    // cleanup → mount 사이클처럼) 같은 페이지가 겹쳐 쌓이지 않는다.
+    const indexById = new Map<string, number>();
+    this._messages.forEach((m, i) => indexById.set(m.id, i));
+    const fresh: ChatMessage[] = [];
+    for (const item of page.items.map(chatMessageFromHistory)) {
+      const at = indexById.get(item.id);
+      if (at === undefined) fresh.push(item);
+      else this._messages[at] = item; // 겹치는 구간은 서버가 이긴다
+    }
+    this._messages.unshift(...fresh);
     this.oldestCursor = page.nextCursor;
     this._hasMore = page.hasMore;
     this.emit("replaced");
@@ -439,8 +450,26 @@ export class MessageCollection {
 
   // ── event handlers ──────────────────────────────────────────────
 
+  /**
+   * 수신 프레임을 컬렉션에 넣는다.
+   *
+   * 두 가지를 방어한다 — backfill(`chat.backfill()`)은 재연결 시 앵커
+   * 이후를 **다시** 실어오므로, 이미 들고 있는 메시지가 섞여 오고 화면보다
+   * 오래된 메시지도 함께 온다:
+   * - **중복**: 같은 id가 이미 있으면 무시한다.
+   * - **순서**: 뒤에서부터 자리를 찾아 꽂는다. 실시간 프레임은 항상 마지막
+   *   메시지보다 새로우므로 비교 1번으로 끝나고(빠른 경로), 옛 메시지가
+   *   섞여 올 때만 탐색이 일어난다.
+   */
   private onIncoming(f: WsChatReceive): void {
-    this._messages.push(chatMessageFromLive(f));
+    const msg = chatMessageFromLive(f);
+    let i = this._messages.length - 1;
+    for (; i >= 0; i--) {
+      const cur = this._messages[i]!;
+      if (cur.id === msg.id) return; // 이미 있음 — 재전송분
+      if (!idGreater(cur.id, msg.id)) break; // 여기가 삽입 자리
+    }
+    this._messages.splice(i + 1, 0, msg);
     this.emit("inserted");
   }
 

package/src/transport/ws.ts

@@ -41,6 +41,17 @@ export class ReconnectingWs {
   // heartbeats and a stale typing event is worse than no event.
   private outboundQueue: WsOutbound[] = [];
   private static readonly OUTBOUND_QUEUE_CAP = 200;
+  /**
+   * 연결 시도의 세대 번호 — `connect()`/`close()` 마다 올린다.
+   *
+   * `openOnce()` 는 `urlBuilder()`(토큰 발급 왕복)를 await 하는 동안 아직
+   * 소켓이 없어서, 그 틈에 들어온 `close()` 는 닫을 대상을 찾지 못한다.
+   * 이어서 새 `connect()` 가 `explicitClose` 를 되돌리면, 뒤늦게 깨어난
+   * 앞선 시도가 **아무도 닫지 않는 소켓**을 하나 더 만든다(React StrictMode 의
+   * mount → cleanup → mount 에서 재현). 불리언 하나로는 "이미 취소됐다"를
+   * 알릴 수 없으므로 세대 번호로 판별한다.
+   */
+  private gen = 0;
 
   constructor(private opts: ReconnectingWsOptions) {}
 
@@ -50,10 +61,11 @@ export class ReconnectingWs {
 
   async connect(): Promise<void> {
     this.explicitClose = false;
-    await this.openOnce();
+    await this.openOnce(++this.gen);
   }
 
   close(): void {
+    this.gen++; // 진행 중인 연결 시도를 모두 무효화한다
     this.explicitClose = true;
     this.setState("closed");
     if (this.pingTimer) clearInterval(this.pingTimer);
@@ -91,7 +103,8 @@ export class ReconnectingWs {
     return true;
   }
 
-  private async openOnce(): Promise<void> {
+  private async openOnce(gen: number): Promise<void> {
+    if (gen !== this.gen) return;
     this.setState(this.attempt === 0 ? "connecting" : "reconnecting");
     const WSImpl = this.opts.WebSocketImpl ?? (globalThis.WebSocket as typeof WebSocket);
     if (!WSImpl) throw new Error("No WebSocket implementation available");
@@ -101,7 +114,14 @@ export class ReconnectingWs {
       url = await this.opts.urlBuilder();
     } catch (err) {
       this.opts.logger?.("error", "url_builder_failed", err);
-      this.scheduleReconnect();
+      if (gen === this.gen) this.scheduleReconnect();
+      return;
+    }
+
+    // await 사이에 close()/connect() 가 지나갔으면 이 시도는 이미 취소된
+    // 것이다 — 소켓을 만들지 않고 물러난다(누수 소켓 방지).
+    if (gen !== this.gen) {
+      this.opts.logger?.("info", "ws_open_aborted_stale", { gen, current: this.gen });
       return;
     }
 
@@ -175,8 +195,9 @@ export class ReconnectingWs {
     const delay = exp + jitter;
     this.opts.logger?.("info", "ws_reconnect_scheduled", { attempt: this.attempt, delay });
     this.setState("reconnecting");
+    const gen = this.gen; // 예약 시점의 세대 — 그사이 close/connect 가 오면 취소
     setTimeout(() => {
-      void this.openOnce();
+      void this.openOnce(gen);
     }, delay);
   }