Skip to content

Commit

Permalink
Merge pull request #12027 from rwjblue/remove-deprecated-template-acc…
Browse files Browse the repository at this point in the history 
…ess-from-component

[CLEANUP beta] Remove deprecated `template` access in Ember.Component.
  • Loading branch information
@rwjblue
rwjblue committed Aug 9, 2015
2 parents bccb1e0 + e71d6a8 commit d2c181e
Show file tree
Hide file tree
Showing 7 changed files with 15 additions and 399 deletions.
88 changes: 8 additions & 80 deletions packages/ember-htmlbars/lib/node-managers/component-node-manager.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,25 +66,15 @@ ComponentNodeManager.create = function(renderNode, env, options) {
createOptions._controller = getValue(parentScope.locals.controller);
}

// this flag is set when a block was provided so that components can see if
// `this.get('template')` is truthy. this is added for backwards compat only
// and accessing `template` prop on a component will trigger a deprecation
// 2.0TODO: remove
if (templates.default) {
createOptions._deprecatedFlagForBlockProvided = true;
}

let proto = extractPositionalParams(renderNode, component, params, attrs);
extractPositionalParams(renderNode, component, params, attrs);

// Instantiate the component
component = createComponent(component, isAngleBracket, createOptions, renderNode, env, attrs, proto);
component = createComponent(component, isAngleBracket, createOptions, renderNode, env, attrs);

// If the component specifies its template via the `layout` or `template`
// If the component specifies its template via the `layout`
// properties instead of using the template looked up in the container, get
// them now that we have the component instance.
let result = extractComponentTemplates(component, templates);
layout = result.layout || layout;
templates = result.templates || templates;
layout = get(component, 'layout') || layout;


