From e777f3eb3238d8bc8887feeb10da9a73b4c7a563 Mon Sep 17 00:00:00 2001
From: Kyle Bishop <kybishop@gmail.com>
Date: Thu, 2 Nov 2017 17:55:41 -0700
Subject: [PATCH] fix(toggling renderInPlace) (#58)

---
 addon/components/-ember-popper-legacy.js   | 40 +++++++++++-----------
 addon/components/ember-popper-base.js      | 10 ++----
 tests/dummy/app/controllers/application.js |  5 +++
 tests/dummy/app/templates/application.hbs  |  9 +++--
 yarn.lock                                  |  2 +-
 5 files changed, 35 insertions(+), 31 deletions(-)

diff --git a/addon/components/-ember-popper-legacy.js b/addon/components/-ember-popper-legacy.js
index 58ff4af..3398970 100644
--- a/addon/components/-ember-popper-legacy.js
+++ b/addon/components/-ember-popper-legacy.js
@@ -16,33 +16,33 @@ export default class EmberPopper extends EmberPopperBase {
     this._initialParentNode = this.element.parentNode;
 
     if (!GTE_EMBER_1_13) {
-      addObserver(this, 'renderInPlace', this, this.didUpdateAttrs);
-      addObserver(this, 'eventsEnabled', this, this.didUpdateAttrs);
-      addObserver(this, 'modifiers', this, this.didUpdateAttrs);
-      addObserver(this, 'registerAPI', this, this.didUpdateAttrs);
-      addObserver(this, 'onCreate', this, this.didUpdateAttrs);
-      addObserver(this, 'onUpdate', this, this.didUpdateAttrs);
-      addObserver(this, 'placement', this, this.didUpdateAttrs);
-      addObserver(this, 'popperContainer', this, this.didUpdateAttrs);
-      addObserver(this, 'target', this, this.didUpdateAttrs);
+      addObserver(this, 'renderInPlace', this, this._updatePopper);
+      addObserver(this, 'eventsEnabled', this, this._updatePopper);
+      addObserver(this, 'modifiers', this, this._updatePopper);
+      addObserver(this, 'registerAPI', this, this._updatePopper);
+      addObserver(this, 'onCreate', this, this._updatePopper);
+      addObserver(this, 'onUpdate', this, this._updatePopper);
+      addObserver(this, 'placement', this, this._updatePopper);
+      addObserver(this, 'popperContainer', this, this._updatePopper);
+      addObserver(this, 'target', this, this._updatePopper);
+
+      super.didRender(...arguments);
     }
-
-    super.didInsertElement(...arguments);
   }
 
   willDestroyElement() {
     super.willDestroyElement(...arguments);
 
     if (!GTE_EMBER_1_13) {
-      removeObserver(this, 'renderInPlace', this, this.didUpdateAttrs);
-      removeObserver(this, 'eventsEnabled', this, this.didUpdateAttrs);
-      removeObserver(this, 'modifiers', this, this.didUpdateAttrs);
-      removeObserver(this, 'registerAPI', this, this.didUpdateAttrs);
-      removeObserver(this, 'onCreate', this, this.didUpdateAttrs);
-      removeObserver(this, 'onUpdate', this, this.didUpdateAttrs);
-      removeObserver(this, 'placement', this, this.didUpdateAttrs);
-      removeObserver(this, 'popperContainer', this, this.didUpdateAttrs);
-      removeObserver(this, 'target', this, this.didUpdateAttrs);
+      removeObserver(this, 'renderInPlace', this, this._updatePopper);
+      removeObserver(this, 'eventsEnabled', this, this._updatePopper);
+      removeObserver(this, 'modifiers', this, this._updatePopper);
+      removeObserver(this, 'registerAPI', this, this._updatePopper);
+      removeObserver(this, 'onCreate', this, this._updatePopper);
+      removeObserver(this, 'onUpdate', this, this._updatePopper);
+      removeObserver(this, 'placement', this, this._updatePopper);
+      removeObserver(this, 'popperContainer', this, this._updatePopper);
+      removeObserver(this, 'target', this, this._updatePopper);
     }
 
     const element = this._getPopperElement();
diff --git a/addon/components/ember-popper-base.js b/addon/components/ember-popper-base.js
index 5a84389..102a356 100644
--- a/addon/components/ember-popper-base.js
+++ b/addon/components/ember-popper-base.js
@@ -151,13 +151,7 @@ export default class EmberPopperBase extends Component {
 
   // ================== LIFECYCLE HOOKS ==================
 
-  didUpdateAttrs() {
-    this._updatePopper();
-  }
-
-  didInsertElement() {
-    super.didInsertElement(...arguments);
-
+  didRender() {
     this._updatePopper();
   }
 
@@ -301,7 +295,6 @@ export default class EmberPopperBase extends Component {
       // bootstrap the public API with fields that are guaranteed to be static,
       // such as imperative actions
       this._publicAPI = {
-        popperElement: this._getPopperElement(),
         update: this.update.bind(this),
         scheduleUpdate: this.scheduleUpdate.bind(this),
         enableEventListeners: this.enableEventListeners.bind(this),
@@ -309,6 +302,7 @@ export default class EmberPopperBase extends Component {
       };
     }
 
+    this._publicAPI.popperElement = this._getPopperElement();
     this._publicAPI.popperTarget = this._popperTarget;
 
     return this._publicAPI;
diff --git a/tests/dummy/app/controllers/application.js b/tests/dummy/app/controllers/application.js
index 02e487b..03c01bf 100644
--- a/tests/dummy/app/controllers/application.js
+++ b/tests/dummy/app/controllers/application.js
@@ -1,11 +1,16 @@
 import Controller from '@ember/controller';
 
 export default Controller.extend({
+  eventsEnabled: true,
   showTargetedPopper: true,
 
   actions: {
     toggleShowTargetedPopper() {
       this.toggleProperty('showTargetedPopper');
+    },
+
+    toggleEventsEnabled() {
+      this.toggleProperty('eventsEnabled');
     }
   }
 });
diff --git a/tests/dummy/app/templates/application.hbs b/tests/dummy/app/templates/application.hbs
index 1d0d827..8a4889f 100644
--- a/tests/dummy/app/templates/application.hbs
+++ b/tests/dummy/app/templates/application.hbs
@@ -1,6 +1,6 @@
 <div class="row">
   <div class="left">
-    {{#ember-popper class="popper"}}
+    {{#ember-popper id='parent' class='popper' eventsEnabled=eventsEnabled}}
       Hello from the left! I have no explicit target.
       <div class="popper-arrow" x-arrow></div>
 
@@ -26,4 +26,9 @@
   {{/ember-popper}}
 {{/if}}
 
-<button {{action "toggleShowTargetedPopper"}}>toggle show targeted popper</button>
+<div class="row">
+  <button {{action "toggleShowTargetedPopper"}}>toggle show targeted popper</button>
+</div>
+<div class="row">
+  <button {{action "toggleEventsEnabled"}}>toggle eventsEnabled on parent popper</button>
+</div>
diff --git a/yarn.lock b/yarn.lock
index 1799041..940ae47 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2513,7 +2513,7 @@ ember-hash-helper-polyfill@^0.1.2:
     ember-cli-babel "^5.1.7"
     ember-cli-version-checker "^1.2.0"
 
-ember-legacy-class-transform@^0.1.2:
+ember-legacy-class-transform@^0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/ember-legacy-class-transform/-/ember-legacy-class-transform-0.1.3.tgz#af943fd46aa050981b7f0927bf70ef8736878682"
   dependencies: