fix(highlight): dont remove highlights when spellchecking

Author: peyerluk

src/highlight-support.js

@@ -12,7 +12,7 @@ const highlightSupport = {
     let blockText = highlightText.extractText(editableHost)
 
     const marker = '<span class="highlight-comment"></span>'
-    const markerNode = highlightSupport.createMarkerNode(marker, this.win)
+    const markerNode = highlightSupport.createMarkerNode(marker, 'highlight', this.win)
 
     const textSearch = new TextHighlighting(markerNode, 'text')
     const matches = textSearch.findMatches(blockText, [text])
@@ -46,15 +46,15 @@ const highlightSupport = {
     return !!matches.length
   },
 
-  createMarkerNode (markerMarkup, win) {
+  createMarkerNode (markerMarkup, highlightType, win) {
     let marker = $(markerMarkup)[0]
 
     if (win) {
       marker = content.adoptElement(marker, win.document)
     }
 
     marker.setAttribute('data-editable', 'ui-unwrap')
-    marker.setAttribute('data-highlight', 'highlight')
+    marker.setAttribute('data-highlight', highlightType)
     return marker
   }
 

src/highlighting.js

@@ -41,8 +41,10 @@ export default class Highlighting {
     let spellcheckService = this.config.spellcheck.spellcheckService
     const spellcheckMarker = this.config.spellcheck.marker
     const whitespaceMarker = this.config.whitespace.marker
-    const spellcheckMarkerNode = highlightSupport.createMarkerNode(spellcheckMarker, this.win)
-    const whitespaceMarkerNode = highlightSupport.createMarkerNode(whitespaceMarker, this.win)
+    const spellcheckMarkerNode = highlightSupport
+      .createMarkerNode(spellcheckMarker, 'spellcheck', this.win)
+    const whitespaceMarkerNode = highlightSupport
+      .createMarkerNode(whitespaceMarker, 'spellcheck', this.win)
 
     this.spellcheckService = new SpellcheckService(spellcheckService)
     this.spellcheck = new WordHighlighting(spellcheckMarkerNode)
@@ -161,7 +163,7 @@ export default class Highlighting {
   }
 
   removeHighlights (editableHost) {
-    $(editableHost).find('[data-highlight]')
+    $(editableHost).find('[data-highlight="spellcheck"]')
       .each((index, elem) => {
         content.unwrap(elem)
       })