React autofocus issue
autoFocus attribute is lost if React DOM is not attached to document at time of rendering.
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://fb.me/react-with-addons-15.2.0.js"></script>
<script src="https://fb.me/react-dom-15.2.0.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>
Babel + JSX
function Test() {
return (
<div>
<button>No autoFocus</button>
<button autoFocus>autoFocus</button>
</div>
);
}
var container = document.createElement('div');
// autoFocus works if you attach first:
// document.body.appendChild(container);
ReactDOM.render(<Test/>, container);
// autoFocus doesn't work if you attach after render:
document.body.appendChild(container);