diff --git a/packages/ember-htmlbars/lib/hooks/component.js b/packages/ember-htmlbars/lib/hooks/component.js index 46e1cc3f1ff..6cb90739a40 100644 --- a/packages/ember-htmlbars/lib/hooks/component.js +++ b/packages/ember-htmlbars/lib/hooks/component.js @@ -101,7 +101,6 @@ export default function componentHook(renderNode, env, scope, _tagName, params, // Invoking a component from the outside (either via angle brackets // or {{foo-bar}} legacy curlies). - console.log(`HASH TO CNM`, attrs); var manager = ComponentNodeManager.create(renderNode, env, { tagName, params, diff --git a/packages/ember-htmlbars/lib/keywords/closure-component.js b/packages/ember-htmlbars/lib/keywords/closure-component.js index 1f357bd7e6a..008d4a8eeeb 100644 --- a/packages/ember-htmlbars/lib/keywords/closure-component.js +++ b/packages/ember-htmlbars/lib/keywords/closure-component.js @@ -7,6 +7,7 @@ import { symbol } from 'ember-metal/utils'; import BasicStream from 'ember-metal/streams/stream'; import { read } from 'ember-metal/streams/utils'; import { labelForSubexpr } from 'ember-htmlbars/hooks/subexpr'; +import assign from 'ember-metal/assign'; export const COMPONENT_REFERENCE = symbol('COMPONENT_REFERENCE'); export const COMPONENT_CELL = symbol('COMPONENT_CELL'); @@ -51,7 +52,9 @@ function createClosureComponentCell(env, originalComponentPath, params, hash) { if (componentPath && componentPath[COMPONENT_CELL]) { val = { [COMPONENT_PATH]: componentPath[COMPONENT_PATH], - [COMPONENT_PARAMS]: [] + [COMPONENT_PARAMS]: mergeParams(componentPath[COMPONENT_PARAMS], params), + [COMPONENT_HASH]: mergeHash(componentPath[COMPONENT_HASH], hash), + [COMPONENT_CELL]: true }; } else { val = { @@ -64,3 +67,19 @@ function createClosureComponentCell(env, originalComponentPath, params, hash) { return val; } + +export function mergeParams(original, update) { + // If update has the same or more items than original, we can just return the + // update + if (update.length >= original.length) { + return update; + } else { + let result = update.slice(0); + result.push(...original.slice(update.length)); + return result; + } +} + +export function mergeHash(original, updates) { + return assign(original, updates); +} diff --git a/packages/ember-htmlbars/lib/keywords/element-component.js b/packages/ember-htmlbars/lib/keywords/element-component.js index f3b8835f3ed..30ccfc3fc26 100644 --- a/packages/ember-htmlbars/lib/keywords/element-component.js +++ b/packages/ember-htmlbars/lib/keywords/element-component.js @@ -4,6 +4,8 @@ import { COMPONENT_PATH, COMPONENT_PARAMS, COMPONENT_HASH, + mergeHash, + mergeParams } from './closure-component'; export default { @@ -48,12 +50,8 @@ function render(morph, env, scope, [path, ...params], hash, template, inverse, v if (path && path[COMPONENT_REFERENCE]) { let closureComponent = env.hooks.getValue(path); - console.log(`PARAMS`, params, closureComponent[COMPONENT_PARAMS]); params = mergeParams(closureComponent[COMPONENT_PARAMS], params); - console.log(params); - console.log(`HASH`, hash, closureComponent[COMPONENT_HASH]); hash = mergeHash(closureComponent[COMPONENT_HASH], hash); - console.log(hash); } // If the value passed to the {{component}} helper is undefined or null, @@ -68,15 +66,3 @@ function render(morph, env, scope, [path, ...params], hash, template, inverse, v params, hash, templates, visitor ); } - -function mergeParams(...paramsArray) { - let mergedParams = []; - for (let i = 0; i < paramsArray.length; i++) { - mergedParams.splice(mergedParams.length, 0, ...paramsArray[i]); - } - return mergedParams; -} - -function mergeHash(...hashArray) { - return assign({}, ...hashArray); -} diff --git a/packages/ember-htmlbars/lib/node-managers/component-node-manager.js b/packages/ember-htmlbars/lib/node-managers/component-node-manager.js index 46f1f0d26cc..ea718392c1f 100644 --- a/packages/ember-htmlbars/lib/node-managers/component-node-manager.js +++ b/packages/ember-htmlbars/lib/node-managers/component-node-manager.js @@ -65,9 +65,7 @@ ComponentNodeManager.create = function ComponentNodeManager_create(renderNode, e createOptions._controller = getValue(parentScope.getLocal('controller')); } - console.log(`before extractPositionalParams`, component, params, attrs); extractPositionalParams(renderNode, component, params, attrs); - console.log(`after extractPositionalParams`, component, params, attrs); // Instantiate the component component = createComponent(component, isAngleBracket, createOptions, renderNode, env, attrs); diff --git a/packages/ember-htmlbars/tests/helpers/closure_component_test.js b/packages/ember-htmlbars/tests/helpers/closure_component_test.js index ff9298c088f..d3c24e72fdd 100644 --- a/packages/ember-htmlbars/tests/helpers/closure_component_test.js +++ b/packages/ember-htmlbars/tests/helpers/closure_component_test.js @@ -131,4 +131,52 @@ if (Ember.FEATURES.isEnabled('ember-contextual-components')) { equal(component.$().text(), `Hodi`, 'greeting is bound'); }); + + QUnit.test('nested components overwrites named positional parameters', function() { + let LookedUp = Component.extend(); + LookedUp.reopenClass({ + positionalParams: ['name', 'age'] + }); + registry.register( + 'component:-looked-up', + LookedUp + ); + registry.register( + 'template:components/-looked-up', + compile(`{{name}} {{age}}`) + ); + + let template = compile( + `{{component + (component (component "-looked-up" "Sergio" 28) + "Marvin" 21) + "Hodari"}}` + ); + component = Component.extend({ container, template }).create(); + + runAppend(component); + equal(component.$().text(), 'Hodari 21', '-looked-up component rendered'); + }); + + QUnit.test('nested components overwrites hash parameters', function() { + registry.register( + 'template:components/-looked-up', + compile(`{{greeting}} {{name}} {{age}}`) + ); + + let template = compile( + `{{component (component (component "-looked-up" + greeting="Hola" name="Dolores" age=33) + greeting="Hej" name="Sigmundur") + greeting=greeting}}` + ); + component = Component.extend({ container, template, greeting: 'Hodi' }).create(); + + runAppend(component); + + equal(component.$().text(), 'Hodi Sigmundur 33', '-looked-up component rendered'); + }); + + // Avoid assertions + // Add tests for bound properties }