ember-angle-brackets-codemod
ember-angle-brackets-codemod copied to clipboard
Incorrect transformation of use of contextual component variable into a component invocation
{{#power-select search=(perform searchThings)
selected=selectedResult
placeholder="Enter the thing..."
loadingMessage="Searching..."
onchange=(perform selectThing) as |fooResult|}}
<span class="select-description">{{fooResult.attributes.thing-desc}}</span>
{{/power-select}}
transformed to:
<PowerSelect
@search={{perform searchThings}}
@selected={{selectedResult}}
@placeholder="Enter the thing..."
@loadingMessage="Searching..."
@onchange={{perform selectThing}} as |fooResult|>
<span class="select-description"><fooResult.attributes.thing-desc /></span>
</PowerSelect>
Quick question: Isn't it this will be allowed? looking at this ember doc https://guides.emberjs.com/release/upgrading/current-edition/templates/ "Yielded components can also be invoked with angle bracket syntax".
The problem I see is that the codemod doesn't do this consistently
In my example, if the yielded thing were a component, it would be correct and would work. The problem here is that it was not and the result of the codemod was a cryptic error such as "Component Sparkling water from Italy could not be found" that was hard to find the source. Since if it were a component, curly invocation would continue to work, I think the correct thing to do for ambiguous cases would be to leave it alone, and maybe log it.
Haha, ok got it! Yeah I agree with you on that approach