fix(highlights): normalize text nodes before applying highlights

Author: peyerluk

spec/highlight-text.spec.js

@@ -121,76 +121,66 @@ describe('highlightText', function () {
       highlight(elem, ['b'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(1)
+      expect(portions.length).to.equal(1, 'portions.length')
       expect(portions[0].text).to.equal('b')
-      expect(portions[0].offset).to.equal(0)
-      expect(portions[0].length).to.equal(1)
-      expect(portions[0].isLastPortion).to.equal(true)
+      expect(portions[0].offset).to.equal(2, 'offset')
+      expect(portions[0].length).to.equal(1, 'length')
+      expect(portions[0].isLastPortion).to.equal(true, 'isLastPortion')
     })
 
     it('finds a word that is in a text node with a character before', function () {
       const elem = createParagraphWithTextNodes('a', ' b', ' c')
       highlight(elem, ['b'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(1)
+      expect(portions.length).to.equal(1, 'portions.length')
       expect(portions[0].text).to.equal('b')
-      expect(portions[0].offset).to.equal(1)
-      expect(portions[0].length).to.equal(1)
-      expect(portions[0].isLastPortion).to.equal(true)
+      expect(portions[0].offset).to.equal(2, 'offset')
+      expect(portions[0].length).to.equal(1, 'length')
+      expect(portions[0].isLastPortion).to.equal(true, 'isLastPortion')
     })
 
     it('finds a word that is in a text node with a charcter after', function () {
       const elem = createParagraphWithTextNodes('a ', 'b x', 'c')
       highlight(elem, ['b'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(1)
+      expect(portions.length).to.equal(1, 'portions.length')
       expect(portions[0].text).to.equal('b')
-      expect(portions[0].offset).to.equal(0)
-      expect(portions[0].length).to.equal(1)
-      expect(portions[0].isLastPortion).to.equal(true)
+      expect(portions[0].offset).to.equal(2, 'offset')
+      expect(portions[0].length).to.equal(1, 'length')
+      expect(portions[0].isLastPortion).to.equal(true, 'isLastPortion')
     })
 
     it('finds a word that span over two text nodes', function () {
       const elem = createParagraphWithTextNodes('a ', 'b', 'c')
       highlight(elem, ['bc'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(2)
-      expect(portions[0].text).to.equal('b')
-      expect(portions[0].isLastPortion).to.equal(false)
-
-      expect(portions[1].text).to.equal('c')
-      expect(portions[1].isLastPortion).to.equal(true)
+      expect(portions.length).to.equal(1, portions.length)
+      expect(portions[0].text).to.equal('bc')
+      expect(portions[0].isLastPortion).to.equal(true, 'isLastPortion')
     })
 
     it('finds a word that spans over three text nodes', function () {
       const elem = createParagraphWithTextNodes('a', 'b', 'c')
       highlight(elem, ['abc'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(3)
-      expect(portions[0].text).to.equal('a')
-      expect(portions[1].text).to.equal('b')
-      expect(portions[2].text).to.equal('c')
+      expect(portions.length).to.equal(1, 'portions.length')
+      expect(portions[0].text).to.equal('abc')
     })
 
     it('finds a word that is partially contained in two text nodes', function () {
       const elem = createParagraphWithTextNodes('a', ' xx', 'xx ')
       highlight(elem, ['xxxx'])
       const portions = this.wrapMatch.firstCall.args[0]
 
-      expect(portions.length).to.equal(2)
-      expect(portions[0].text).to.equal('xx')
-      expect(portions[0].offset).to.equal(1)
-      expect(portions[0].length).to.equal(2)
-      expect(portions[0].isLastPortion).to.equal(false)
-
-      expect(portions[1].text).to.equal('xx')
-      expect(portions[1].offset).to.equal(0)
-      expect(portions[1].length).to.equal(2)
-      expect(portions[1].isLastPortion).to.equal(true)
+      expect(portions.length).to.equal(1, 'portions.length')
+      expect(portions[0].text).to.equal('xxxx')
+      expect(portions[0].offset).to.equal(2, 'offset')
+      expect(portions[0].length).to.equal(4, 'length')
+      expect(portions[0].isLastPortion).to.equal(true)
     })
   })
 

src/highlight-text.js

@@ -33,6 +33,8 @@ export default {
       return
     }
 
+    element.normalize() // mend text nodes
+
     const iterator = new NodeIterator(element)
     let currentMatchIndex = 0
     let totalOffset = 0