Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[CLEANUP beta] Remove deprecated template access in Ember.Component. #12027

Merged
merged 5 commits into from
Aug 9, 2015
Merged

[CLEANUP beta] Remove deprecated template access in Ember.Component. #12027

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
3f1614c
[CLEANUP beta] Remove deprecated `template` access in Ember.Component.
rwjblue Aug 8, 2015
5030271
[CLEANUP beta] Ensure `{{foo-bar controller=blah}}` triggers an asser…
rwjblue Aug 8, 2015
1d13015
[CLEANUP beta] Remove `positionalParams` specified to `.extend`.
rwjblue Aug 9, 2015
a5b5213
[CLEANUP beta] Remove support for specifying `template` in a component.
rwjblue Aug 9, 2015
e71d6a8
[CLEANUP beta] Remove template CP on `Ember.Component`.
rwjblue Aug 9, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
88 changes: 8 additions & 80 deletions packages/ember-htmlbars/lib/node-managers/component-node-manager.js
View file
Open in desktop
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));
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You are a kinder man than I


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
Open in desktop
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
Open in desktop
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
Open in desktop
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