wait for socket to be ready before sending messages

Author: notbakaneko

resources/js/socket-worker.ts

@@ -80,6 +80,12 @@ export default class SocketWorker {
     this.boot();
   }
 
+  @action
+  private connected() {
+    this.connectionStatus = 'connected';
+    this.hasConnectedOnce = true;
+  }
+
   @action
   private connectWebSocket() {
     if (!this.active || this.endpoint == null || this.ws != null) {
@@ -97,11 +103,6 @@ export default class SocketWorker {
 
     const token = tokenEl.getAttribute('content');
     this.ws = new WebSocket(`${this.endpoint}?csrf=${token}`);
-    this.ws.addEventListener('open', action(() => {
-      this.retryDelay.reset();
-      this.connectionStatus = 'connected';
-      this.hasConnectedOnce = true;
-    }));
     this.ws.addEventListener('close', this.reconnectWebSocket);
     this.ws.addEventListener('message', this.handleNewEvent);
   }
@@ -127,7 +128,9 @@ export default class SocketWorker {
     const eventData = this.parseMessageEvent(event);
     if (eventData == null) return;
 
-    if (isNotificationEventLogoutJson(eventData)) {
+    if (eventData.event === 'connection.ready') {
+      this.connected();
+    } else if (isNotificationEventLogoutJson(eventData)) {
       this.destroy();
       core.userLoginObserver.logout();
     } else if (isNotificationEventVerifiedJson(eventData)) {