ember-component-inbound-actions
ember-component-inbound-actions copied to clipboard
Binding the actionReceiver of a component breaks concatenatedProperties
Have a component like this:
my-component.js
import Ember from 'ember';
import InboundActions from 'ember-component-inbound-actions/inbound-actions';
export default Ember.Component.extend(InboundActions, {
concatenatedProperties: ['x'],
x: ['A'],
classNames: ['A'],
});
my-component.hbs
<h2>{{caseDescription}}</h2>
x: {{x}}
<br>
classNames: {{classNames}}
And use it like this:
application.hbs
{{my-component
caseDescription="without binding the actionReceiver"
x="B"
classNames="B"
}}
{{my-component
caseDescription="with binding the actionReceiver"
x="B"
classNames="B"
actionReceiver=actionReceiver
}}
Then the rendered result will be this:
without binding the actionReceiver
x: A,B
classNames: A,B
with binding the actionReceiver
x: B
classNames: B
That is, binding the the actionReceiver to the outer context causes the concatenatedProperties to not work.
Twiddle demonstrating the error: https://ember-twiddle.com/c7842938c40eb9118db2a45e8f4f1292