From c7859fed1a49b452238e347f7740b5102b1f556e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 16 Jul 2018 18:27:06 +0100 Subject: [PATCH 1/3] add heuristic to compare documents to prevent autocomplete flicker Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/rooms/MessageComposerInput.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js index 26e6ac8ab26..26e66f25fcd 100644 --- a/src/components/views/rooms/MessageComposerInput.js +++ b/src/components/views/rooms/MessageComposerInput.js @@ -498,8 +498,10 @@ export default class MessageComposerInput extends React.Component { } } - // when selection changes hide the autocomplete - if (!rangeEquals(this.state.editorState.selection, editorState.selection)) { + // when selection changes hide the autocomplete. + // Selection changes when we enter text so use a heuristic to compare documents without doing it recursively + const documentChanged = this.state.editorState.document.text !== editorState.document.text; + if (!documentChanged && !rangeEquals(this.state.editorState.selection, editorState.selection)) { this.autocomplete.hide(); } From bdbc2cbd38c1fabf4efe7b2a6de9d14a936a8a51 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 16 Jul 2018 18:32:50 +0100 Subject: [PATCH 2/3] disable spellCheck when the placeholder is shown because "unencrypted" Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/rooms/MessageComposerInput.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js index 26e66f25fcd..84ee58925d1 100644 --- a/src/components/views/rooms/MessageComposerInput.js +++ b/src/components/views/rooms/MessageComposerInput.js @@ -1543,7 +1543,8 @@ export default class MessageComposerInput extends React.Component { onFocus={this.onFocus} renderNode={this.renderNode} renderMark={this.renderMark} - spellCheck={true} + // disable spell check for the placeholder because browsers don't like "unencrypted" + spellCheck={!this.state.editorState.document.isEmpty} /> From 30000999913f0aee27fed99c7328a04c3bb7db8e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Mon, 16 Jul 2018 21:27:52 +0100 Subject: [PATCH 3/3] add additional checks for hiding autocomplete to prevent `text` calculation Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/rooms/MessageComposerInput.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/views/rooms/MessageComposerInput.js b/src/components/views/rooms/MessageComposerInput.js index 84ee58925d1..38c544ce385 100644 --- a/src/components/views/rooms/MessageComposerInput.js +++ b/src/components/views/rooms/MessageComposerInput.js @@ -498,10 +498,12 @@ export default class MessageComposerInput extends React.Component { } } - // when selection changes hide the autocomplete. + // when in autocomplete mode and selection changes hide the autocomplete. // Selection changes when we enter text so use a heuristic to compare documents without doing it recursively - const documentChanged = this.state.editorState.document.text !== editorState.document.text; - if (!documentChanged && !rangeEquals(this.state.editorState.selection, editorState.selection)) { + if (this.autocomplete.state.completionList.length >= 0 && !this.autocomplete.state.hide && + this.state.editorState.document.text !== editorState.document.text && + !rangeEquals(this.state.editorState.selection, editorState.selection)) + { this.autocomplete.hide(); }