Autofocus and onFocus select function

[dainchatel]

Hi Ariana @arianadziedzic,

I asked Anthony about this autoFocus problem, where, when I render a new input I can get it to either automatically be focused or automatically be selected, but I can't do both. I've checked the W3 docs on autofocus here, this Stack Overflow question, and other online sources--but I haven't found an answer.

This is the code:

` <input defaultValue={neighb} ref={(input) => { this.textInput = input; } } onFocus={() => { this.textInput.select(); }} autoFocus

      >

`

This input is conditionally rendered when the user double clicks a "neighborhood" item on the page. It has a default value of that neighborhood's old name, a ref of this.textInput, and onFocus function that should select that ref when focus happens, which is automatically per the 'autoFocus' attribute. In the onFocus function I have tried console.log-ing 'this', which gives me the component, complete with refs. However, when I try console.log-ing 'this.refs' it gives me an empty object. I think the focus is happening before the ref has loaded, if that makes any sense. Any insight?

[arianacofone]

Wish we could have tackled this pickle, but let's leave this open so we can experiment with solutions later on. 👍 Thanks for sitting down!