update last caret from update callback instead of input event
many editor updates are not caused by an input event, so the last caret wasn't always up to date. Updating the caret from the update callback ensures that every time the editor contents is changed, the last caret is updated.pull/21833/head
							parent
							
								
									124b7135cd
								
							
						
					
					
						commit
						2596281a7c
					
				|  | @ -116,6 +116,9 @@ export default class BasicMessageEditor extends React.Component { | |||
|             } catch (err) { | ||||
|                 console.error(err); | ||||
|             } | ||||
|             // if caret is a range, take the end position
 | ||||
|             const position = caret.end || caret; | ||||
|             this._setLastCaretFromPosition(position); | ||||
|         } | ||||
|         if (this.props.placeholder) { | ||||
|             const {isEmpty} = this.props.model; | ||||
|  | @ -165,7 +168,6 @@ export default class BasicMessageEditor extends React.Component { | |||
|         this._modifiedFlag = true; | ||||
|         const sel = document.getSelection(); | ||||
|         const {caret, text} = getCaretOffsetAndText(this._editorRef, sel); | ||||
|         this._setLastCaret(caret, text, sel); | ||||
|         this.props.model.update(text, event.inputType, caret); | ||||
|     } | ||||
| 
 | ||||
|  | @ -183,10 +185,11 @@ export default class BasicMessageEditor extends React.Component { | |||
|     // we don't need to. But if the user is navigating the caret without input
 | ||||
|     // we need to recalculate it, to be able to know where to insert content after
 | ||||
|     // losing focus
 | ||||
|     _setLastCaret(caret, text, selection) { | ||||
|         this._lastSelection = cloneSelection(selection); | ||||
|         this._lastCaret = caret; | ||||
|         this._lastTextLength = text.length; | ||||
|     _setLastCaretFromPosition(position) { | ||||
|         const {model} = this.props; | ||||
|         this._isCaretAtEnd = position.isAtEnd(model); | ||||
|         this._lastCaret = position.asOffset(model); | ||||
|         this._lastSelection = cloneSelection(document.getSelection()); | ||||
|     } | ||||
| 
 | ||||
|     _refreshLastCaretIfNeeded() { | ||||
|  | @ -201,7 +204,7 @@ export default class BasicMessageEditor extends React.Component { | |||
|             this._lastSelection = cloneSelection(selection); | ||||
|             const {caret, text} = getCaretOffsetAndText(this._editorRef, selection); | ||||
|             this._lastCaret = caret; | ||||
|             this._lastTextLength = text.length; | ||||
|             this._isCaretAtEnd = caret.offset === text.length; | ||||
|         } | ||||
|         return this._lastCaret; | ||||
|     } | ||||
|  | @ -223,7 +226,7 @@ export default class BasicMessageEditor extends React.Component { | |||
|     } | ||||
| 
 | ||||
|     isCaretAtEnd() { | ||||
|         return this.getCaret().offset === this._lastTextLength; | ||||
|         return this._isCaretAtEnd; | ||||
|     } | ||||
| 
 | ||||
|     _onBlur = () => { | ||||
|  |  | |||
|  | @ -120,4 +120,17 @@ export default class DocumentPosition { | |||
|         const atEnd = offset >= lastPart.text.length; | ||||
|         return new DocumentOffset(offset, atEnd); | ||||
|     } | ||||
| 
 | ||||
|     isAtEnd(model) { | ||||
|         if (model.parts.length === 0) { | ||||
|             return true; | ||||
|         } | ||||
|         const lastPartIdx = model.parts.length - 1; | ||||
|         const lastPart = model.parts[lastPartIdx]; | ||||
|         return this.index === lastPartIdx && this.offset === lastPart.text.length; | ||||
|     } | ||||
| 
 | ||||
|     isAtStart() { | ||||
|         return this.index === 0 && this.offset === 0; | ||||
|     } | ||||
| } | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue
	
	 Bruno Windels
						Bruno Windels