{"action":"created","issue":{"url":"https://api.github.com/repos/muut/riotjs/issues/334","labels_url":"https://api.github.com/repos/muut/riotjs/issues/334/labels{/name}","comments_url":"https://api.github.com/repos/muut/riotjs/issues/334/comments","events_url":"https://api.github.com/repos/muut/riotjs/issues/334/events","html_url":"https://github.com/muut/riotjs/issues/334","id":57164749,"number":334,"title":"Life cycle issues with if statements","user":{"login":"luffs","id":733345,"avatar_url":"https://avatars.githubusercontent.com/u/733345?v=3","gravatar_id":"","url":"https://api.github.com/users/luffs","html_url":"https://github.com/luffs","followers_url":"https://api.github.com/users/luffs/followers","following_url":"https://api.github.com/users/luffs/following{/other_user}","gists_url":"https://api.github.com/users/luffs/gists{/gist_id}","starred_url":"https://api.github.com/users/luffs/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/luffs/subscriptions","organizations_url":"https://api.github.com/users/luffs/orgs","repos_url":"https://api.github.com/users/luffs/repos","events_url":"https://api.github.com/users/luffs/events{/privacy}","received_events_url":"https://api.github.com/users/luffs/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/muut/riotjs/labels/bug","name":"bug","color":"fc2929"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":9,"created_at":"2015-02-10T11:51:02Z","updated_at":"2015-05-26T04:58:03Z","closed_at":null,"body":"The html renders correctly to the page, but the life cycle events are not emitting correctly.\r\n\r\n1. the ```<fish/>``` is hidden at start, so its mount event shouldn't run.\r\n2. the mount event should be triggered when it's added.\r\n3. the unmount event should be triggered when it's removed.\r\n\r\nhttp://jsfiddle.net/60rk01ux/1/\r\n\r\n```html\r\n<test>\r\n    <div if={(current == 'fish')}>\r\n        <fish></fish>\r\n    </div>\r\n    <div if={(current == 'cat')}>\r\n        <cat></cat>\r\n    </div>\r\n    <script>\r\n    this.current = 'cat';\r\n    </script>\r\n</test>\r\n\r\n<cat>\r\n    <h1>=^..^=</h1>\r\n    <button onclick={activateFish}>Activate fish</button>\r\n    <script>\r\n    activateFish(){\r\n        this.parent.update({current: 'fish'})\r\n    }\r\n    </script>\r\n</cat>\r\n\r\n<fish>\r\n    <h1> {\"<')))><\"} </h1>\r\n    <button onclick={activateCat}>Activate cat</button>\r\n    <script>\r\n    activateCat(){\r\n        this.parent.update({current: 'cat'})\r\n    }\r\n    this.on('mount', function(){\r\n        alert('fish mounted')\r\n    });\r\n    this.on('unmount', function(){\r\n        alert('fish unmounted')\r\n    });\r\n    </script>\r\n</fish>\r\n```"},"comment":{"url":"https://api.github.com/repos/muut/riotjs/issues/comments/105394537","html_url":"https://github.com/muut/riotjs/issues/334#issuecomment-105394537","issue_url":"https://api.github.com/repos/muut/riotjs/issues/334","id":105394537,"user":{"login":"AndreasHeintze","id":2219544,"avatar_url":"https://avatars.githubusercontent.com/u/2219544?v=3","gravatar_id":"","url":"https://api.github.com/users/AndreasHeintze","html_url":"https://github.com/AndreasHeintze","followers_url":"https://api.github.com/users/AndreasHeintze/followers","following_url":"https://api.github.com/users/AndreasHeintze/following{/other_user}","gists_url":"https://api.github.com/users/AndreasHeintze/gists{/gist_id}","starred_url":"https://api.github.com/users/AndreasHeintze/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/AndreasHeintze/subscriptions","organizations_url":"https://api.github.com/users/AndreasHeintze/orgs","repos_url":"https://api.github.com/users/AndreasHeintze/repos","events_url":"https://api.github.com/users/AndreasHeintze/events{/privacy}","received_events_url":"https://api.github.com/users/AndreasHeintze/received_events","type":"User","site_admin":false},"created_at":"2015-05-26T04:58:03Z","updated_at":"2015-05-26T04:58:03Z","body":"> About the mount order, maybe it's possible to just propagate the parent's if expression's result to the children so they can test it before mounting?\r\nThat is what I'm doing. I write a dom reference to each tag that points to it's closest dom-parent that has an if-expression and I do set a var (removed) on that dom-element if the result of the if-expression is false. Then in update function I do a check of to see if removed is set on that element, if it is, I just do a return."}}