{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react/issues/6371","repository_url":"https://api.github.com/repos/facebook/react","labels_url":"https://api.github.com/repos/facebook/react/issues/6371/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/6371/comments","events_url":"https://api.github.com/repos/facebook/react/issues/6371/events","html_url":"https://github.com/facebook/react/issues/6371","id":144319010,"number":6371,"title":"Uncaught Invariant Violation: Must be mounted to trap events when replacing an image with a link to an image","user":{"login":"aaronjensen","id":8588,"avatar_url":"https://avatars.githubusercontent.com/u/8588?v=3","gravatar_id":"","url":"https://api.github.com/users/aaronjensen","html_url":"https://github.com/aaronjensen","followers_url":"https://api.github.com/users/aaronjensen/followers","following_url":"https://api.github.com/users/aaronjensen/following{/other_user}","gists_url":"https://api.github.com/users/aaronjensen/gists{/gist_id}","starred_url":"https://api.github.com/users/aaronjensen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/aaronjensen/subscriptions","organizations_url":"https://api.github.com/users/aaronjensen/orgs","repos_url":"https://api.github.com/users/aaronjensen/repos","events_url":"https://api.github.com/users/aaronjensen/events{/privacy}","received_events_url":"https://api.github.com/users/aaronjensen/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/facebook/react/labels/Component:%20Events","name":"Component: Events","color":"0052cc"},{"url":"https://api.github.com/repos/facebook/react/labels/Status:%20Unconfirmed","name":"Status: Unconfirmed","color":"d4c5f9"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":20,"created_at":"2016-03-29T16:35:37Z","updated_at":"2016-04-20T19:55:36Z","closed_at":null,"body":"I'm having a hard time narrowing a repro down for this and there seem to be a lot of required moving parts, so I'll try to give as much information as I can.\r\n\r\nRelevant snippet of package.json:\r\n\r\n```\r\n    \"react\": \"15.0.0-rc.2\", // repros w/ 0.14.7 as well\r\n    \"react-dom\": \"15.0.0-rc.2\",\r\n    \"react-redux\": \"4.0.6\",\r\n    \"react-router\": \"2.0.0-rc5\",\r\n    \"react-router-redux\": \"4.0.0-rc.1\",\r\n    \"redux\": \"3.2.1\",\r\n```\r\n\r\nOur routes look something like this:\r\n\r\n```\r\n      <Route component={App}>\r\n        <Route component={LayoutNoFooter}>\r\n          <Route component={Page2} />\r\n        </Route>\r\n        <Route component={Layout}>\r\n          <Route component={Page1} />\r\n        </Route>\r\n      </Route>\r\n```\r\n\r\n`LayoutNoFooter` simply wraps `Layout` and passes an additional prop in.\r\n\r\nI have this component in the `Header`, which is rendered by `Layout`: https://gist.github.com/aaronjensen/86c9643ecc53ad4e9006\r\n\r\n`Header` is a react-redux connected component.\r\n\r\n`Page1` has a `componentWillUnmount` that dispatches an action that ultimately toggles `searchMode` in `HeaderLogo`. \r\n\r\nWhen I go from `Page1` to `Page2` the invariant violation fires.\r\n\r\nIf I `setTimeout` the action dispatch in `componentWillUnmount` it appears to work fine. If I replace `LayoutNoFooter` with `Layout` it appears to work fine.\r\n\r\nThe invariant violation is on the `img` tag of the `HeaderLogo`\r\n\r\n![stack](https://screenshots-dx37.s3.amazonaws.com/monosnap/Integration_Test__Hotel_Results_2016-03-28_22-35-14.png)\r\n\r\nI've tried building a repro in codepen, with a similar structure `setState` calls to simulate react-router and redux, but I suspect they are doing more that would require me to actually build a repro w/ those technologies. If that would be helpful, I can work on it over time and hopefully repro it. Maybe there's enough info here, however. Thanks!\r\n\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/facebook/react/issues/comments/212579311","html_url":"https://github.com/facebook/react/issues/6371#issuecomment-212579311","issue_url":"https://api.github.com/repos/facebook/react/issues/6371","id":212579311,"user":{"login":"chelzwa","id":10090103,"avatar_url":"https://avatars.githubusercontent.com/u/10090103?v=3","gravatar_id":"","url":"https://api.github.com/users/chelzwa","html_url":"https://github.com/chelzwa","followers_url":"https://api.github.com/users/chelzwa/followers","following_url":"https://api.github.com/users/chelzwa/following{/other_user}","gists_url":"https://api.github.com/users/chelzwa/gists{/gist_id}","starred_url":"https://api.github.com/users/chelzwa/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/chelzwa/subscriptions","organizations_url":"https://api.github.com/users/chelzwa/orgs","repos_url":"https://api.github.com/users/chelzwa/repos","events_url":"https://api.github.com/users/chelzwa/events{/privacy}","received_events_url":"https://api.github.com/users/chelzwa/received_events","type":"User","site_admin":false},"created_at":"2016-04-20T19:55:35Z","updated_at":"2016-04-20T19:55:35Z","body":"Here's an additional codepen showing the `cannot read property 'addEventListener' of null` error.\r\nSteps to reproduce:\r\n1. Add any number of alerts\r\n2. Switch pages\r\n\r\nAlthough my specific error is different than @Dattaya's, it seems likely to be related to the same cause, as I also found that this happens only if I include react-router-redux in the project.\r\nSwitching `<Router history={appHistory}>` to '<Router history={browserHistory}>` and commenting out the line `const appHistory = syncHistoryWithStore(browserHistory, store);` fixes the issue.\r\n\r\nhttp://codepen.io/chelzwa/pen/JXZeOL?editors=1010"}}