portal-tag-name support to PortForComponent

addon/components/portal-for.js

@@ -6,12 +6,14 @@ export default Ember.Component.extend({
 
   'portal-class': null,
 
+  'portal-tag-name': 'div',
+
   portalElement() {
     const elementID = portalIdForName(this.get("name"));
     let element = document.getElementById(elementID);
 
     if (!element) {
-      element = document.createElement('div');
+      element = document.createElement(this.get('portal-tag-name'));
       element.id = elementID;
     }
 

bower.json

@@ -9,7 +9,7 @@
     "ember-qunit": "0.4.9",
     "ember-qunit-notifications": "0.0.7",
     "ember-resolver": "~0.1.18",
-    "jquery": "^1.11.3",
+    "jquery": "1.11.3",
     "loader.js": "ember-cli/loader.js#3.2.1",
     "qunit": "~1.18.0"
   }

tests/acceptance/portal-test.js

@@ -21,6 +21,10 @@ test('visiting /', function(assert) {
     assert.equal(find(".header").length, 1, 'Has 1 header');
     assert.equal(find(".footer").length, 1, 'Has 1 footer');
 
+    assert.equal(find("#title > span > span.title-portal").text().trim(), 
+      "example", 
+      "Shows the correct title");
+
     assert.equal(find("#examples-header").length, 1, 'Shows the example header');
     assert.equal(find("#examples-footer").length, 1, 'Shows the example footer');
   });
@@ -33,6 +37,10 @@ test('visiting /foo', function(assert) {
     assert.equal(find(".header").length, 1, 'Has 1 header');
     assert.equal(find(".footer").length, 1, 'Has 1 footer');
 
+    assert.equal(find("#title > span > span.title-portal").text().trim(), 
+      "foo", 
+      "Shows the correct title");
+
     assert.equal(find("#foo-header").length, 1, 'Shows the foo header');
     assert.equal(find("#examples-footer").length, 1, 'Shows the example footer');
   });
@@ -46,6 +54,10 @@ test('visiting /bar', function(assert) {
     assert.equal(find(".header").length, 1, 'Has 1 header');
     assert.equal(find(".footer").length, 1, 'Has 1 footer');
 
+    assert.equal(find("#title > span > span.title-portal").text().trim(), 
+      "bar", 
+      "Shows the correct title");
+
     assert.equal(find("#examples-header").length, 1, 'Shows the example header');
     assert.equal(find("#bar-footer").length, 1, 'Shows the bar footer');
   });
@@ -58,6 +70,10 @@ test('visiting /bar/baz', function(assert) {
     assert.equal(find(".header").length, 1, 'Has 1 header');
     assert.equal(find(".footer").length, 1, 'Has 1 footer');
 
+    assert.equal(find("#title > span > span.title-portal").text().trim(), 
+      "baz", 
+      "Shows the correct title");
+
     assert.equal(find("#baz-header").length, 1, 'Shows the baz header');
     assert.equal(find("#baz-footer").length, 1, 'Shows the baz footer');
   });

tests/dummy/app/templates/application.hbs

@@ -1,7 +1,9 @@
 <div class="section">
   <span class="template-name">application.hbs</span>
 
-  <h2 id="title">ember-portal</h2>
+  <h2 id="title">
+    ember-portal {{portal-for name="title-append" tagName="span" portal-tag-name="span" portal-class="title-portal"}}
+  </h2>
 
   <div class="info">
     <p>Render content to portals on the page &amp; override them in child templates.</p>

tests/dummy/app/templates/example.hbs

@@ -1,6 +1,10 @@
 <div class="section">
   <span class="template-name">example.hbs</span>
 
+  {{#portal-content for="title-append"}}
+    example
+  {{/portal-content}}
+
   {{#portal-content for="header"}}
     <div id="examples-header" class="header">
       Examples Header - defined in example.hbs

tests/dummy/app/templates/example/bar.hbs

@@ -1,6 +1,10 @@
 <div class="section">
   <span class="template-name">example/bar.hbs</span>
 
+  {{#portal-content for="title-append"}}
+    bar
+  {{/portal-content}}
+
   {{#portal-content for="footer"}}
     <div id="bar-footer" class="footer">
       Bar Footer - defined in example/bar.hbs

tests/dummy/app/templates/example/bar/baz.hbs

@@ -1,6 +1,10 @@
 <div class="section">
   <span class="template-name">example/bar/baz.hbs</span>
 
+  {{#portal-content for="title-append"}}
+    baz
+  {{/portal-content}}
+
   {{#portal-content for="header"}}
     <div id="baz-header" class="header">
       Baz Header - defined in example/bar/baz.hbs

tests/dummy/app/templates/example/foo.hbs

@@ -1,6 +1,10 @@
 <div class="section">
   <span class="template-name">example/foo.hbs</span>
 
+  {{#portal-content for="title-append"}}
+    foo
+  {{/portal-content}}
+
   {{#portal-content for="header"}}
     <div id="foo-header" class="header">
       Foo Header - defined in example/foo.hbs