{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react/issues/5968","repository_url":"https://api.github.com/repos/facebook/react","labels_url":"https://api.github.com/repos/facebook/react/issues/5968/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/5968/comments","events_url":"https://api.github.com/repos/facebook/react/issues/5968/events","html_url":"https://github.com/facebook/react/issues/5968","id":130817328,"number":5968,"title":"TypeError: Cannot set property 'initialValue' of null. ReactDOMSelect.postUpdateWrapper","user":{"login":"browniefed","id":1714673,"avatar_url":"https://avatars.githubusercontent.com/u/1714673?v=3","gravatar_id":"","url":"https://api.github.com/users/browniefed","html_url":"https://github.com/browniefed","followers_url":"https://api.github.com/users/browniefed/followers","following_url":"https://api.github.com/users/browniefed/following{/other_user}","gists_url":"https://api.github.com/users/browniefed/gists{/gist_id}","starred_url":"https://api.github.com/users/browniefed/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/browniefed/subscriptions","organizations_url":"https://api.github.com/users/browniefed/orgs","repos_url":"https://api.github.com/users/browniefed/repos","events_url":"https://api.github.com/users/browniefed/events{/privacy}","received_events_url":"https://api.github.com/users/browniefed/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2016-02-02T21:09:23Z","updated_at":"2016-02-16T14:36:41Z","closed_at":"2016-02-02T22:02:48Z","body":"## Issue\r\nUsing latest .14.7 I'm running into an issue error with select and `ReactDOMSelect:158` when navigating away from one place to another place which is causing a select to throw even though it should and is unmounted.\r\n\r\nError being: `TypeError: Cannot set property 'initialValue' of null at Object.ReactDOMSelect.postUpdateWrapper (http://localhost:3992/assets/js/main.js:22153:38)`\r\n\r\nOther reports of this happening are here https://github.com/erikras/redux-form/issues/321\r\n\r\n## Setup\r\n\r\nCurrently integrating into an app in pieces, So I render our `Router` into an empty container that renders components that render into their appropriate DOM containers.\r\n\r\n## Seemingly the error?\r\nI've narrowed it down to calling `unmountComponentAtNode(this.section)` which occurs in a `componentDidUpdate`. I removed it and the error stops happening.\r\n\r\nI realize that mounting to an existing node that is a React root will cause an unmount and mount the correct things.\r\n\r\n## Repro\r\nI've attempted to reproduce it but no luck at the moment even though I've narrowed it down to the `unmountComponentAtNode` call.\r\n\r\nThe click is originating in a different ReactDOM.render container so I'm not sure if it is an eventing thing where clicks from different ReactDOM roots are applying to everywhere else?\r\n\r\n## Stack Trace\r\n\r\n```\r\nReactDOMSelect.postUpdateWrapper (ReactDOMSelect.js:158)\r\npostUpdateSelectWrapper (ReactDOMComponent.js:303)\r\nassign.notifyAll (CallbackQueue.js:65)\r\nON_DOM_READY_QUEUEING.close (ReactReconcileT…nsaction.js:81)\r\nMixin.closeAll (Transaction.js:202)\r\nMixin.perform (Transaction.js:149)\r\nMixin.perform (Transaction.js:136)\r\nassign.perform (ReactUpdates.js:86)\r\nflushBatchedUpdates (ReactUpdates.js:147)\r\nReactUpdates_flushBatchedUpdates (ReactPerf.js:66)\r\nMixin.closeAll (Transaction.js:202)\r\nMixin.perform (Transaction.js:149)\r\nReactDefaultBatchingStrategy.batchedUpdates (ReactDefaultBat…Strategy.js:62)\r\nbatchedUpdates (ReactUpdates.js:94)\r\nReactEventListener.dispatchEvent (ReactEventListener.js:204) //Mouse click event of me clicking on a different container render.\r\n```\r\n\r\n## Code\r\nMy code causing the issue looks like so.\r\n\r\n```\r\nimport React, { Component, PropTypes } from \"react\";\r\nimport { render, unmountComponentAtNode } from \"react-dom\";\r\nimport { Provider } from \"react-redux\";\r\nimport ApplicationsRenderer from \"./applications\";\r\n\r\nlet getContainer = () =>  document.getElementById('dashboard-body');\r\n\r\nexport default class DashboardRenderer extends Component {\r\n\r\n  constructor(props, context) {\r\n    super(props, context);\r\n    this.renderIntoContainer = this.renderIntoContainer.bind(this);\r\n  }\r\n  componentDidMount() {\r\n    this.renderIntoContainer();\r\n  }\r\n\r\n  renderIntoContainer() {\r\n    let { store, container: Container } = this.props.route;\r\n    let { router } = this.context;\r\n    this.section = getContainer();\r\n    if (this.section) {\r\n        unmountComponentAtNode(this.section)\r\n        render(\r\n        <Provider store={store}>\r\n          <Container router={router} key={Container} />\r\n        </Provider>,\r\n        this.section\r\n      );\r\n    }\r\n  }\r\n\r\n  componentDidUpdate(prevProps) {\r\n    let { container } = this.props.route;\r\n    let { container: prevContainer } = prevProps.route;\r\n\r\n    if (container !== prevContainer) {\r\n      this.renderIntoContainer();\r\n    }\r\n  }\r\n\r\n  componentWillUnmount() {\r\n    unmountComponentAtNode(this.section)\r\n  }\r\n\r\n  render() {\r\n    return null;\r\n  }\r\n}\r\n\r\nDashboardRenderer.contextTypes = {\r\n  router: PropTypes.object\r\n}\r\n\r\n```"},"comment":{"url":"https://api.github.com/repos/facebook/react/issues/comments/184703510","html_url":"https://github.com/facebook/react/issues/5968#issuecomment-184703510","issue_url":"https://api.github.com/repos/facebook/react/issues/5968","id":184703510,"user":{"login":"browniefed","id":1714673,"avatar_url":"https://avatars.githubusercontent.com/u/1714673?v=3","gravatar_id":"","url":"https://api.github.com/users/browniefed","html_url":"https://github.com/browniefed","followers_url":"https://api.github.com/users/browniefed/followers","following_url":"https://api.github.com/users/browniefed/following{/other_user}","gists_url":"https://api.github.com/users/browniefed/gists{/gist_id}","starred_url":"https://api.github.com/users/browniefed/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/browniefed/subscriptions","organizations_url":"https://api.github.com/users/browniefed/orgs","repos_url":"https://api.github.com/users/browniefed/repos","events_url":"https://api.github.com/users/browniefed/events{/privacy}","received_events_url":"https://api.github.com/users/browniefed/received_events","type":"User","site_admin":false},"created_at":"2016-02-16T14:36:41Z","updated_at":"2016-02-16T14:36:41Z","body":"@LKay No, not entirely. Not using `unmountComponentAtNode` and instead just calling `ReadDOM.render` with the new component at the same DOM container and it worked fine, it was seemingly just the sync mounting issue. I moved pretty quickly and now converted things over to a full react app so I don't have any more integration work to do."}}