From 9ae03834a1f794a0c11cbc073ef4849aa55ca5fb Mon Sep 17 00:00:00 2001 From: ronco Date: Mon, 15 Feb 2016 21:57:38 -0700 Subject: [PATCH 1/3] Clear fast boot rendered head on browser boot Split initializers into fastboot & browser flavors. Use placeholder meta tags for marking extent of head.hbs content. --- addon/instance-initializers/head.js | 25 ------------------- addon/templates/components/head-layout.hbs | 1 + app/components/head-layout.js | 7 ++++++ app/instance-initializers/browser/head.js | 18 +++++++++++++ app/instance-initializers/fastboot/head.js | 20 +++++++++++++++ app/instance-initializers/head.js | 1 - .../components/head-layout-test.js | 15 +++++++++++ 7 files changed, 61 insertions(+), 26 deletions(-) delete mode 100644 addon/instance-initializers/head.js create mode 100644 addon/templates/components/head-layout.hbs create mode 100644 app/components/head-layout.js create mode 100644 app/instance-initializers/browser/head.js create mode 100644 app/instance-initializers/fastboot/head.js delete mode 100644 app/instance-initializers/head.js create mode 100644 tests/integration/components/head-layout-test.js diff --git a/addon/instance-initializers/head.js b/addon/instance-initializers/head.js deleted file mode 100644 index cf7a238..0000000 --- a/addon/instance-initializers/head.js +++ /dev/null @@ -1,25 +0,0 @@ -export function initialize(instance) { - const container = instance.lookup ? instance : instance.container; - let component; - const renderer = container.lookup('renderer:-dom'); - if (window.FastBoot) { - const componentFactory = - instance._lookupFactory('component:head-content'); - // explicitly set renderer & domhelper in case we're in fastboot - component = componentFactory.create( - instance.ownerInjection(), - { - renderer, - _domHelper: renderer._dom - } - ); - } else { - component = container.lookup('component:head-content'); - } - component.appendTo(renderer._dom.document.head); -} - -export default { - name: 'head', - initialize: initialize -}; diff --git a/addon/templates/components/head-layout.hbs b/addon/templates/components/head-layout.hbs new file mode 100644 index 0000000..8f6c29a --- /dev/null +++ b/addon/templates/components/head-layout.hbs @@ -0,0 +1 @@ +{{head-content}} diff --git a/app/components/head-layout.js b/app/components/head-layout.js new file mode 100644 index 0000000..0495dd6 --- /dev/null +++ b/app/components/head-layout.js @@ -0,0 +1,7 @@ +import Ember from 'ember'; +import layout from 'ember-cli-head/templates/components/head-layout'; + +export default Ember.Component.extend({ + tagName: '', + layout +}); diff --git a/app/instance-initializers/browser/head.js b/app/instance-initializers/browser/head.js new file mode 100644 index 0000000..3e0db8b --- /dev/null +++ b/app/instance-initializers/browser/head.js @@ -0,0 +1,18 @@ +import Ember from 'ember'; + +export function initialize(instance) { + // clear fast booted head (if any) + Ember.$('meta[name="ember-cli-head-start"]') + .nextUntil('meta[name="ember-cli-head-end"] ~') + .addBack() + .remove(); + const container = instance.lookup ? instance : instance.container; + const renderer = container.lookup('renderer:-dom'); + const component = container.lookup('component:head-layout'); + component.appendTo(renderer._dom.document.head); +} + +export default { + name: 'head-browser', + initialize: initialize +}; diff --git a/app/instance-initializers/fastboot/head.js b/app/instance-initializers/fastboot/head.js new file mode 100644 index 0000000..c04d7f3 --- /dev/null +++ b/app/instance-initializers/fastboot/head.js @@ -0,0 +1,20 @@ +export function initialize(instance) { + const container = instance.lookup ? instance : instance.container; + const renderer = container.lookup('renderer:-dom'); + const componentFactory = + instance._lookupFactory('component:head-layout'); + // explicitly set renderer & domhelper since we're in fastboot + const component = componentFactory.create( + instance.ownerInjection(), + { + renderer, + _domHelper: renderer._dom + } + ); + component.appendTo(renderer._dom.document.head); +} + +export default { + name: 'head-fastboot', + initialize: initialize +}; diff --git a/app/instance-initializers/head.js b/app/instance-initializers/head.js deleted file mode 100644 index cea32d4..0000000 --- a/app/instance-initializers/head.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from 'ember-cli-head/instance-initializers/head'; diff --git a/tests/integration/components/head-layout-test.js b/tests/integration/components/head-layout-test.js new file mode 100644 index 0000000..ad35c0a --- /dev/null +++ b/tests/integration/components/head-layout-test.js @@ -0,0 +1,15 @@ +import { moduleForComponent, test } from 'ember-qunit'; +import hbs from 'htmlbars-inline-precompile'; + +moduleForComponent('head-layout', 'Integration | Component | head layout', { + integration: true +}); + +test('it renders', function(assert) { + + this.render(hbs`{{head-layout}}`); + + assert.equal(this.$('meta[name="ember-cli-head-start"]').length, 1); + assert.equal(this.$('meta[name="ember-cli-head-end"]').length, 1); + +}); From 6283e3da1186159791ccb65148bef9f3d56151f4 Mon Sep 17 00:00:00 2001 From: ronco Date: Tue, 16 Feb 2016 21:08:42 -0700 Subject: [PATCH 2/3] runtime initializer cleanup --- app/instance-initializers/browser/head.js | 4 ++-- app/instance-initializers/fastboot/head.js | 3 +-- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/app/instance-initializers/browser/head.js b/app/instance-initializers/browser/head.js index 3e0db8b..d03ba1d 100644 --- a/app/instance-initializers/browser/head.js +++ b/app/instance-initializers/browser/head.js @@ -7,9 +7,9 @@ export function initialize(instance) { .addBack() .remove(); const container = instance.lookup ? instance : instance.container; - const renderer = container.lookup('renderer:-dom'); + // const renderer = container.lookup('renderer:-dom'); const component = container.lookup('component:head-layout'); - component.appendTo(renderer._dom.document.head); + component.appendTo(document.head); } export default { diff --git a/app/instance-initializers/fastboot/head.js b/app/instance-initializers/fastboot/head.js index c04d7f3..8ef6b54 100644 --- a/app/instance-initializers/fastboot/head.js +++ b/app/instance-initializers/fastboot/head.js @@ -1,6 +1,5 @@ export function initialize(instance) { - const container = instance.lookup ? instance : instance.container; - const renderer = container.lookup('renderer:-dom'); + const renderer = instance.lookup('renderer:-dom'); const componentFactory = instance._lookupFactory('component:head-layout'); // explicitly set renderer & domhelper since we're in fastboot From 0f6a1c2c3baf9791acbfd97acc0a59beeb93425a Mon Sep 17 00:00:00 2001 From: ronco Date: Tue, 1 Mar 2016 07:44:29 -0700 Subject: [PATCH 3/3] use fastboot-filter-initializers --- index.js | 6 ++++++ package.json | 1 + 2 files changed, 7 insertions(+) diff --git a/index.js b/index.js index 2e468db..15f1873 100644 --- a/index.js +++ b/index.js @@ -1,9 +1,15 @@ /* jshint node: true */ 'use strict'; +var filterInitializers = require('fastboot-filter-initializers'); + module.exports = { name: 'ember-cli-head', isDevelopingAddon: function() { return true; + }, + + treeForApp: function(tree) { + return filterInitializers(tree); } }; diff --git a/package.json b/package.json index 2a873b4..b41f7e1 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ ], "dependencies": { "ember-cli-htmlbars": "^1.0.1", + "fastboot-filter-initializers": "0.0.1", "ember-cli-babel": "^5.1.5" }, "ember-addon": {