Skip to content

Commit

Permalink
Editor: Set selection range after timeout
Browse files Browse the repository at this point in the history
Otherwise, IE11 sets selection to end of field
  • Loading branch information
aduth committed Apr 21, 2016
1 parent 99d89b1 commit 692ecda
Showing 1 changed file with 21 additions and 4 deletions.
25 changes: 21 additions & 4 deletions client/post-editor/editor-title/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -56,12 +56,26 @@ const EditorTitle = React.createClass( {

// If value updated via paste, restore caret location
if ( this.selectionStart ) {
const input = ReactDom.findDOMNode( this.refs.titleInput );
input.setSelectionRange( this.selectionStart, this.selectionStart );
delete this.selectionStart;
this.setSelectionTimeout = setTimeout( this.setSelection, 0 );
}
},

componentWillUnmount() {
clearTimeout( this.setSelectionTimeout );
delete this.setSelectionTimeout;
delete this.selectionStart;
},

setSelection() {
if ( ! this.selectionStart ) {
return;
}

const input = ReactDom.findDOMNode( this.refs.titleInput );
input.setSelectionRange( this.selectionStart, this.selectionStart );
delete this.selectionStart;
},

setTitle( title ) {
// TODO: REDUX - remove flux actions when whole post-editor is reduxified
PostActions.edit( { title } );
Expand Down Expand Up @@ -111,8 +125,11 @@ const EditorTitle = React.createClass( {
valueChars.splice( selectionStart, selectionEnd - selectionStart, text );
const newTitle = valueChars.join( '' );

this.setTitle( newTitle );
// To preserve caret location, we track intended selection point to be
// restored after next render pass
this.selectionStart = selectionStart + text.length;

this.setTitle( newTitle );
},

preventEnterKeyPress( event ) {
Expand Down

0 comments on commit 692ecda

Please sign in to comment.