Merge "Range comments tabs fixes"
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-annotation.js b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-annotation.js
index ef83ebf..ec21fd1 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-annotation.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-annotation.js
@@ -90,7 +90,7 @@
         hl = document.createElement(ANNOTATION_TAG);
         hl.className = cssClass;
         Polymer.dom(node.parentElement).replaceChild(hl, node);
-        hl.appendChild(node);
+        Polymer.dom(hl).appendChild(node);
       }
       return hl;
     },
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.js b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.js
index 47a02a6..6464470 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight.js
@@ -388,6 +388,9 @@
           startNode = GrAnnotation.splitAndWrapInHighlight(
               startNode, startOffset, cssClass);
         }
+      } else if (startNode.tagName == 'SPAN') {
+        startNode = GrAnnotation.splitAndWrapInHighlight(
+            startNode, startOffset, cssClass);
       } else {
         startNode = null;
       }
@@ -509,25 +512,23 @@
         // There is at least one line in between.
         var contents = this.diffBuilder.getContentsByLineRange(
             startLine + 1, endLine - 1, opt_side);
-        // Wrap contents in highlight.
         contents.forEach(function(content) {
-          if (content.textContent.length === 0) {
+          if (!content.firstChild) {
             return;
           }
-          var threadEl =
-                this.diffBuilder.getCommentThreadByContentEl(content);
-          if (threadEl) {
-            threadEl.remove();
-          }
-          var text = document.createTextNode(content.textContent);
-          while (content.firstChild) {
-            content.removeChild(content.firstChild);
-          }
-          content.appendChild(text);
-          if (threadEl) {
-            content.appendChild(threadEl);
-          }
-          GrAnnotation.wrapInHighlight(text, cssClass);
+          // Wrap contents in highlight.
+          var hl = GrAnnotation.wrapInHighlight(content.firstChild, cssClass);
+          var wrapInHl = function(node) {
+            if (node instanceof Text || node.tagName === 'SPAN') {
+              hl.appendChild(node);
+            } else if (node.tagName === 'HL') {
+              this._traverseContentSiblings(node.firstChild, wrapInHl);
+              node.remove();
+            }
+            return node === content.lastChild;
+          }.bind(this);
+          this._traverseContentSiblings(hl.nextSibling, wrapInHl);
+          hl.normalize();
         }, this);
       }
     },
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight_test.html b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight_test.html
index ddc081e..936db49 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight_test.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff-highlight/gr-diff-highlight_test.html
@@ -315,10 +315,7 @@
           '.left.lineNum[data-value="140"] ~ .content .contentText');
       var endContent = diff.querySelector(
           '.left.lineNum[data-value="141"] ~ .content .contentText');
-      var commentThread =
-          diff.querySelector('gr-diff-comment-thread');
       var builder = {
-        getCommentThreadByContentEl: sandbox.stub().returns(commentThread),
         getContentByLine: sandbox.stub().returns({}),
         getContentsByLineRange: sandbox.stub().returns([betweenContent]),
         getLineElByChild: sandbox.stub().returns(
@@ -342,8 +339,8 @@
       assert.instanceOf(betweenContent.firstChild, Element);
       assert.equal(betweenContent.firstChild.tagName, 'HL');
       assert.equal(betweenContent.firstChild.className, 'some');
-      assert.equal(betweenContent.childNodes.length, 2);
-      assert.equal(betweenContent.firstChild.childNodes.length, 1);
+      assert.equal(betweenContent.childNodes.length, 1);
+      assert.equal(betweenContent.firstChild.childNodes.length, 5);
       assert.equal(betweenContent.firstChild.textContent,
           'na💢ti te, inquit, sumus aliquando otiosum, certe a udiam, ' +
           'quid sit, quod Epicurum');
@@ -351,9 +348,6 @@
       assert.isNull(diff.querySelector('.right + .content .some'),
           'Highlight should be applied only to the left side content.');
 
-      assert.strictEqual(betweenContent.querySelector('gr-diff-comment-thread'),
-          commentThread, 'Comment threads should be preserved.');
-
       assert.instanceOf(endContent.childNodes[0], Element);
       assert.equal(endContent.childNodes[0].textContent,
           'nam et\tcomplectitur\tverbis, ');