Why do action helpers in a form displayed via render resolve to the parent first instead of the child


I have this jsfiddle, I am using the render helper to display a child in the parent template but the events declared in the child route and called in the child’s form using the action helper is first resolving to the parent route?

The longer explanation

In thesame jsfiddle and in thesame post/comments template, if i use the #linkTo helper instead of the #render helper, I am able to create a new form and the actions called in the child template are correctly resolved to the child’s route.

{{#linkTo "post.newComment"}} Add comment{{/linkTo}}

why I want to use the render helper instead of linkTo helper

I decided to change the UI, so that instead of clicking a link, I want to click a button which will trigger the ‘addingNewComment’ property to true and then just display thesame new comment form using the #render helper like so instead of via the #linkTo example above.

{{render "post.newComment" }}

Though the form is displayed, it can no longer save and returns the error

Uncaught TypeError: Cannot call method ‘one’ of null