Material-ui: <Dialog> and <ListItem> and programmatic focus control and content editable

[rudicus]

I have a weird issue and was curious if somebody could let me know if I am doing something wrong.

I have a simple "List" on a "Dialog", and when I open the dialog I would like to give focus to the first item on the list (which is populated in an async call). I have tried to accomplish this in the componentDidUpdate method by using: React.findDOMNode(this.refs.listItem1).focus() when the async call has finished.

After doing this, the item does appear to have focus, but it does not get highlighted.

I have had mixed results using contentEditable=true on the object, but am unsure why this should matter.

If I instead use the tab key and tab into the list item, the highlight works as expected. Is there something special I need to do to assign focus programatically?

[rudicus]

So it looks like the problem is ListItem only changes it's focus when it gets a synthetic keyboard-focused event. Since programatically calling domElement.focus() does not generate this message, the item does not get re-rendered highlighted. I would think ListItem should be able to use the onFocus handler to also change highlighting, and not just use the synthetic keyboard event.

Figured out a work around however - I added a handler to the onFocus method to explicitly call applyFocusState() when the element receives focus. The target id of the event contains the ref of the element I want to highlight.

  handleFocusChange : function(event){
    this.refs[event.target.id].applyFocusState('keyboard-focused');
  },

   var items = this.state.fileInfoArray.map(function(item){
     var name = item.fileName;
     return <ListItem key={i++} ref={item.fileName} primaryText={item.fileName} id={item.fileName} onTouchTap={this.handleTouchTap} tabIndex={0} onFocus={this.handleFocusChange}/>
  }.bind(this));

[TuningGuide]

Why was this issue closed? Or is applyFocusState the proper way of focusing ListItems? Or should rather MenuItems be used as they have a property called focusState?