{{x-toggle}} inside of an extended `Ember.LinkComponent`

[Alex DiLiberto]

Here's a twiddle to reproduce: https://ember-twiddle.com/9da214f0f7e16f84041b3bee2fc1c055

It's a bit of an edge case but intuitively I would expect that it works.

You render a {{x-toggle}} inside of a parent component. The parent component in this case is export default Ember.LinkComponent.extend. I created another dummy component which has 2 click handlers to show that those fire under similar conditions.

In this twiddle the x-toggle/component#sendToggle() action is never triggered when rendered inside of the LinkComponent

NOTE: This behavior was working previously with a similar setup. In the twiddle change the version to "ember-cli-toggle": "3.0.0" and change the action to onToggle=(mut val) instead of onToggle=(action (mut val)) and it works as expected

[Ilya Radchenko]

Sounds like an edge case that shouldn't be fixed. Instead of extending the LinkComponent you should be using https://github.com/rwjblue/ember-router-service-polyfill and the router service when it's available. And really, it should be a wrapper component that contains the link and toggle side by side.

Let me know if that's a sufficient work around for you. Otherwise, I can look into it.

[Ilya Radchenko]

If there is a reason that you cannot use the above workaround, please leave a comment and we can figure out something. Otherwise, I'm closing this since there is no activity.