laravel-echo - npm Package Compare versions

Comparing version 1.9.0 to 1.10.0

CHANGELOG.md

 # Release Notes
 
-## [Unreleased](https://github.com/laravel/echo/compare/v1.8.1...master)
+## [Unreleased](https://github.com/laravel/echo/compare/v1.9.0...master)
 
 
+## [v1.9.0 (2020-10-13)](https://github.com/laravel/echo/compare/v1.8.1...v1.9.0)
+
+### Added
+- Register subscription succeeded callbacks ([#288](https://github.com/laravel/echo/pull/288))
+
+
 ## [v1.8.1 (2020-07-31)](https://github.com/laravel/echo/compare/v1.8.0...v1.8.1)
@@ -7,0 +13,0 @@

dist/channel/channel.d.ts

@@ -24,7 +24,7 @@ /**
      */
-    abstract stopListening(event: string): Channel;
+    abstract stopListening(event: string, callback?: Function): Channel;
     /**
      * Stop listening for a whisper event on the channel instance.
      */
-    stopListeningForWhisper(event: string): Channel;
+    stopListeningForWhisper(event: string, callback?: Function): Channel;
     /**
@@ -31,0 +31,0 @@ * Register a callback to be called anytime a subscription succeeds.

dist/channel/null-channel.d.ts

@@ -21,3 +21,3 @@ import { Channel } from './channel';
      */
-    stopListening(event: string): NullChannel;
+    stopListening(event: string, callback?: Function): NullChannel;
     /**
@@ -24,0 +24,0 @@ * Register a callback to be called anytime a subscription succeeds.

dist/channel/pusher-channel.d.ts

@@ -46,3 +46,3 @@ import { EventFormatter } from '../util';
      */
-    stopListening(event: string): PusherChannel;
+    stopListening(event: string, callback?: Function): PusherChannel;
     /**
@@ -49,0 +49,0 @@ * Register a callback to be called anytime a subscription succeeds.

dist/channel/socketio-channel.d.ts

@@ -24,6 +24,10 @@ import { EventFormatter } from '../util';
     /**
-     * The event callbacks applied to the channel.
+     * The event callbacks applied to the socket.
      */
     events: any;
     /**
+     * User supplied callbacks for events on this channel.
+     */
+    private listeners;
+    /**
      * Create a new class instance.
@@ -47,3 +51,3 @@ */
      */
-    stopListening(event: string): SocketIoChannel;
+    stopListening(event: string, callback?: Function): SocketIoChannel;
     /**
@@ -60,15 +64,11 @@ * Register a callback to be called anytime a subscription succeeds.
      */
-    on(event: string, callback: Function): void;
+    on(event: string, callback: Function): SocketIoChannel;
     /**
-     * Attach a 'reconnect' listener and bind the event.
+     * Unbind the channel's socket from all stored event callbacks.
      */
-    configureReconnector(): void;
+    unbind(): void;
     /**
-     * Bind the channel's socket to an event and store the callback.
+     * Unbind the listeners for the given event.
      */
-    bind(event: string, callback: Function): void;
-    /**
-     * Unbind the channel's socket from all stored event callbacks.
-     */
-    unbind(): void;
+    protected unbindEvent(event: string, callback?: Function): void;
 }

dist/channel/socketio-private-channel.d.ts

 import { SocketIoChannel } from './socketio-channel';
 /**
- * This class represents a Socket.io presence channel.
+ * This class represents a Socket.io private channel.
  */
@@ -5,0 +5,0 @@ export declare class SocketIoPrivateChannel extends SocketIoChannel {

dist/connector/socketio-connector.d.ts

@@ -14,3 +14,5 @@ import { Connector } from './connector';
      */
-    channels: any;
+    channels: {
+        [name: string]: SocketIoChannel;
+    };
     /**
@@ -17,0 +19,0 @@ * Create a fresh Socket.io connection.

dist/echo.common.js

@@ -218,4 +218,4 @@ 'use strict';
     key: "stopListeningForWhisper",
-    value: function stopListeningForWhisper(event) {
-      return this.stopListening('.client-' + event);
+    value: function stopListeningForWhisper(event, callback) {
+      return this.stopListening('.client-' + event, callback);
     }
@@ -331,4 +331,9 @@ }]);
     key: "stopListening",
-    value: function stopListening(event) {
-      this.subscription.unbind(this.eventFormatter.format(event));
+    value: function stopListening(event, callback) {
+      if (callback) {
+        this.subscription.unbind(this.eventFormatter.format(event), callback);
+      } else {
+        this.subscription.unbind(this.eventFormatter.format(event));
+      }
+
       return this;
@@ -522,6 +527,11 @@ }
     /**
-     * The event callbacks applied to the channel.
+     * The event callbacks applied to the socket.
      */
 
     _this.events = {};
+    /**
+     * User supplied callbacks for events on this channel.
+     */
+
+    _this.listeners = {};
     _this.name = name;
@@ -534,4 +544,2 @@ _this.socket = socket;
 
-    _this.configureReconnector();
-
     return _this;
@@ -581,6 +589,4 @@ }
     key: "stopListening",
-    value: function stopListening(event) {
-      var name = this.eventFormatter.format(event);
-      this.socket.removeListener(name);
-      delete this.events[name];
+    value: function stopListening(event, callback) {
+      this.unbindEvent(this.eventFormatter.format(event), callback);
       return this;
@@ -618,53 +624,55 @@ }
 
-      var listener = function listener(channel, data) {
-        if (_this2.name == channel) {
-          callback(data);
-        }
-      };
+      this.listeners[event] = this.listeners[event] || [];
 
-      this.socket.on(event, listener);
-      this.bind(event, listener);
+      if (!this.events[event]) {
+        this.events[event] = function (channel, data) {
+          if (_this2.name === channel && _this2.listeners[event]) {
+            _this2.listeners[event].forEach(function (cb) {
+              return cb(data);
+            });
+          }
+        };
+
+        this.socket.on(event, this.events[event]);
+      }
+
+      this.listeners[event].push(callback);
+      return this;
     }
     /**
-     * Attach a 'reconnect' listener and bind the event.
+     * Unbind the channel's socket from all stored event callbacks.
      */
 
   }, {
-    key: "configureReconnector",
-    value: function configureReconnector() {
+    key: "unbind",
+    value: function unbind() {
       var _this3 = this;
 
-      var listener = function listener() {
-        _this3.subscribe();
-      };
-
-      this.socket.on('reconnect', listener);
-      this.bind('reconnect', listener);
+      Object.keys(this.events).forEach(function (event) {
+        _this3.unbindEvent(event);
+      });
     }
     /**
-     * Bind the channel's socket to an event and store the callback.
+     * Unbind the listeners for the given event.
      */
 
   }, {
-    key: "bind",
-    value: function bind(event, callback) {
-      this.events[event] = this.events[event] || [];
-      this.events[event].push(callback);
-    }
-    /**
-     * Unbind the channel's socket from all stored event callbacks.
-     */
+    key: "unbindEvent",
+    value: function unbindEvent(event, callback) {
+      this.listeners[event] = this.listeners[event] || [];
 
-  }, {
-    key: "unbind",
-    value: function unbind() {
-      var _this4 = this;
-
-      Object.keys(this.events).forEach(function (event) {
-        _this4.events[event].forEach(function (callback) {
-          _this4.socket.removeListener(event, callback);
+      if (callback) {
+        this.listeners[event] = this.listeners[event].filter(function (cb) {
+          return cb !== callback;
         });
+      }
 
-        delete _this4.events[event];
-      });
+      if (!callback || this.listeners[event].length === 0) {
+        if (this.events[event]) {
+          this.socket.removeListener(event, this.events[event]);
+          delete this.events[event];
+        }
+
+        delete this.listeners[event];
+      }
     }
@@ -677,3 +685,3 @@ }]);
 /**
- * This class represents a Socket.io presence channel.
+ * This class represents a Socket.io private channel.
  */
@@ -815,3 +823,3 @@
     key: "stopListening",
-    value: function stopListening(event) {
+    value: function stopListening(event, callback) {
       return this;
@@ -1112,4 +1120,11 @@ }
     value: function connect() {
+      var _this2 = this;
+
       var io = this.getSocketIO();
       this.socket = io(this.options.host, this.options);
+      this.socket.on('reconnect', function () {
+        Object.values(_this2.channels).forEach(function (channel) {
+          channel.subscribe();
+        });
+      });
       return this.socket;
@@ -1189,7 +1204,7 @@ }
     value: function leave(name) {
-      var _this2 = this;
+      var _this3 = this;
 
       var channels = [name, 'private-' + name, 'presence-' + name];
       channels.forEach(function (name) {
-        _this2.leaveChannel(name);
+        _this3.leaveChannel(name);
       });
@@ -1196,0 +1211,0 @@ }

dist/echo.iife.js

@@ -219,4 +219,4 @@ var Echo = (function () {
       key: "stopListeningForWhisper",
-      value: function stopListeningForWhisper(event) {
-        return this.stopListening('.client-' + event);
+      value: function stopListeningForWhisper(event, callback) {
+        return this.stopListening('.client-' + event, callback);
       }
@@ -332,4 +332,9 @@ }]);
       key: "stopListening",
-      value: function stopListening(event) {
-        this.subscription.unbind(this.eventFormatter.format(event));
+      value: function stopListening(event, callback) {
+        if (callback) {
+          this.subscription.unbind(this.eventFormatter.format(event), callback);
+        } else {
+          this.subscription.unbind(this.eventFormatter.format(event));
+        }
+
         return this;
@@ -523,6 +528,11 @@ }
       /**
-       * The event callbacks applied to the channel.
+       * The event callbacks applied to the socket.
        */
 
       _this.events = {};
+      /**
+       * User supplied callbacks for events on this channel.
+       */
+
+      _this.listeners = {};
       _this.name = name;
@@ -535,4 +545,2 @@ _this.socket = socket;
 
-      _this.configureReconnector();
-
       return _this;
@@ -582,6 +590,4 @@ }
       key: "stopListening",
-      value: function stopListening(event) {
-        var name = this.eventFormatter.format(event);
-        this.socket.removeListener(name);
-        delete this.events[name];
+      value: function stopListening(event, callback) {
+        this.unbindEvent(this.eventFormatter.format(event), callback);
         return this;
@@ -619,53 +625,55 @@ }
 
-        var listener = function listener(channel, data) {
-          if (_this2.name == channel) {
-            callback(data);
-          }
-        };
+        this.listeners[event] = this.listeners[event] || [];
 
-        this.socket.on(event, listener);
-        this.bind(event, listener);
+        if (!this.events[event]) {
+          this.events[event] = function (channel, data) {
+            if (_this2.name === channel && _this2.listeners[event]) {
+              _this2.listeners[event].forEach(function (cb) {
+                return cb(data);
+              });
+            }
+          };
+
+          this.socket.on(event, this.events[event]);
+        }
+
+        this.listeners[event].push(callback);
+        return this;
       }
       /**
-       * Attach a 'reconnect' listener and bind the event.
+       * Unbind the channel's socket from all stored event callbacks.
        */
 
     }, {
-      key: "configureReconnector",
-      value: function configureReconnector() {
+      key: "unbind",
+      value: function unbind() {
         var _this3 = this;
 
-        var listener = function listener() {
-          _this3.subscribe();
-        };
-
-        this.socket.on('reconnect', listener);
-        this.bind('reconnect', listener);
+        Object.keys(this.events).forEach(function (event) {
+          _this3.unbindEvent(event);
+        });
       }
       /**
-       * Bind the channel's socket to an event and store the callback.
+       * Unbind the listeners for the given event.
        */
 
     }, {
-      key: "bind",
-      value: function bind(event, callback) {
-        this.events[event] = this.events[event] || [];
-        this.events[event].push(callback);
-      }
-      /**
-       * Unbind the channel's socket from all stored event callbacks.
-       */
+      key: "unbindEvent",
+      value: function unbindEvent(event, callback) {
+        this.listeners[event] = this.listeners[event] || [];
 
-    }, {
-      key: "unbind",
-      value: function unbind() {
-        var _this4 = this;
-
-        Object.keys(this.events).forEach(function (event) {
-          _this4.events[event].forEach(function (callback) {
-            _this4.socket.removeListener(event, callback);
+        if (callback) {
+          this.listeners[event] = this.listeners[event].filter(function (cb) {
+            return cb !== callback;
           });
+        }
 
-          delete _this4.events[event];
-        });
+        if (!callback || this.listeners[event].length === 0) {
+          if (this.events[event]) {
+            this.socket.removeListener(event, this.events[event]);
+            delete this.events[event];
+          }
+
+          delete this.listeners[event];
+        }
       }
@@ -678,3 +686,3 @@ }]);
   /**
-   * This class represents a Socket.io presence channel.
+   * This class represents a Socket.io private channel.
    */
@@ -816,3 +824,3 @@
       key: "stopListening",
-      value: function stopListening(event) {
+      value: function stopListening(event, callback) {
         return this;
@@ -1113,4 +1121,11 @@ }
       value: function connect() {
+        var _this2 = this;
+
         var io = this.getSocketIO();
         this.socket = io(this.options.host, this.options);
+        this.socket.on('reconnect', function () {
+          Object.values(_this2.channels).forEach(function (channel) {
+            channel.subscribe();
+          });
+        });
         return this.socket;
@@ -1190,7 +1205,7 @@ }
       value: function leave(name) {
-        var _this2 = this;
+        var _this3 = this;
 
         var channels = [name, 'private-' + name, 'presence-' + name];
         channels.forEach(function (name) {
-          _this2.leaveChannel(name);
+          _this3.leaveChannel(name);
         });
@@ -1197,0 +1212,0 @@ }

dist/echo.js

@@ -216,4 +216,4 @@ function _classCallCheck(instance, Constructor) {
     key: "stopListeningForWhisper",
-    value: function stopListeningForWhisper(event) {
-      return this.stopListening('.client-' + event);
+    value: function stopListeningForWhisper(event, callback) {
+      return this.stopListening('.client-' + event, callback);
     }
@@ -329,4 +329,9 @@ }]);
     key: "stopListening",
-    value: function stopListening(event) {
-      this.subscription.unbind(this.eventFormatter.format(event));
+    value: function stopListening(event, callback) {
+      if (callback) {
+        this.subscription.unbind(this.eventFormatter.format(event), callback);
+      } else {
+        this.subscription.unbind(this.eventFormatter.format(event));
+      }
+
       return this;
@@ -520,6 +525,11 @@ }
     /**
-     * The event callbacks applied to the channel.
+     * The event callbacks applied to the socket.
      */
 
     _this.events = {};
+    /**
+     * User supplied callbacks for events on this channel.
+     */
+
+    _this.listeners = {};
     _this.name = name;
@@ -532,4 +542,2 @@ _this.socket = socket;
 
-    _this.configureReconnector();
-
     return _this;
@@ -579,6 +587,4 @@ }
     key: "stopListening",
-    value: function stopListening(event) {
-      var name = this.eventFormatter.format(event);
-      this.socket.removeListener(name);
-      delete this.events[name];
+    value: function stopListening(event, callback) {
+      this.unbindEvent(this.eventFormatter.format(event), callback);
       return this;
@@ -616,53 +622,55 @@ }
 
-      var listener = function listener(channel, data) {
-        if (_this2.name == channel) {
-          callback(data);
-        }
-      };
+      this.listeners[event] = this.listeners[event] || [];
 
-      this.socket.on(event, listener);
-      this.bind(event, listener);
+      if (!this.events[event]) {
+        this.events[event] = function (channel, data) {
+          if (_this2.name === channel && _this2.listeners[event]) {
+            _this2.listeners[event].forEach(function (cb) {
+              return cb(data);
+            });
+          }
+        };
+
+        this.socket.on(event, this.events[event]);
+      }
+
+      this.listeners[event].push(callback);
+      return this;
     }
     /**
-     * Attach a 'reconnect' listener and bind the event.
+     * Unbind the channel's socket from all stored event callbacks.
      */
 
   }, {
-    key: "configureReconnector",
-    value: function configureReconnector() {
+    key: "unbind",
+    value: function unbind() {
       var _this3 = this;
 
-      var listener = function listener() {
-        _this3.subscribe();
-      };
-
-      this.socket.on('reconnect', listener);
-      this.bind('reconnect', listener);
+      Object.keys(this.events).forEach(function (event) {
+        _this3.unbindEvent(event);
+      });
     }
     /**
-     * Bind the channel's socket to an event and store the callback.
+     * Unbind the listeners for the given event.
      */
 
   }, {
-    key: "bind",
-    value: function bind(event, callback) {
-      this.events[event] = this.events[event] || [];
-      this.events[event].push(callback);
-    }
-    /**
-     * Unbind the channel's socket from all stored event callbacks.
-     */
+    key: "unbindEvent",
+    value: function unbindEvent(event, callback) {
+      this.listeners[event] = this.listeners[event] || [];
 
-  }, {
-    key: "unbind",
-    value: function unbind() {
-      var _this4 = this;
-
-      Object.keys(this.events).forEach(function (event) {
-        _this4.events[event].forEach(function (callback) {
-          _this4.socket.removeListener(event, callback);
+      if (callback) {
+        this.listeners[event] = this.listeners[event].filter(function (cb) {
+          return cb !== callback;
         });
+      }
 
-        delete _this4.events[event];
-      });
+      if (!callback || this.listeners[event].length === 0) {
+        if (this.events[event]) {
+          this.socket.removeListener(event, this.events[event]);
+          delete this.events[event];
+        }
+
+        delete this.listeners[event];
+      }
     }
@@ -675,3 +683,3 @@ }]);
 /**
- * This class represents a Socket.io presence channel.
+ * This class represents a Socket.io private channel.
  */
@@ -813,3 +821,3 @@
     key: "stopListening",
-    value: function stopListening(event) {
+    value: function stopListening(event, callback) {
       return this;
@@ -1110,4 +1118,11 @@ }
     value: function connect() {
+      var _this2 = this;
+
       var io = this.getSocketIO();
       this.socket = io(this.options.host, this.options);
+      this.socket.on('reconnect', function () {
+        Object.values(_this2.channels).forEach(function (channel) {
+          channel.subscribe();
+        });
+      });
       return this.socket;
@@ -1187,7 +1202,7 @@ }
     value: function leave(name) {
-      var _this2 = this;
+      var _this3 = this;
 
       var channels = [name, 'private-' + name, 'presence-' + name];
       channels.forEach(function (name) {
-        _this2.leaveChannel(name);
+        _this3.leaveChannel(name);
       });
@@ -1194,0 +1209,0 @@ }

package.json

 {
     "name": "laravel-echo",
-    "version": "1.9.0",
+    "version": "1.10.0",
     "description": "Laravel Echo library for beautiful Pusher and Socket.IO integration",
@@ -5,0 +5,0 @@ "keywords": [

src/channel/channel.ts

@@ -32,3 +32,3 @@ /**
      */
-    abstract stopListening(event: string): Channel;
+    abstract stopListening(event: string, callback?: Function): Channel;
 
@@ -38,4 +38,4 @@ /**
      */
-    stopListeningForWhisper(event: string): Channel {
-        return this.stopListening('.client-' + event);
+    stopListeningForWhisper(event: string, callback?: Function): Channel {
+        return this.stopListening('.client-' + event, callback);
     }
@@ -42,0 +42,0 @@

src/channel/null-channel.ts

@@ -31,3 +31,3 @@ import { Channel } from './channel';
      */
-    stopListening(event: string): NullChannel {
+    stopListening(event: string, callback?: Function): NullChannel {
         return this;
@@ -34,0 +34,0 @@ }

src/channel/pusher-channel.ts

@@ -73,4 +73,8 @@ import { EventFormatter } from '../util';
      */
-    stopListening(event: string): PusherChannel {
-        this.subscription.unbind(this.eventFormatter.format(event));
+    stopListening(event: string, callback?: Function): PusherChannel {
+        if (callback) {
+            this.subscription.unbind(this.eventFormatter.format(event), callback);
+        } else {
+            this.subscription.unbind(this.eventFormatter.format(event));
+        }
 
@@ -77,0 +81,0 @@ return this;

src/channel/socketio-channel.ts

@@ -29,3 +29,3 @@ import { EventFormatter } from '../util';
     /**
-     * The event callbacks applied to the channel.
+     * The event callbacks applied to the socket.
      */
@@ -35,2 +35,7 @@ events: any = {};
     /**
+     * User supplied callbacks for events on this channel.
+     */
+    private listeners: any = {};
+
+    /**
      * Create a new class instance.
@@ -47,3 +52,2 @@ */
         this.subscribe();
-        this.configureReconnector();
     }
@@ -85,6 +89,4 @@
      */
-    stopListening(event: string): SocketIoChannel {
-        const name = this.eventFormatter.format(event);
-        this.socket.removeListener(name);
-        delete this.events[name];
+    stopListening(event: string, callback?: Function): SocketIoChannel {
+        this.unbindEvent(this.eventFormatter.format(event), callback);
 
@@ -115,31 +117,18 @@ return this;
      */
-    on(event: string, callback: Function): void {
-        let listener = (channel, data) => {
-            if (this.name == channel) {
-                callback(data);
-            }
-        };
+    on(event: string, callback: Function): SocketIoChannel {
+        this.listeners[event] = this.listeners[event] || [];
 
-        this.socket.on(event, listener);
-        this.bind(event, listener);
-    }
+        if (! this.events[event]) {
+            this.events[event] = (channel, data) => {
+                if (this.name === channel && this.listeners[event]) {
+                    this.listeners[event].forEach((cb) => cb(data));
+                }
+            };
 
-    /**
-     * Attach a 'reconnect' listener and bind the event.
-     */
-    configureReconnector(): void {
-        const listener = () => {
-            this.subscribe();
-        };
+            this.socket.on(event, this.events[event]);
+        }
 
-        this.socket.on('reconnect', listener);
-        this.bind('reconnect', listener);
-    }
+        this.listeners[event].push(callback);
 
-    /**
-     * Bind the channel's socket to an event and store the callback.
-     */
-    bind(event: string, callback: Function): void {
-        this.events[event] = this.events[event] || [];
-        this.events[event].push(callback);
+        return this;
     }
@@ -152,9 +141,26 @@
         Object.keys(this.events).forEach((event) => {
-            this.events[event].forEach((callback) => {
-                this.socket.removeListener(event, callback);
-            });
-
-            delete this.events[event];
+            this.unbindEvent(event);
         });
     }
+
+    /**
+     * Unbind the listeners for the given event.
+     */
+    protected unbindEvent(event: string, callback?: Function): void {
+        this.listeners[event] = this.listeners[event] || [];
+
+        if (callback) {
+            this.listeners[event] = this.listeners[event].filter((cb) => cb !== callback);
+        }
+
+        if (!callback || this.listeners[event].length === 0) {
+            if (this.events[event]) {
+                this.socket.removeListener(event, this.events[event]);
+
+                delete this.events[event];
+            }
+
+            delete this.listeners[event];
+        }
+    }
 }

src/channel/socketio-private-channel.ts

 import { SocketIoChannel } from './socketio-channel';
 
 /**
- * This class represents a Socket.io presence channel.
+ * This class represents a Socket.io private channel.
  */
@@ -6,0 +6,0 @@ export class SocketIoPrivateChannel extends SocketIoChannel {

src/connector/socketio-connector.ts

@@ -16,3 +16,3 @@ import { Connector } from './connector';
      */
-    channels: any = {};
+    channels: { [name: string]: SocketIoChannel } = {};
 
@@ -27,2 +27,8 @@ /**
 
+        this.socket.on('reconnect', () => {
+            Object.values(this.channels).forEach((channel) => {
+                channel.subscribe();
+            });
+        });
+
         return this.socket;
@@ -72,3 +78,3 @@ }
 
-        return this.channels['private-' + name];
+        return this.channels['private-' + name] as SocketIoPrivateChannel;
     }
@@ -88,3 +94,3 @@
 
-        return this.channels['presence-' + name];
+        return this.channels['presence-' + name] as SocketIoPresenceChannel;
     }
@@ -91,0 +97,0 @@

No alert changes

Improved metrics

Total package byte prevSize

176624

increased by2.88%

Number of package files

68

increased by1.49%

Lines of code

5662

increased by2%

No dependency changes