opendev/gerrit
Code Issues Proposed changes

ES6ify /gr-ranged-comment-layer/*

Browse Source 
Bug: Issue 6179
Change-Id: I4a681e2bb6e0863e8ddba6c89709b3835d4a19c9
This commit is contained in:
Kasper Nilsson
2017-05-16 14:44:33 -07:00
parent 0d4fe6781b
commit 36e4c91a54
2 changed files with 107 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
polygerrit-ui/app/elements/diff/gr-ranged-comment-layer/gr-ranged-comment-layer.js
View File

@@ -14,13 +14,13 @@
(function() {
'use strict';
var HOVER_PATH_PATTERN = /^comments\.(left|right)\.\#(\d+)\.__hovering$/;
var SPLICE_PATH_PATTERN = /^comments\.(left|right)\.splices$/;
const HOVER_PATH_PATTERN = /^comments\.(left|right)\.\#(\d+)\.__hovering$/;
const SPLICE_PATH_PATTERN = /^comments\.(left|right)\.splices$/;
var RANGE_HIGHLIGHT = 'range';
var HOVER_HIGHLIGHT = 'rangeHighlight';
const RANGE_HIGHLIGHT = 'range';
const HOVER_HIGHLIGHT = 'rangeHighlight';
var NORMALIZE_RANGE_EVENT = 'normalize-range';
const NORMALIZE_RANGE_EVENT = 'normalize-range';
Polymer({
is: 'gr-ranged-comment-layer',
@@ -29,11 +29,11 @@
comments: Object,
_listeners: {
type: Array,
value: function() { return []; },
value() { return []; },
},
_commentMap: {
type: Object,
value: function() { return {left: [], right: []}; },
value() { return {left: [], right: []}; },
},
},
@@ -47,8 +47,8 @@
* annotation to.
* @param {GrDiffLine} line The line object.
*/
annotate: function(el, line) {
var ranges = [];
annotate(el, line) {
let ranges = [];
if (line.type === GrDiffLine.Type.REMOVE || (
line.type === GrDiffLine.Type.BOTH &&
el.getAttribute('data-side') !== 'right')) {
@@ -60,11 +60,11 @@
ranges = ranges.concat(this._getRangesForLine(line, 'right'));
}
ranges.forEach(function(range) {
for (const range of ranges) {
GrAnnotation.annotateElement(el, range.start,
range.end - range.start,
range.hovering ? HOVER_HIGHLIGHT : RANGE_HIGHLIGHT);
});
}
},
/**
@@ -73,7 +73,7 @@
* Should accept as arguments the line numbers for the start and end of
* the update and the side as a string.
*/
addListener: function(fn) {
addListener(fn) {
this._listeners.push(fn);
},
@@ -83,10 +83,10 @@
* @param {Number} end The line where the update ends.
* @param {String} side The side of the update. ('left' or 'right')
*/
_notifyUpdateRange: function(start, end, side) {
this._listeners.forEach(function(listener) {
_notifyUpdateRange(start, end, side) {
for (const listener of this._listeners) {
listener(start, end, side);
});
}
},
/**
@@ -94,7 +94,7 @@
* emitting appropriate update notifications.
* @param {Object} record The change record.
*/
_handleCommentChange: function(record) {
_handleCommentChange(record) {
if (!record.path) { return; }
// If the entire set of comments was changed.
@@ -105,11 +105,13 @@
}
// If the change only changed the `hovering` property of a comment.
var match = record.path.match(HOVER_PATH_PATTERN);
let match = record.path.match(HOVER_PATH_PATTERN);
let side;
if (match) {
var side = match[1];
var index = match[2];
var comment = this.comments[side][index];
side = match[1];
const index = match[2];
const comment = this.comments[side][index];
if (comment && comment.range) {
this._commentMap[side] = this._computeCommentMap(this.comments[side]);
this._notifyUpdateRange(
@@ -121,7 +123,7 @@
// If comments were spliced in or out.
match = record.path.match(SPLICE_PATH_PATTERN);
if (match) {
var side = match[1];
side = match[1];
this._commentMap[side] = this._computeCommentMap(this.comments[side]);
this._handleCommentSplice(record.value, side);
}
@@ -134,44 +136,45 @@
* @param {Array<Object>} commentList The list of comments.
* @return {Object} The sparse list.
*/
_computeCommentMap: function(commentList) {
var result = {};
commentList.forEach(function(comment) {
if (!comment.range) { return; }
var range = comment.range;
for (var line = range.start_line; line <= range.end_line; line++) {
_computeCommentMap(commentList) {
const result = {};
for (const comment of commentList) {
if (!comment.range) { continue; }
const range = comment.range;
for (let line = range.start_line; line <= range.end_line; line++) {
if (!result[line]) { result[line] = []; }
result[line].push({
comment: comment,
comment,
start: line === range.start_line ? range.start_character : 0,
end: line === range.end_line ? range.end_character : -1,
});
}
});
}
return result;
},
/**
* Translate a splice record into range update notifications.
*/
_handleCommentSplice: function(record, side) {
_handleCommentSplice(record, side) {
if (!record || !record.indexSplices) { return; }
record.indexSplices.forEach(function(splice) {
var ranges = splice.removed.length ?
splice.removed.map(function(c) { return c.range; }) :
[splice.object[splice.index].range];
ranges.forEach(function(range) {
if (!range) { return; }
for (const splice of record.indexSplices) {
const ranges = splice.removed.length ?
splice.removed.map(c => { return c.range; }) :
[splice.object[splice.index].range];
for (const range of ranges) {
if (!range) { continue; }
this._notifyUpdateRange(range.start_line, range.end_line, side);
}.bind(this));
}.bind(this));
}
}
},
_getRangesForLine: function(line, side) {
var lineNum = side === 'left' ? line.beforeNumber : line.afterNumber;
var ranges = this.get(['_commentMap', side, lineNum]) || [];
_getRangesForLine(line, side) {
const lineNum = side === 'left' ? line.beforeNumber : line.afterNumber;
const ranges = this.get(['_commentMap', side, lineNum]) || [];
return ranges
.map(function(range) {
.map(range => {
range = {
start: range.start,
end: range.end === -1 ? line.text.length : range.end,
@@ -189,11 +192,9 @@
}
return range;
}.bind(this))
.sort(function(a, b) {
// Sort the ranges so that hovering highlights are on top.
return a.hovering && !b.hovering ? 1 : 0;
});
})
// Sort the ranges so that hovering highlights are on top.
.sort((a, b) => a.hovering && !b.hovering ? 1 : 0);
},
});
})();

118
polygerrit-ui/app/elements/diff/gr-ranged-comment-layer/gr-ranged-comment-layer_test.html
View File

@@ -34,12 +34,12 @@ limitations under the License.
</test-fixture>
<script>
suite('gr-ranged-comment-layer', function() {
var element;
var sandbox;
suite('gr-ranged-comment-layer', () => {
let element;
let sandbox;
setup(function() {
var initialComments = {
setup(() => {
const initialComments = {
left: [
{
id: '12345',
@@ -97,17 +97,17 @@ limitations under the License.
element.comments = initialComments;
});
teardown(function() {
teardown(() => {
sandbox.restore();
});
suite('annotate', function() {
var sandbox;
var el;
var line;
var annotateElementStub;
suite('annotate', () => {
let sandbox;
let el;
let line;
let annotateElementStub;
setup(function() {
setup(() => {
sandbox = sinon.sandbox.create();
annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
el = document.createElement('div');
@@ -116,11 +116,11 @@ limitations under the License.
line.text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit,';
});
teardown(function() {
teardown(() => {
sandbox.restore();
});
test('type=Remove no-comment', function() {
test('type=Remove no-comment', () => {
line.type = GrDiffLine.Type.REMOVE;
line.beforeNumber = 40;
@@ -129,58 +129,58 @@ limitations under the License.
assert.isFalse(annotateElementStub.called);
});
test('type=Remove has-comment', function() {
test('type=Remove has-comment', () => {
line.type = GrDiffLine.Type.REMOVE;
line.beforeNumber = 36;
var expectedStart = 6;
var expectedLength = line.text.length - expectedStart;
const expectedStart = 6;
const expectedLength = line.text.length - expectedStart;
element.annotate(el, line);
assert.isTrue(annotateElementStub.called);
var lastCall = annotateElementStub.lastCall;
const lastCall = annotateElementStub.lastCall;
assert.equal(lastCall.args[0], el);
assert.equal(lastCall.args[1], expectedStart);
assert.equal(lastCall.args[2], expectedLength);
assert.equal(lastCall.args[3], 'range');
});
test('type=Remove has-comment hovering', function() {
test('type=Remove has-comment hovering', () => {
line.type = GrDiffLine.Type.REMOVE;
line.beforeNumber = 36;
element.set(['comments', 'left', 0, '__hovering'], true);
var expectedStart = 6;
var expectedLength = line.text.length - expectedStart;
const expectedStart = 6;
const expectedLength = line.text.length - expectedStart;
element.annotate(el, line);
assert.isTrue(annotateElementStub.called);
var lastCall = annotateElementStub.lastCall;
const lastCall = annotateElementStub.lastCall;
assert.equal(lastCall.args[0], el);
assert.equal(lastCall.args[1], expectedStart);
assert.equal(lastCall.args[2], expectedLength);
assert.equal(lastCall.args[3], 'rangeHighlight');
});
test('type=Both has-comment', function() {
test('type=Both has-comment', () => {
line.type = GrDiffLine.Type.BOTH;
line.beforeNumber = 36;
var expectedStart = 6;
var expectedLength = line.text.length - expectedStart;
const expectedStart = 6;
const expectedLength = line.text.length - expectedStart;
element.annotate(el, line);
assert.isTrue(annotateElementStub.called);
var lastCall = annotateElementStub.lastCall;
const lastCall = annotateElementStub.lastCall;
assert.equal(lastCall.args[0], el);
assert.equal(lastCall.args[1], expectedStart);
assert.equal(lastCall.args[2], expectedLength);
assert.equal(lastCall.args[3], 'range');
});
test('type=Both has-comment off side', function() {
test('type=Both has-comment off side', () => {
line.type = GrDiffLine.Type.BOTH;
line.beforeNumber = 36;
el.setAttribute('data-side', 'right');
@@ -190,18 +190,18 @@ limitations under the License.
assert.isFalse(annotateElementStub.called);
});
test('type=Add has-comment', function() {
test('type=Add has-comment', () => {
line.type = GrDiffLine.Type.ADD;
line.afterNumber = 12;
el.setAttribute('data-side', 'right');
var expectedStart = 0;
var expectedLength = 22;
const expectedStart = 0;
const expectedLength = 22;
element.annotate(el, line);
assert.isTrue(annotateElementStub.called);
var lastCall = annotateElementStub.lastCall;
const lastCall = annotateElementStub.lastCall;
assert.equal(lastCall.args[0], el);
assert.equal(lastCall.args[1], expectedStart);
assert.equal(lastCall.args[2], expectedLength);
@@ -209,9 +209,9 @@ limitations under the License.
});
});
test('_handleCommentChange overwrite', function() {
var handlerSpy = sandbox.spy(element, '_handleCommentChange');
var mapSpy = sandbox.spy(element, '_computeCommentMap');
test('_handleCommentChange overwrite', () => {
const handlerSpy = sandbox.spy(element, '_handleCommentChange');
const mapSpy = sandbox.spy(element, '_computeCommentMap');
element.set('comments', {left: [], right: []});
@@ -222,10 +222,10 @@ limitations under the License.
assert.equal(Object.keys(element._commentMap.right).length, 0);
});
test('_handleCommentChange hovering', function() {
var handlerSpy = sandbox.spy(element, '_handleCommentChange');
var mapSpy = sandbox.spy(element, '_computeCommentMap');
var notifyStub = sinon.stub();
test('_handleCommentChange hovering', () => {
const handlerSpy = sandbox.spy(element, '_handleCommentChange');
const mapSpy = sandbox.spy(element, '_computeCommentMap');
const notifyStub = sinon.stub();
element.addListener(notifyStub);
element.set(['comments', 'right', 0, '__hovering'], true);
@@ -234,16 +234,16 @@ limitations under the License.
assert.isTrue(mapSpy.called);
assert.isTrue(notifyStub.called);
var lastCall = notifyStub.lastCall;
const lastCall = notifyStub.lastCall;
assert.equal(lastCall.args[0], 10);
assert.equal(lastCall.args[1], 12);
assert.equal(lastCall.args[2], 'right');
});
test('_handleCommentChange splice out', function() {
var handlerSpy = sandbox.spy(element, '_handleCommentChange');
var mapSpy = sandbox.spy(element, '_computeCommentMap');
var notifyStub = sinon.stub();
test('_handleCommentChange splice out', () => {
const handlerSpy = sandbox.spy(element, '_handleCommentChange');
const mapSpy = sandbox.spy(element, '_computeCommentMap');
const notifyStub = sinon.stub();
element.addListener(notifyStub);
element.splice('comments.right', 0, 1);
@@ -252,16 +252,16 @@ limitations under the License.
assert.isTrue(mapSpy.called);
assert.isTrue(notifyStub.called);
var lastCall = notifyStub.lastCall;
const lastCall = notifyStub.lastCall;
assert.equal(lastCall.args[0], 10);
assert.equal(lastCall.args[1], 12);
assert.equal(lastCall.args[2], 'right');
});
test('_handleCommentChange splice in', function() {
var handlerSpy = sandbox.spy(element, '_handleCommentChange');
var mapSpy = sandbox.spy(element, '_computeCommentMap');
var notifyStub = sinon.stub();
test('_handleCommentChange splice in', () => {
const handlerSpy = sandbox.spy(element, '_handleCommentChange');
const mapSpy = sandbox.spy(element, '_computeCommentMap');
const notifyStub = sinon.stub();
element.addListener(notifyStub);
element.splice('comments.left', element.comments.left.length, 0, {
@@ -280,16 +280,16 @@ limitations under the License.
assert.isTrue(mapSpy.called);
assert.isTrue(notifyStub.called);
var lastCall = notifyStub.lastCall;
const lastCall = notifyStub.lastCall;
assert.equal(lastCall.args[0], 250);
assert.equal(lastCall.args[1], 275);
assert.equal(lastCall.args[2], 'left');
});
test('_computeCommentMap creates maps correctly', function() {
test('_computeCommentMap creates maps correctly', () => {
// There is only one ranged comment on the left, but it spans ll.36-39.
var leftKeys = [];
for (var i = 36; i <= 39; i++) { leftKeys.push('' + i); }
const leftKeys = [];
for (let i = 36; i <= 39; i++) { leftKeys.push('' + i); }
assert.deepEqual(Object.keys(element._commentMap.left).sort(),
leftKeys.sort());
@@ -311,8 +311,8 @@ limitations under the License.
// The right has two ranged comments, one spanning ll.10-12 and the other
// on line 100.
var rightKeys = [];
for (i = 10; i <= 12; i++) { rightKeys.push('' + i); }
const rightKeys = [];
for (let i = 10; i <= 12; i++) { rightKeys.push('' + i); }
rightKeys.push('55', '100');
assert.deepEqual(Object.keys(element._commentMap.right).sort(),
rightKeys.sort());
@@ -334,14 +334,14 @@ limitations under the License.
assert.equal(element._commentMap.right[100][0].end, 15);
});
test('_getRangesForLine normalizes invalid ranges', function() {
var line = {
test('_getRangesForLine normalizes invalid ranges', () => {
const line = {
afterNumber: 55,
text: '_getRangesForLine normalizes invalid ranges'
text: '_getRangesForLine normalizes invalid ranges',
};
var ranges = element._getRangesForLine(line, 'right');
const ranges = element._getRangesForLine(line, 'right');
assert.equal(ranges.length, 1);
var range = ranges[0];
const range = ranges[0];
assert.isTrue(range.start < range.end, 'start and end are normalized');
assert.equal(range.end, line.text.length);
});