Fixes nested wormholes and adds tests

.travis.yml

@@ -19,6 +19,7 @@ env:
 matrix:
   fast_finish: true
   allow_failures:
+    - env: EMBER_TRY_SCENARIO=ember-beta
     - env: EMBER_TRY_SCENARIO=ember-canary
 
 before_install:

addon/components/liquid-wormhole.js

@@ -27,16 +27,18 @@ const LiquidWormhole = Ember.Component.extend({
 
   didInsertElement() {
     const parentWormhole = this.nearestOfType(LiquidWormhole);
+    const childWormholes = this.get('childWormholes');
     const liquidTargetService = this.get('liquidTargetService');
 
-    if (parentWormhole) {
+    this._target = this.get('liquidTarget');
+
+    if (parentWormhole && parentWormhole._state !== 'inDOM') {
       parentWormhole.get('childWormholes').unshiftObject(this);
+      parentWormhole.get('childWormholes').unshiftObjects(childWormholes);
     } else {
-      this._target = this.get('liquidTarget');
-
       liquidTargetService.appendItem(this._target, this);
-
-      this.get('childWormholes').forEach((wormhole) => liquidTargetService.appendItem(wormhole._target, wormhole));
+      
+      childWormholes.forEach((wormhole) => liquidTargetService.appendItem(wormhole._target, wormhole));
     }
 
     this._super.apply(this, arguments);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "liquid-wormhole",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "Wormholes with the power of Liquid Fire",
   "directories": {
     "doc": "doc",

tests/acceptance/demo.js → tests/acceptance/demo-test.js

@@ -1,4 +1,4 @@
-/* global ranTetherTransition, noTransitionsYet */
+/* global ranTransition, noTransitionsYet */
 import { startApp, destroyApp } from '../helpers/app-lifecycle';
 import { injectTransitionSpies } from '../helpers/integration';
 
@@ -46,13 +46,13 @@ test('basic liquid-wormhole works correctly and can determine context', function
 
   click('#flyout-button');
   andThen(() => {
-    equal(find('.liquid-target-container .liquid-tether').length, 1, 'it exists');
-    ranTetherTransition('to-left');
+    equal(find('.liquid-target-container .flyout').length, 1, 'it exists');
+    ranTransition('explode');
   });
 
   click('#flyout-button');
   andThen(() => {
-    equal(find('.liquid-target-container .liquid-tether').length, 'it exists');
-    ranTetherTransition('to-right');
+    equal(find('.liquid-target-container .flyout').length, 0, 'it closed');
+    ranTransition('explode');
   });
 });

tests/acceptance/scenarios-test.js

@@ -0,0 +1,31 @@
+import { startApp, destroyApp } from '../helpers/app-lifecycle';
+
+let app;
+
+module('Acceptance: Scenarios', {
+  setup: function() {
+    app = startApp();
+  },
+
+  teardown: function() {
+    destroyApp(app);
+  }
+});
+
+test('nested tethers work properly', function() {
+  visit('/scenarios/nested-wormholes');
+
+  click('button');
+
+  andThen(() => {
+    const targets = $('.liquid-target-container').children();
+
+    const outerWormhole = targets.eq(0);
+    const middleWormhole = targets.eq(1);
+    const innerWormhole = targets.eq(2);
+
+    ok(outerWormhole.hasClass('outer-wormhole-liquid-target'), 'Outer wormhole renders in correct order');
+    ok(middleWormhole.hasClass('middle-wormhole-liquid-target'), 'Middle wormhole renders in correct order');
+    ok(innerWormhole.hasClass('inner-wormhole-liquid-target'), 'Inner wormhole renders in correct order');
+  });
+});

tests/dummy/app/controllers/scenarios/nested-wormholes.js

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    showInner() {
+      this.toggleProperty('showingInner');
+    }
+  }
+});

tests/dummy/app/router.js

@@ -8,6 +8,9 @@ const Router = Ember.Router.extend({
 Router.map(function() {
   this.route('basics');
   this.route('examples');
+  this.route('scenarios', function() {
+    this.route('nested-wormholes');
+  });
 });
 
 export default Router;

tests/dummy/app/templates/scenarios.hbs

@@ -0,0 +1 @@
+{{outlet}}

tests/dummy/app/templates/scenarios/nested-wormholes.hbs

@@ -0,0 +1,21 @@
+{{#liquid-wormhole to="outer-wormhole"}}
+  <div class="green-box">
+    Outer Wormhole
+
+    {{#liquid-wormhole to="middle-wormhole"}}
+      <div class="blue-box">
+        Middle Wormhole
+
+        <button {{action "showInner"}}>Show</button>
+
+        {{#if showingInner}}
+          {{#liquid-wormhole to="inner-wormhole"}}
+            <div class="red-box">
+              Inner Wormhole
+            </div>
+          {{/liquid-wormhole}}
+        {{/if}}
+      </div>
+    {{/liquid-wormhole}}
+  </div>
+{{/liquid-wormhole}}

tests/helpers/app-lifecycle.js

@@ -0,0 +1,25 @@
+import Ember from 'ember';
+import Application from '../../app';
+import config from '../../config/environment';
+
+export default startApp;
+
+export function startApp(attrs) {
+  var application;
+
+  var attributes = Ember.merge({}, config.APP);
+  attributes = Ember.merge(attributes, attrs); // use defaults, but you can override;
+
+  Ember.run(function() {
+    application = Application.create(attributes);
+    application.setupForTesting();
+    application.injectTestHelpers();
+  });
+
+  return application;
+}
+
+export function destroyApp(app) {
+  Ember.run(app, 'destroy');
+  Ember.$('.liquid-target-container').remove();
+}