fix(spellcheck): Remove premature optimizations and avoid spellcheck on word being typed

Fixes T3537

internal_packages/composer-spellcheck/lib/draft-extension.coffee

@@ -10,28 +10,13 @@ class SpellcheckDraftStoreExtension extends DraftStoreExtension
     SpellcheckCache[word] ?= @spellchecker.isMisspelled(word)
     SpellcheckCache[word]
 
-  @ensureSetup: ->
-    @walkTreeNodes ?= []
-    @walkTreesDebounced ?= _.debounce(@walkTrees, 200)
-
-  @onInput: (editableNode, event) ->
-    @ensureSetup()
-    @walkTreeNodes.push(editableNode)
-    @walkTreesDebounced()
+  @onComponentDidUpdate: (editableNode) ->
+    @walkTree(editableNode)
 
   @onLearnSpelling: (editableNode, word) ->
     delete SpellcheckCache[word]
     @ensureSetup()
-    @walkTreeNodes.push(editableNode)
-    @walkTreesDebounced()
-
-  @onSubstitutionPerformed: (editableNode) ->
-    @ensureSetup()
-    @walkTreeNodes.push(editableNode)
-    @walkTreesDebounced()
-
-  @walkTrees: (nodes) =>
-    _.each(_.uniq(@walkTreeNodes), @walkTree)
+    @walkTree(editableNode)
 
   @walkTree: (editableNode) =>
     treeWalker = document.createTreeWalker(editableNode, NodeFilter.SHOW_TEXT)
@@ -66,6 +51,11 @@ class SpellcheckDraftStoreExtension extends DraftStoreExtension
         markedAsMisspelled = spellingSpan?.classList.contains('misspelled')
 
         if misspelled and not markedAsMisspelled
+          # The insertion point is currently at the end of this misspelled word.
+          # Do not mark it until the user types a space or leaves.
+          if selectionSnapshot.focusNode is node and selectionSnapshot.focusOffset is match.index + match[0].length
+            continue
+          
           if spellingSpan
             spellingSpan.classList.add('misspelled')
           else

internal_packages/composer/lib/contenteditable-component.cjsx

@@ -79,6 +79,10 @@ class ContenteditableComponent extends React.Component
     @_setupLinkHoverListeners()
     @_restoreSelection()
 
+    editableNode = @_editableNode()
+    for extension in DraftStore.extensions()
+      extension.onComponentDidUpdate(editableNode) if extension.onComponentDidUpdate
+
   render: =>
     <div className="contenteditable-container">
       <FloatingToolbar ref="floatingToolbar"
@@ -147,7 +151,8 @@ class ContenteditableComponent extends React.Component
 
     @_runCoreFilters()
 
-    @_runExtensionFilters()
+    for extension in DraftStore.extensions()
+      extension.onInput(@_editableNode(), event) if extension.onInput
 
     @_prepareForReactContenteditable()
 
@@ -234,14 +239,10 @@ class ContenteditableComponent extends React.Component
       return selection.anchorNode?.textContent
     else return null
 
-  _runExtensionFilters: ->
-    for extension in DraftStore.extensions()
-      extension.onInput(@_editableNode(), event) if extension.onInput
-
   # This component works by re-rendering on every change and restoring the
   # selection. This is also how standard React controlled inputs work too.
   #
-  # Since the contets of the contenteditable are complex, nested DOM
+  # Since the contents of the contenteditable are complex, nested DOM
   # structures, a simple replacement of the DOM is not easy. There are a
   # variety of edge cases that we need to correct for and prepare both the
   # HTML and the selection to be serialized without error.

src/window-event-handler.coffee

@@ -118,10 +118,11 @@ class WindowEventHandler
   # `.override-key-bindings` class.
   handleNativeKeybindings: ->
     menu = null
+    webContents = atom.getCurrentWindow().webContents
     bindCommandToAction = (command, action) =>
       @subscribe $(document), command, (event) ->
         unless event.target.webkitMatchesSelector('.override-key-bindings')
-          atom.getCurrentWindow().webContents[action]()
+          webContents[action]()
         true
 
     bindCommandToAction('core:copy', 'copy')