Nested link-tos cause broken active states (beta, canary)

[mixonic]

Using nested link-to, ala this common omg-using-bootstrap pattern:

{{#link-to 'cats' tagName="li"}}
  {{link-to "Cats Page" "cats"}}
{{/link-to}}

Causes broken active states in beta and canary. See: http://emberjs.jsbin.com/pejavu/4/edit?html,css,js

This is a regression from 1.10 (broken in 1.11.0-beta.1). It seems that when the currentWhen is compared to the states on the jsRouter that those states still reflect a loading state. For example:

We've seen a variety of manifestations, including active not being set and ember-transitioning-in and ember-transitioning-out being stuck on.

[bantic]

This jsbin might be helpful. It makes a distinction between the outer nested links (no underline) and the inner nested links (underlined) and you can see that if you always click the outer nested links the correct behavior is observed.

http://jsbin.com/sowuja/2

(edit linked bin)

[rwjblue]

Duplicate of #10366.

[mixonic]

Closing as a dupe!

[alexspeller]

An alternative solution is https://github.com/alexspeller/ember-cli-active-link-wrapper