FIX: removes leaking handler in select-kit (#7729)

FIX: removes leaking handler in select-kit (#7729)

diff --git a/app/assets/javascripts/select-kit/mixins/events.js.es6 b/app/assets/javascripts/select-kit/mixins/events.js.es6
index 76a60fb..df97969 100644
--- a/app/assets/javascripts/select-kit/mixins/events.js.es6
+++ b/app/assets/javascripts/select-kit/mixins/events.js.es6
@@ -1,9 +1,10 @@
 import { on } from "ember-addons/ember-computed-decorators";
 
-export default Ember.Mixin.create({
-  init() {
-    this._super(...arguments);
+const { bind } = Ember.run;
 
+export default Ember.Mixin.create({
+  @on("init")
+  _initKeys() {
     this.keys = {
       TAB: 9,
       ENTER: 13,
@@ -15,43 +16,64 @@ export default Ember.Mixin.create({
       RIGHT: 39,
       A: 65
     };
+
+    this._boundMouseDownHandler = bind(this, this._mouseDownHandler);
+    this._boundFocusHeaderHandler = bind(this, this._focusHeaderHandler);
+    this._boundKeydownHeaderHandler = bind(this, this._keydownHeaderHandler);
+    this._boundKeypressHeaderHandler = bind(this, this._keypressHeaderHandler);
+    this._boundChangeFilterInputHandler = bind(
+      this,
+      this._changeFilterInputHandler
+    );
+    this._boundKeypressFilterInputHandler = bind(
+      this,
+      this._keypressFilterInputHandler
+    );
+    this._boundFocusoutFilterInputHandler = bind(
+      this,
+      this._focusoutFilterInputHandler
+    );
+    this._boundKeydownFilterInputHandler = bind(
+      this,
+      this._keydownFilterInputHandler
+    );
   },
 
   @on("didInsertElement")
   _setupEvents() {
-    $(document).on("mousedown.select-kit", this._mouseDownHandler.bind(this));
+    $(document).on("mousedown.select-kit", this._boundMouseDownHandler);
 
     this.$header()
-      .on("blur.select-kit", this._blurHeaderHandler.bind(this))
-      .on("focus.select-kit", this._focusHeaderHandler.bind(this))
-      .on("keydown.select-kit", this._keydownHeaderHandler.bind(this))
-      .on("keypress.select-kit", this._keypressHeaderHandler.bind(this));
+      .on("blur.select-kit", this._boundBlurHeaderHandler)
+      .on("focus.select-kit", this._boundFocusHeaderHandler)
+      .on("keydown.select-kit", this._boundKeydownHeaderHandler)
+      .on("keypress.select-kit", this._boundKeypressHeaderHandler);
 
     this.$filterInput()
-      .on("change.select-kit", this._changeFilterInputHandler.bind(this))
-      .on("keypress.select-kit", this._keypressFilterInputHandler.bind(this))
-      .on("focusout.select-kit", this._focusoutFilterInputHandler.bind(this))
-      .on("keydown.select-kit", this._keydownFilterInputHandler.bind(this));
+      .on("change.select-kit", this._boundChangeFilterInputHandler)
+      .on("keypress.select-kit", this._boundKeypressFilterInputHandler)
+      .on("focusout.select-kit", this._boundFocusoutFilterInputHandler)
+      .on("keydown.select-kit", this._boundKeydownFilterInputHandler);
   },
 
   @on("willDestroyElement")
   _cleanUpEvents() {
-    $(document).off("mousedown.select-kit", this._mouseDownHandler);
+    $(document).off("mousedown.select-kit", this._boundMouseDownHandler);
 
     if (this.$header().length) {
       this.$header()
-        .off("blur.select-kit", this._blurHeaderHandler)
-        .off("focus.select-kit", this._focusHeaderHandler)
-        .off("keydown.select-kit", this._keydownHeaderHandler)
-        .off("keypress.select-kit", this._keypressHeaderHandler);
+        .off("blur.select-kit", this._boundBlurHeaderHandler)
+        .off("focus.select-kit", this._boundFocusHeaderHandler)
+        .off("keydown.select-kit", this._boundKeydownHeaderHandler)
+        .off("keypress.select-kit", this._boundKeypressHeaderHandler);
     }
 
     if (this.$filterInput().length) {
       this.$filterInput()
-        .off("change.select-kit", this._changeFilterInputHandler)
-        .off("keydown.select-kit", this._keydownFilterInputHandler)
-        .off("keypress.select-kit", this._keypressFilterInputHandler)
-        .off("focusout.select-kit", this._focusoutFilterInputHandler);
+        .off("change.select-kit", this._boundChangeFilterInputHandler)
+        .off("keypress.select-kit", this._boundKeypressFilterInputHandler)
+        .off("focusout.select-kit", this._boundFocusoutFilterInputHandler)
+        .off("keydown.select-kit", this._boundKeydownFilterInputHandler);
     }
   },

GitHub sha: df01249d

1 Like