let results = buildComponentTemplate(
Expand All @@ -96,27 +86,10 @@ ComponentNodeManager.create = function(renderNode, env, options) {

function extractPositionalParams(renderNode, component, params, attrs) {
let positionalParams = component.positionalParams;
let proto;

if (!positionalParams) {
proto = component.proto();
positionalParams = proto.positionalParams;

Ember.deprecate(
'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` ' +
'is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });',
!positionalParams,
{ id: 'ember-htmlbars.component-positional-params', until: '2.0.0' }
);
}

if (positionalParams) {
processPositionalParams(renderNode, positionalParams, params, attrs);
}

// returns `proto` here so that we can avoid doing this
// twice for each initial render per component (it is also needed in `createComponent`)
return proto;
}

function processPositionalParams(renderNode, positionalParams, params, attrs) {
Expand Down Expand Up @@ -148,52 +121,6 @@ function processPositionalParams(renderNode, positionalParams, params, attrs) {
}
}

function extractComponentTemplates(component, _templates) {
// Even though we looked up a layout from the container earlier, the
// component may specify a `layout` property that overrides that.
// The component may also provide a `template` property we should
// respect (though this behavior is deprecated).
let componentLayout = get(component, 'layout');
let hasBlock = _templates && _templates.default;
let layout, templates, componentTemplate;
if (hasBlock) {
componentTemplate = null;
} else if (component.isComponent) {
componentTemplate = get(component, '_template');
} else {
componentTemplate = get(component, 'template');
}

if (componentLayout) {
layout = componentLayout;
templates = extractLegacyTemplate(_templates, componentTemplate);
} else if (componentTemplate) {
// If the component has a `template` but no `layout`, use the template
// as the layout.
layout = componentTemplate;
templates = _templates;
Ember.deprecate('Using deprecated `template` property on a Component.', false, { id: 'ember-htmlbars.extract-component-templates', until: '3.0.0' });
}

return { layout, templates };
}

// 2.0TODO: Remove legacy behavior
function extractLegacyTemplate(_templates, componentTemplate) {
let templates;

// There is no block template provided but the component has a
// `template` property.
if ((!_templates || !_templates.default) && componentTemplate) {
Ember.deprecate('Using deprecated `template` property on a Component.', false, { id: 'ember-htmlbars.extract-legacy-template', until: '3.0.0' });
templates = { default: componentTemplate.raw };
} else {
templates = _templates;
}

return templates;
}

function configureTagName(attrs, tagName, component, isAngleBracket, createOptions) {
if (isAngleBracket) {
createOptions.tagName = tagName;
Expand Down Expand Up @@ -277,12 +204,13 @@ ComponentNodeManager.prototype.destroy = function() {
component.destroy();
};

export function createComponent(_component, isAngleBracket, _props, renderNode, env, attrs = {}, proto = _component.proto()) {
export function createComponent(_component, isAngleBracket, _props, renderNode, env, attrs = {}) {
let props = assign({}, _props);

if (!isAngleBracket) {
let hasSuppliedController = 'controller' in attrs; // 2.0TODO remove
Ember.deprecate('controller= is deprecated', !hasSuppliedController, { id: 'ember-htmlbars.create-component', until: '3.0.0' });
let proto = _component.proto();

Ember.assert('controller= is no longer supported', !('controller' in attrs));

let snapshot = takeSnapshot(attrs);
props.attrs = snapshot;
Expand Down
14 changes: 5 additions & 9 deletions packages/ember-htmlbars/lib/node-managers/view-node-manager.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,14 +58,6 @@ ViewNodeManager.create = function(renderNode, env, attrs, found, parentView, pat
let layout = get(component, 'layout');
if (layout) {
componentInfo.layout = layout;
if (!contentTemplate) {
let template = getTemplate(component);

if (template) {
Ember.deprecate('Using deprecated `template` property on a ' + (component.isView ? 'View' : 'Component') + '.', false, { id: 'ember-htmlbars.view-node-manager-create', until: '3.0.0' });
contentTemplate = template.raw;
}
}
} else {
componentInfo.layout = getTemplate(component) || componentInfo.layout;
}
Expand Down Expand Up @@ -151,7 +143,11 @@ ViewNodeManager.prototype.destroy = function() {
};

function getTemplate(componentOrView) {
return componentOrView.isComponent ? get(componentOrView, '_template') : get(componentOrView, 'template');
if (!componentOrView.isComponent) {
return get(componentOrView, 'template');
}

return null;
}

export function createOrUpdateComponent(component, options, createOptions, renderNode, env, attrs = {}) {
Expand Down
199 changes: 0 additions & 199 deletions packages/ember-htmlbars/tests/integration/component_invocation_test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -250,61 +250,6 @@ QUnit.test('with ariaRole specified', function() {
equal(view.$('#aria-test').attr('role'), 'main', 'role attribute is applied');
});

QUnit.test('`template` is true when block supplied', function() {
expect(3);

let innerComponent;
registry.register('component:with-block', Component.extend({
init() {
this._super(...arguments);
innerComponent = this;
}
}));

view = EmberView.extend({
template: compile('{{#with-block}}In template{{/with-block}}'),
container: container
}).create();

runAppend(view);

equal(jQuery('#qunit-fixture').text(), 'In template');

let template;
expectDeprecation(function() {
template = get(innerComponent, 'template');
}, /Accessing 'template' in .+ is deprecated. To determine if a block was specified to .+ please use '{{#if hasBlock}}' in the components layout./);


ok(template, 'template property is truthy when a block was provided');
});

QUnit.test('`template` is false when no block supplied', function() {
expect(2);

let innerComponent;
registry.register('component:without-block', Component.extend({
init() {
this._super(...arguments);
innerComponent = this;
}
}));

view = EmberView.extend({
template: compile('{{without-block}}'),
container: container
}).create();

runAppend(view);

let template;
expectDeprecation(function() {
template = get(innerComponent, 'template');
}, /Accessing 'template' in .+ is deprecated. To determine if a block was specified to .+ please use '{{#if hasBlock}}' in the components layout./);

ok(!template, 'template property is falsey when a block was not provided');
});

QUnit.test('`template` specified in a component is overridden by block', function() {
expect(1);

Expand All @@ -323,25 +268,6 @@ QUnit.test('`template` specified in a component is overridden by block', functio
equal(view.$().text(), 'Whoop, whoop!', 'block provided always overrides template property');
});

QUnit.test('template specified inline is available from Views looked up as components', function() {
expect(2);

registry.register('component:without-block', EmberView.extend({
template: compile('Whoop, whoop!')
}));

view = EmberView.extend({
template: compile('{{without-block}}'),
container: container
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Using deprecated `template` property on a Component.');

equal(view.$().text(), 'Whoop, whoop!', 'template inline works properly');
});

QUnit.test('hasBlock is true when block supplied', function() {
expect(1);

Expand Down Expand Up @@ -402,103 +328,6 @@ QUnit.test('hasBlockParams is false when no block param supplied', function() {
equal(jQuery('#qunit-fixture').text(), 'In block No Block Param!');
});

QUnit.test('static named positional parameters [DEPRECATED]', function() {
registry.register('template:components/sample-component', compile('{{attrs.name}}{{attrs.age}}'));
registry.register('component:sample-component', Component.extend({
positionalParams: ['name', 'age']
}));

view = EmberView.extend({
layout: compile('{{sample-component "Quint" 4}}'),
container: container
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });');

equal(jQuery('#qunit-fixture').text(), 'Quint4');
});

QUnit.test('dynamic named positional parameters [DEPRECATED]', function() {
registry.register('template:components/sample-component', compile('{{attrs.name}}{{attrs.age}}'));
registry.register('component:sample-component', Component.extend({
positionalParams: ['name', 'age']
}));

view = EmberView.extend({
layout: compile('{{sample-component myName myAge}}'),
container: container,
context: {
myName: 'Quint',
myAge: 4
}
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });');

equal(jQuery('#qunit-fixture').text(), 'Quint4');
run(function() {
set(view.context, 'myName', 'Edward');
set(view.context, 'myAge', '5');
});

equal(jQuery('#qunit-fixture').text(), 'Edward5');
});

QUnit.test('static arbitrary number of positional parameters [DEPRECATED]', function() {
registry.register('template:components/sample-component', compile('{{#each attrs.names as |name|}}{{name}}{{/each}}'));
registry.register('component:sample-component', Component.extend({
positionalParams: 'names'
}));

view = EmberView.extend({
layout: compile('{{sample-component "Foo" 4 "Bar" id="args-3"}}{{sample-component "Foo" 4 "Bar" 5 "Baz" id="args-5"}}{{component "sample-component" "Foo" 4 "Bar" 5 "Baz" id="helper"}}'),
container: container
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });');


equal(view.$('#args-3').text(), 'Foo4Bar');
equal(view.$('#args-5').text(), 'Foo4Bar5Baz');
equal(view.$('#helper').text(), 'Foo4Bar5Baz');
});

QUnit.test('dynamic arbitrary number of positional parameters [DEPRECATED]', function() {
registry.register('template:components/sample-component', compile('{{#each attrs.names as |name|}}{{name}}{{/each}}'));
registry.register('component:sample-component', Component.extend({
positionalParams: 'names'
}));

view = EmberView.extend({
layout: compile('{{sample-component user1 user2 id="direct"}}{{component "sample-component" user1 user2 id="helper"}}'),
container: container,
context: {
user1: 'Foo',
user2: 4
}
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });');

equal(view.$('#direct').text(), 'Foo4');
equal(view.$('#helper').text(), 'Foo4');
run(function() {
set(view.context, 'user1', 'Bar');
set(view.context, 'user2', '5');
});

equal(view.$('#direct').text(), 'Bar5');
equal(view.$('#helper').text(), 'Bar5');
});

QUnit.test('static named positional parameters', function() {
var SampleComponent = Component.extend();
SampleComponent.reopenClass({
Expand Down Expand Up @@ -647,34 +476,6 @@ QUnit.test('moduleName is available on _renderNode when no layout is present', f
});

if (isEnabled('ember-htmlbars-component-helper')) {
QUnit.test('{{component}} helper works with positional params [DEPRECATED]', function() {
registry.register('template:components/sample-component', compile('{{attrs.name}}{{attrs.age}}'));
registry.register('component:sample-component', Component.extend({
positionalParams: ['name', 'age']
}));

view = EmberView.extend({
layout: compile('{{component "sample-component" myName myAge}}'),
container: container,
context: {
myName: 'Quint',
myAge: 4
}
}).create();

expectDeprecation(function() {
runAppend(view);
}, 'Calling `var Thing = Ember.Component.extend({ positionalParams: [\'a\', \'b\' ]});` is deprecated in favor of `Thing.reopenClass({ positionalParams: [\'a\', \'b\'] });');

equal(jQuery('#qunit-fixture').text(), 'Quint4');
run(function() {
set(view.context, 'myName', 'Edward');
set(view.context, 'myAge', '5');
});

equal(jQuery('#qunit-fixture').text(), 'Edward5');
});

QUnit.test('{{component}} helper works with positional params', function() {
var SampleComponent = Component.extend();
SampleComponent.reopenClass({
Expand Down
2 changes: 1 addition & 1 deletion packages/ember-metal-views/lib/renderer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ Renderer.prototype.prerenderTopLevelView =
view._renderNode = renderNode;

var layout = get(view, 'layout');
var template = view.isComponent ? get(view, '_template') : get(view, 'template');
var template = get(view, 'template');

var componentInfo = { component: view, layout: layout };

Expand Down
Loading

0 comments on commit d2c181e

Please sign in to comment.