Prevent duplicate ranged comment chips on rerender
Previously, changing any diff preferences would leave
the old chip on and attach the thread element again,
creating a duplicate chip.
Change-Id: I0b2220320b163ae1341f9829ad45d9f58a35b7fb
diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts
index 661d5d9..f0a3703 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts
@@ -968,6 +968,9 @@
while (this.$.diffTable.hasChildNodes()) {
this.$.diffTable.removeChild(this.$.diffTable.lastChild!);
}
+ this.querySelectorAll('gr-ranged-comment-chip').forEach(element =>
+ element.remove()
+ );
}
_computeDiffHeaderItems(
diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff_test.js b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff_test.js
index 9137be6..2cc9c10 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff_test.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff_test.js
@@ -703,6 +703,42 @@
element.querySelector('gr-ranged-comment-chip').range, range);
});
+ test('no duplicate range chip for same thread', async () => {
+ const range = {
+ start_line: 1,
+ end_line: 7,
+ start_character: 0,
+ end_character: 0,
+ };
+ const threadEl = document.createElement('div');
+ threadEl.className = 'comment-thread';
+ threadEl.setAttribute('diff-side', 'right');
+ threadEl.setAttribute('line-num', 1);
+ threadEl.setAttribute('range', JSON.stringify(range));
+ threadEl.setAttribute('slot', 'right-1');
+ const firstChip = document.createElement('gr-ranged-comment-chip');
+ firstChip.range = range;
+ firstChip.setAttribute('threadElRootId', threadEl.rootId);
+ firstChip.setAttribute('slot', 'right-1');
+ const content = [{
+ a: [],
+ b: [],
+ }, {
+ ab: Array(8).fill('text'),
+ }];
+ setupSampleDiff({content});
+
+ element.appendChild(firstChip);
+ await flush();
+ element._diffChanged(element.diff);
+ await flush();
+ element.appendChild(threadEl);
+ await flush();
+
+ assert.equal(
+ element.querySelectorAll('gr-ranged-comment-chip').length, 1);
+ });
+
test('removes long range comment chip when comment is discarded',
async () => {
const range = {
