diff --git a/addon/components/island-outlet.js b/addon/components/island-outlet.js
new file mode 100644
index 0000000..c911091
--- /dev/null
+++ b/addon/components/island-outlet.js
@@ -0,0 +1,30 @@
+import Ember from 'ember';
+import WormholeComponent from 'ember-wormhole/components/ember-wormhole';
+
+const {
+ assert,
+ Component,
+ computed,
+ getOwner,
+ guidFor
+} = Ember;
+
+const Outlet = WormholeComponent.extend({
+ classNames: ['island-outlet'],
+ destinationElement: computed('outletName', {
+ get() {
+ let name = this.get('outletName');
+ assert('An outlet name is mandatory', name);
+ let $element = $(`[data-outlet="${name}"]`);
+ assert(`No outlet found with the name "${name}"`, $element.length !== 0);
+ assert(`Multiple outlets with the name "${name}"`, $element.length === 1);
+ return $element.get(0);
+ }
+ }).readOnly()
+});
+
+Outlet.reopenClass({
+ positionalParams: ['outletName']
+});
+
+export default Outlet;
diff --git a/app/components/island-outlet.js b/app/components/island-outlet.js
new file mode 100644
index 0000000..4a3db6e
--- /dev/null
+++ b/app/components/island-outlet.js
@@ -0,0 +1 @@
+export { default } from 'ember-islands/components/island-outlet';
\ No newline at end of file
diff --git a/package.json b/package.json
index 2c5a9b6..d8c24c5 100644
--- a/package.json
+++ b/package.json
@@ -41,7 +41,8 @@
"ujs"
],
"dependencies": {
- "ember-getowner-polyfill": "1.0.0"
+ "ember-getowner-polyfill": "1.0.0",
+ "ember-wormhole": "0.5.0"
},
"ember-addon": {
"configPath": "tests/dummy/config"
diff --git a/tests/dummy/app/index.html b/tests/dummy/app/index.html
index 363095d..35c4a7d 100644
--- a/tests/dummy/app/index.html
+++ b/tests/dummy/app/index.html
@@ -15,6 +15,7 @@
{{content-for 'head-footer'}}
+
{{content-for 'body'}}
Some static content in the index page
diff --git a/tests/dummy/app/templates/application.hbs b/tests/dummy/app/templates/application.hbs
index a62b07b..4a2b3dc 100644
--- a/tests/dummy/app/templates/application.hbs
+++ b/tests/dummy/app/templates/application.hbs
@@ -1 +1,4 @@
{{dummy-application}}
+{{#island-outlet "main"}}
+ Yay
+{{/island-outlet}}
diff --git a/tests/integration/components/island-outlet-test.js b/tests/integration/components/island-outlet-test.js
new file mode 100644
index 0000000..8091c6b
--- /dev/null
+++ b/tests/integration/components/island-outlet-test.js
@@ -0,0 +1,25 @@
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+
+moduleForComponent('island-outlet', 'Integration | Component | island outlet', {
+ integration: true
+});
+
+test('it renders', function(assert) {
+
+ // Set any properties with this.set('myProperty', 'value');
+ // Handle any actions with this.on('myAction', function(val) { ... });" + EOL + EOL +
+
+ this.render(hbs`{{island-outlet}}`);
+
+ assert.equal(this.$().text().trim(), '');
+
+ // Template block usage:" + EOL +
+ this.render(hbs`
+ {{#island-outlet}}
+ template block text
+ {{/island-outlet}}
+ `);
+
+ assert.equal(this.$().text().trim(), 'template block text');
+});