Support native components with event handlers

[simonihmig]

Fixes #42, at least for native components.

Needs #43 and #44 to be merged first. Other than that this should be ready.

[jelhan]

Noticed a small bug when running it against Ember Bootstrap.

The event handlers are not converted to lower case. @ember/component API uses camel cased versions of the event types (e.g. keyPress) but {{on}} helper expects the event type in same spelling as it could be passed to addEventListener. So it should be keypress for the example above.

@tagName('form')
export default MyComponent extends Component {
  keyPress() {
    // ...
  }
}

is transformed to

<form {{on "keyPress" this.handleKeyPress}}>
</form>

but should be

<form {{on "keypress" this.handleKeyPress}}>
</form>

It might be enough to call toLowerCase() on eventName here: https://github.com/simonihmig/tagless-ember-components-codemod/blob/a7275a2d98834530b284fb7e6067feb81237f5e5/lib/transform/template.js#L56

[simonihmig]

The event handlers are not converted to lower case

Ah, good catch, thanks @jelhan! Fixed it!

[simonihmig]

@Turbo87 thanks for merging the other PR. I rebased this, should be ready now as well! Don't want you to feel bored! 😉

[Turbo87]

@simonihmig sorry the radio silence.

can you add this as a CLI option? maybe something like --transform-event-handlers? due to the mentioned caveats I think we probably shouldn't enable it by default.

[simonihmig]

due to the mentioned caveats I think we probably shouldn't enable it by default.

@Turbo87 sorry, I might have forgotten as some time has passed, but which caveats are you referring to?

[Turbo87]

but which caveats are you referring to?

I was talking about the second point of https://github.com/ember-codemods/tagless-ember-components-codemod#known-caveats

I've unfortunately seen several codebases already that did something like that :-/

Luckily, there is https://github.com/ember-template-lint/ember-template-lint/blob/master/docs/rule/no-passed-in-event-handlers.md now, that catches this issue, but probably not everyone is using that yet.