{"action":"created","issue":{"url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/533","repository_url":"https://api.github.com/repos/ember-animation/liquid-fire","labels_url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/533/labels{/name}","comments_url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/533/comments","events_url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/533/events","html_url":"https://github.com/ember-animation/liquid-fire/issues/533","id":195541368,"number":533,"title":"Strange animation issue with route transition with #each","user":{"login":"chrism","id":35488,"avatar_url":"https://avatars.githubusercontent.com/u/35488?v=3","gravatar_id":"","url":"https://api.github.com/users/chrism","html_url":"https://github.com/chrism","followers_url":"https://api.github.com/users/chrism/followers","following_url":"https://api.github.com/users/chrism/following{/other_user}","gists_url":"https://api.github.com/users/chrism/gists{/gist_id}","starred_url":"https://api.github.com/users/chrism/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/chrism/subscriptions","organizations_url":"https://api.github.com/users/chrism/orgs","repos_url":"https://api.github.com/users/chrism/repos","events_url":"https://api.github.com/users/chrism/events{/privacy}","received_events_url":"https://api.github.com/users/chrism/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":3,"created_at":"2016-12-14T14:14:51Z","updated_at":"2016-12-14T15:35:05Z","closed_at":null,"body":"I've made an animated gif which I hope demonstrates the issue as it is quite hard to explain.\r\n\r\n![example_animation](https://cloud.githubusercontent.com/assets/35488/21185156/c979d546-c20f-11e6-9a00-f562aa3e638b.gif)\r\n\r\nThe route transitions (with a liquid-fire fade) but at the end, after the transition has completed, the height of the liquid-outlet jumps. It looks to me like the cause is that the data from the model actually only updates _after_ the transition.\r\n\r\nI cannot work out why it is doing this though, because the data loads from a promise in the route, which looks like this:\r\n\r\n```js\r\n  model(params) {\r\n    return this.store.findRecord('album', params.id);\r\n  }\r\n```\r\n\r\nSo surely it should block the transition until the album data has fully loaded?\r\n\r\nI have made sure there are no async relationships that might be lazily loading. In fact I am munging the data from a 3rd party API into a tracklisting object on the model directly (with id and title) so that everything definitely loads in that one model request, and nothing should be updating in the background.\r\n\r\nThis is looped though via a simple `#each` in the template, ie\r\n\r\n```hbs\r\n<ol class=\"album-tracks__list\">\r\n  {{#each model.tracklisting as |track|}}\r\n    <li class=\"album-tracks__list-item\">{{link-to track.title \"add-track.track\" track.id}}</li>\r\n  {{/each}}\r\n</ol>\r\n```\r\n\r\nIs this a bug in the way that liquid-fire renders to an outlet, or have I missed something?\r\n\r\nI'm really at a loss how to fix this.\r\n\r\nThanks."},"comment":{"url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/comments/267065263","html_url":"https://github.com/ember-animation/liquid-fire/issues/533#issuecomment-267065263","issue_url":"https://api.github.com/repos/ember-animation/liquid-fire/issues/533","id":267065263,"user":{"login":"chrism","id":35488,"avatar_url":"https://avatars.githubusercontent.com/u/35488?v=3","gravatar_id":"","url":"https://api.github.com/users/chrism","html_url":"https://github.com/chrism","followers_url":"https://api.github.com/users/chrism/followers","following_url":"https://api.github.com/users/chrism/following{/other_user}","gists_url":"https://api.github.com/users/chrism/gists{/gist_id}","starred_url":"https://api.github.com/users/chrism/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/chrism/subscriptions","organizations_url":"https://api.github.com/users/chrism/orgs","repos_url":"https://api.github.com/users/chrism/repos","events_url":"https://api.github.com/users/chrism/events{/privacy}","received_events_url":"https://api.github.com/users/chrism/received_events","type":"User","site_admin":false},"created_at":"2016-12-14T15:35:05Z","updated_at":"2016-12-14T15:35:05Z","body":"Here is an animation to illustrate without any images.\r\n\r\n![screenflow](https://cloud.githubusercontent.com/assets/35488/21188292/2f547d66-c21b-11e6-9b28-350bd08313a2.gif)\r\n"}}
{"actor":{"display_login":"chrism"}}