ES6ify /gr-diff-builder/*
Bug: Issue 6179
Change-Id: I9d72fb89a3c3ad916c9097bdf6e5fb31a1dd4cf0
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-image.js b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-image.js
index 952dc67..683f2fc 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-image.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-image.js
@@ -17,7 +17,7 @@
// Prevent redefinition.
if (window.GrDiffBuilderImage) { return; }
- var IMAGE_MIME_PATTERN = /^image\/(bmp|gif|jpeg|jpg|png|tiff|webp)$/;
+ const IMAGE_MIME_PATTERN = /^image\/(bmp|gif|jpeg|jpg|png|tiff|webp)$/;
function GrDiffBuilderImage(diff, comments, prefs, outputEl, baseImage,
revisionImage) {
@@ -31,7 +31,7 @@
GrDiffBuilderImage.prototype.constructor = GrDiffBuilderImage;
GrDiffBuilderImage.prototype.renderDiffImages = function() {
- var section = this._createElement('tbody', 'image-diff');
+ const section = this._createElement('tbody', 'image-diff');
this._emitImagePair(section);
this._emitImageLabels(section);
@@ -40,7 +40,7 @@
};
GrDiffBuilderImage.prototype._emitImagePair = function(section) {
- var tr = this._createElement('tr');
+ const tr = this._createElement('tr');
tr.appendChild(this._createElement('td'));
tr.appendChild(this._createImageCell(this._baseImage, 'left', section));
@@ -52,18 +52,18 @@
section.appendChild(tr);
};
- GrDiffBuilderImage.prototype._createImageCell =
- function(image, className, section) {
- var td = this._createElement('td', className);
+ GrDiffBuilderImage.prototype._createImageCell = function(image, className,
+ section) {
+ const td = this._createElement('td', className);
if (image && IMAGE_MIME_PATTERN.test(image.type)) {
- var imageEl = this._createElement('img');
+ const imageEl = this._createElement('img');
imageEl.onload = function() {
image._height = imageEl.naturalHeight;
image._width = imageEl.naturalWidth;
this._updateImageLabel(section, className, image);
}.bind(this);
imageEl.src = 'data:' + image.type + ';base64, ' + image.body;
- imageEl.addEventListener('error', function() {
+ imageEl.addEventListener('error', () => {
imageEl.remove();
td.textContent = '[Image failed to load]';
});
@@ -72,9 +72,9 @@
return td;
};
- GrDiffBuilderImage.prototype._updateImageLabel =
- function(section, className, image) {
- var label = Polymer.dom(section)
+ GrDiffBuilderImage.prototype._updateImageLabel = function(section, className,
+ image) {
+ const label = Polymer.dom(section)
.querySelector('.' + className + ' span.label');
this._setLabelText(label, image);
};
@@ -84,9 +84,9 @@
};
GrDiffBuilderImage.prototype._emitImageLabels = function(section) {
- var tr = this._createElement('tr');
+ const tr = this._createElement('tr');
- var addNamesInLabel = false;
+ let addNamesInLabel = false;
if (this._baseImage && this._revisionImage &&
this._baseImage._name !== this._revisionImage._name) {
@@ -94,10 +94,10 @@
}
tr.appendChild(this._createElement('td'));
- var td = this._createElement('td', 'left');
- var label = this._createElement('label');
- var nameSpan;
- var labelSpan = this._createElement('span', 'label');
+ let td = this._createElement('td', 'left');
+ let label = this._createElement('label');
+ let nameSpan;
+ let labelSpan = this._createElement('span', 'label');
if (addNamesInLabel) {
nameSpan = this._createElement('span', 'name');
@@ -135,7 +135,7 @@
GrDiffBuilderImage.prototype._getImageLabel = function(image) {
if (image) {
- var type = image.type || image._expectedType;
+ const type = image.type || image._expectedType;
if (image._width && image._height) {
return image._width + '⨉' + image._height + ' ' + type;
} else {
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-side-by-side.js b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-side-by-side.js
index cbc00b8..6f47f9b 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-side-by-side.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-side-by-side.js
@@ -24,13 +24,13 @@
GrDiffBuilderSideBySide.prototype.constructor = GrDiffBuilderSideBySide;
GrDiffBuilderSideBySide.prototype.buildSectionElement = function(group) {
- var sectionEl = this._createElement('tbody', 'section');
+ const sectionEl = this._createElement('tbody', 'section');
sectionEl.classList.add(group.type);
if (this._isTotal(group)) {
sectionEl.classList.add('total');
}
- var pairs = group.getSideBySidePairs();
- for (var i = 0; i < pairs.length; i++) {
+ const pairs = group.getSideBySidePairs();
+ for (let i = 0; i < pairs.length; i++) {
sectionEl.appendChild(this._createRow(sectionEl, pairs[i].left,
pairs[i].right));
}
@@ -38,11 +38,11 @@
};
GrDiffBuilderSideBySide.prototype.addColumns = function(outputEl, fontSize) {
- var width = fontSize * 4;
- var colgroup = document.createElement('colgroup');
+ const width = fontSize * 4;
+ const colgroup = document.createElement('colgroup');
// Add left-side line number.
- var col = document.createElement('col');
+ let col = document.createElement('col');
col.setAttribute('width', width);
colgroup.appendChild(col);
@@ -62,7 +62,7 @@
GrDiffBuilderSideBySide.prototype._createRow = function(section, leftLine,
rightLine) {
- var row = this._createElement('tr');
+ const row = this._createElement('tr');
row.classList.add('diff-row', 'side-by-side');
row.setAttribute('left-type', leftLine.type);
row.setAttribute('right-type', rightLine.type);
@@ -76,15 +76,15 @@
GrDiffBuilderSideBySide.prototype._appendPair = function(section, row, line,
lineNumber, side) {
- var lineEl = this._createLineEl(line, lineNumber, line.type, side);
+ const lineEl = this._createLineEl(line, lineNumber, line.type, side);
lineEl.classList.add(side);
row.appendChild(lineEl);
- var action = this._createContextControl(section, line);
+ const action = this._createContextControl(section, line);
if (action) {
row.appendChild(action);
} else {
- var textEl = this._createTextEl(line, side);
- var threadGroupEl = this._commentThreadGroupForLine(line, side);
+ const textEl = this._createTextEl(line, side);
+ const threadGroupEl = this._commentThreadGroupForLine(line, side);
if (threadGroupEl) {
textEl.appendChild(threadGroupEl);
}
@@ -94,7 +94,7 @@
GrDiffBuilderSideBySide.prototype._getNextContentOnSide = function(
content, side) {
- var tr = content.parentElement.parentElement;
+ let tr = content.parentElement.parentElement;
while (tr = tr.nextSibling) {
content = tr.querySelector(
'td.content .contentText[data-side="' + side + '"]');
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-unified.js b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-unified.js
index 55a6bea..64c8f95 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-unified.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder-unified.js
@@ -24,24 +24,24 @@
GrDiffBuilderUnified.prototype.constructor = GrDiffBuilderUnified;
GrDiffBuilderUnified.prototype.buildSectionElement = function(group) {
- var sectionEl = this._createElement('tbody', 'section');
+ const sectionEl = this._createElement('tbody', 'section');
sectionEl.classList.add(group.type);
if (this._isTotal(group)) {
sectionEl.classList.add('total');
}
- for (var i = 0; i < group.lines.length; ++i) {
+ for (let i = 0; i < group.lines.length; ++i) {
sectionEl.appendChild(this._createRow(sectionEl, group.lines[i]));
}
return sectionEl;
};
GrDiffBuilderUnified.prototype.addColumns = function(outputEl, fontSize) {
- var width = fontSize * 4;
- var colgroup = document.createElement('colgroup');
+ const width = fontSize * 4;
+ const colgroup = document.createElement('colgroup');
// Add left-side line number.
- var col = document.createElement('col');
+ let col = document.createElement('col');
col.setAttribute('width', width);
colgroup.appendChild(col);
@@ -57,8 +57,8 @@
};
GrDiffBuilderUnified.prototype._createRow = function(section, line) {
- var row = this._createElement('tr', line.type);
- var lineEl = this._createLineEl(line, line.beforeNumber,
+ const row = this._createElement('tr', line.type);
+ let lineEl = this._createLineEl(line, line.beforeNumber,
GrDiffLine.Type.REMOVE);
lineEl.classList.add('left');
row.appendChild(lineEl);
@@ -68,12 +68,12 @@
row.appendChild(lineEl);
row.classList.add('diff-row', 'unified');
- var action = this._createContextControl(section, line);
+ const action = this._createContextControl(section, line);
if (action) {
row.appendChild(action);
} else {
- var textEl = this._createTextEl(line);
- var threadGroupEl = this._commentThreadGroupForLine(line);
+ const textEl = this._createTextEl(line);
+ const threadGroupEl = this._commentThreadGroupForLine(line);
if (threadGroupEl) {
textEl.appendChild(threadGroupEl);
}
@@ -84,7 +84,7 @@
GrDiffBuilderUnified.prototype._getNextContentOnSide = function(
content, side) {
- var tr = content.parentElement.parentElement;
+ let tr = content.parentElement.parentElement;
while (tr = tr.nextSibling) {
if (tr.classList.contains('both') || (
(side === 'left' && tr.classList.contains('remove')) ||
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.html b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.html
index d41ad56..e20aecc 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.html
@@ -48,12 +48,12 @@
(function() {
'use strict';
- var DiffViewMode = {
+ const DiffViewMode = {
SIDE_BY_SIDE: 'SIDE_BY_SIDE',
UNIFIED: 'UNIFIED_DIFF',
};
- var TimingLabel = {
+ const TimingLabel = {
TOTAL: 'Diff Total Render',
CONTENT: 'Diff Content Render',
SYNTAX: 'Diff Syntax Render',
@@ -61,9 +61,9 @@
// If any line of the diff is more than the character limit, then disable
// syntax highlighting for the entire file.
- var SYNTAX_MAX_LINE_LENGTH = 500;
+ const SYNTAX_MAX_LINE_LENGTH = 500;
- var TRAILING_WHITESPACE_PATTERN = /\s+$/;
+ const TRAILING_WHITESPACE_PATTERN = /\s+$/;
Polymer({
is: 'gr-diff-builder',
@@ -108,7 +108,7 @@
'_groupsChanged(_groups.splices)',
],
- attached: function() {
+ attached() {
// Setup annotation layers.
this._layers = [
this._createTrailingWhitespaceLayer(),
@@ -118,12 +118,12 @@
this.$.rangeLayer,
];
- this.async(function() {
+ this.async(() => {
this._preRenderThread();
});
},
- render: function(comments, prefs) {
+ render(comments, prefs) {
this.$.syntaxLayer.enabled = prefs.syntax_highlighting;
this._showTabs = !!prefs.show_tabs;
this._showTrailingWhitespace = !!prefs.show_whitespace_errors;
@@ -140,34 +140,35 @@
this._clearDiffContent();
this._builder.addColumns(this.diffElement, prefs.font_size);
- var reporting = this.$.reporting;
+ const reporting = this.$.reporting;
reporting.time(TimingLabel.TOTAL);
reporting.time(TimingLabel.CONTENT);
this.dispatchEvent(new CustomEvent('render-start', {bubbles: true}));
return this.$.processor.process(this.diff.content, this.isImageDiff)
- .then(function() {
- if (this.isImageDiff) {
- this._builder.renderDiffImages();
- }
- this.dispatchEvent(new CustomEvent('render-content',
- {bubbles: true}));
+ .then(() => {
+ if (this.isImageDiff) {
+ this._builder.renderDiffImages();
+ }
+ this.dispatchEvent(new CustomEvent('render-content',
+ {bubbles: true}));
- if (this._anyLineTooLong()) {
- this.$.syntaxLayer.enabled = false;
- }
+ if (this._anyLineTooLong()) {
+ this.$.syntaxLayer.enabled = false;
+ }
- reporting.timeEnd(TimingLabel.CONTENT);
- reporting.time(TimingLabel.SYNTAX);
- return this.$.syntaxLayer.process().then(function() {
- reporting.timeEnd(TimingLabel.SYNTAX);
- reporting.timeEnd(TimingLabel.TOTAL);
- this.dispatchEvent(new CustomEvent('render', {bubbles: true}));
- }.bind(this));
- }.bind(this));
+ reporting.timeEnd(TimingLabel.CONTENT);
+ reporting.time(TimingLabel.SYNTAX);
+ return this.$.syntaxLayer.process().then(() => {
+ reporting.timeEnd(TimingLabel.SYNTAX);
+ reporting.timeEnd(TimingLabel.TOTAL);
+ this.dispatchEvent(
+ new CustomEvent('render', {bubbles: true}));
+ });
+ });
},
- getLineElByChild: function(node) {
+ getLineElByChild(node) {
while (node) {
if (node instanceof Element) {
if (node.classList.contains('lineNum')) {
@@ -182,154 +183,154 @@
return null;
},
- getLineNumberByChild: function(node) {
- var lineEl = this.getLineElByChild(node);
+ getLineNumberByChild(node) {
+ const lineEl = this.getLineElByChild(node);
return lineEl ?
- parseInt(lineEl.getAttribute('data-value'), 10) : null;
+ parseInt(lineEl.getAttribute('data-value'), 10) :
+ null;
},
- getContentByLine: function(lineNumber, opt_side, opt_root) {
+ getContentByLine(lineNumber, opt_side, opt_root) {
return this._builder.getContentByLine(lineNumber, opt_side, opt_root);
},
- getContentByLineEl: function(lineEl) {
- var root = Polymer.dom(lineEl.parentElement);
- var side = this.getSideByLineEl(lineEl);
- var line = lineEl.getAttribute('data-value');
+ getContentByLineEl(lineEl) {
+ const root = Polymer.dom(lineEl.parentElement);
+ const side = this.getSideByLineEl(lineEl);
+ const line = lineEl.getAttribute('data-value');
return this.getContentByLine(line, side, root);
},
- getLineElByNumber: function(lineNumber, opt_side) {
- var sideSelector = !!opt_side ? ('.' + opt_side) : '';
+ getLineElByNumber(lineNumber, opt_side) {
+ const sideSelector = opt_side ? ('.' + opt_side) : '';
return this.diffElement.querySelector(
'.lineNum[data-value="' + lineNumber + '"]' + sideSelector);
},
- getContentsByLineRange: function(startLine, endLine, opt_side) {
- var result = [];
+ getContentsByLineRange(startLine, endLine, opt_side) {
+ const result = [];
this._builder.findLinesByRange(startLine, endLine, opt_side, null,
result);
return result;
},
- getSideByLineEl: function(lineEl) {
+ getSideByLineEl(lineEl) {
return lineEl.classList.contains(GrDiffBuilder.Side.RIGHT) ?
- GrDiffBuilder.Side.RIGHT : GrDiffBuilder.Side.LEFT;
+ GrDiffBuilder.Side.RIGHT : GrDiffBuilder.Side.LEFT;
},
- createCommentThreadGroup: function(changeNum, patchNum, path,
+ createCommentThreadGroup(changeNum, patchNum, path,
isOnParent, commentSide, projectConfig) {
return this._builder.createCommentThreadGroup(changeNum, patchNum,
path, isOnParent, commentSide, projectConfig);
},
- emitGroup: function(group, sectionEl) {
+ emitGroup(group, sectionEl) {
this._builder.emitGroup(group, sectionEl);
},
- showContext: function(newGroups, sectionEl) {
- var groups = this._builder.groups;
- // TODO(viktard): Polyfill findIndex for IE10.
- var contextIndex = groups.findIndex(function(group) {
- return group.element == sectionEl;
- });
- groups.splice.apply(groups, [contextIndex, 1].concat(newGroups));
+ showContext(newGroups, sectionEl) {
+ const groups = this._builder.groups;
- newGroups.forEach(function(newGroup) {
+ const contextIndex = groups.findIndex(group =>
+ group.element === sectionEl
+ );
+ groups.splice(...[contextIndex, 1].concat(newGroups));
+
+ for (const newGroup of newGroups) {
this._builder.emitGroup(newGroup, sectionEl);
- }, this);
+ }
sectionEl.parentNode.removeChild(sectionEl);
- this.async(function() {
- this.fire('render-content');
- }, 1);
+ this.async(() => this.fire('render-content'), 1);
},
- _getDiffBuilder: function(diff, comments, prefs) {
+ _getDiffBuilder(diff, comments, prefs) {
if (this.isImageDiff) {
return new GrDiffBuilderImage(diff, comments, prefs,
- this.diffElement, this.baseImage, this.revisionImage);
+ this.diffElement, this.baseImage, this.revisionImage);
} else if (this.viewMode === DiffViewMode.SIDE_BY_SIDE) {
return new GrDiffBuilderSideBySide(
- diff, comments, prefs, this.diffElement, this._layers);
+ diff, comments, prefs, this.diffElement, this._layers);
} else if (this.viewMode === DiffViewMode.UNIFIED) {
return new GrDiffBuilderUnified(
- diff, comments, prefs, this.diffElement, this._layers);
+ diff, comments, prefs, this.diffElement, this._layers);
}
throw Error('Unsupported diff view mode: ' + this.viewMode);
},
- _clearDiffContent: function() {
+ _clearDiffContent() {
this.diffElement.innerHTML = null;
},
- _getCommentLocations: function(comments) {
- var result = {
+ _getCommentLocations(comments) {
+ const result = {
left: {},
right: {},
};
- for (var side in comments) {
+ for (const side in comments) {
if (side !== GrDiffBuilder.Side.LEFT &&
side !== GrDiffBuilder.Side.RIGHT) {
continue;
}
- comments[side].forEach(function(c) {
+ for (const c of comments[side]) {
result[side][c.line || GrDiffLine.FILE] = true;
- });
+ }
}
return result;
},
- _groupsChanged: function(changeRecord) {
+ _groupsChanged(changeRecord) {
if (!changeRecord) { return; }
- changeRecord.indexSplices.forEach(function(splice) {
- var group;
- for (var i = 0; i < splice.addedCount; i++) {
+ for (const splice of changeRecord.indexSplices) {
+ let group;
+ for (let i = 0; i < splice.addedCount; i++) {
group = splice.object[splice.index + i];
this._builder.groups.push(group);
this._builder.emitGroup(group);
}
- }, this);
+ }
},
- _createIntralineLayer: function() {
+ _createIntralineLayer() {
return {
// Take a DIV.contentText element and a line object with intraline
// differences to highlight and apply them to the element as
// annotations.
- annotate: function(el, line) {
- var HL_CLASS = 'style-scope gr-diff intraline';
- line.highlights.forEach(function(highlight) {
+ annotate(el, line) {
+ const HL_CLASS = 'style-scope gr-diff intraline';
+ for (const highlight of line.highlights) {
// The start and end indices could be the same if a highlight is
// meant to start at the end of a line and continue onto the
// next one. Ignore it.
- if (highlight.startIndex === highlight.endIndex) { return; }
+ if (highlight.startIndex === highlight.endIndex) { continue; }
// If endIndex isn't present, continue to the end of the line.
- var endIndex = highlight.endIndex === undefined ?
- line.text.length : highlight.endIndex;
+ const endIndex = highlight.endIndex === undefined ?
+ line.text.length :
+ highlight.endIndex;
GrAnnotation.annotateElement(
el,
highlight.startIndex,
endIndex - highlight.startIndex,
HL_CLASS);
- });
+ }
},
};
},
- _createTabIndicatorLayer: function() {
- var show = function() { return this._showTabs; }.bind(this);
+ _createTabIndicatorLayer() {
+ const show = () => this._showTabs;
return {
- annotate: function(el, line) {
+ annotate(el, line) {
// If visible tabs are disabled, do nothing.
if (!show()) { return; }
// Find and annotate the locations of tabs.
- var split = line.text.split('\t');
+ const split = line.text.split('\t');
if (!split) { return; }
- for (var i = 0, pos = 0; i < split.length - 1; i++) {
+ for (let i = 0, pos = 0; i < split.length - 1; i++) {
// Skip forward by the length of the content
pos += split[i].length;
@@ -343,22 +344,22 @@
};
},
- _createTrailingWhitespaceLayer: function() {
- var show = function() {
+ _createTrailingWhitespaceLayer() {
+ const show = function() {
return this._showTrailingWhitespace;
}.bind(this);
return {
- annotate: function(el, line) {
+ annotate(el, line) {
if (!show()) { return; }
- var match = line.text.match(TRAILING_WHITESPACE_PATTERN);
+ const match = line.text.match(TRAILING_WHITESPACE_PATTERN);
if (match) {
// Normalize string positions in case there is unicode before or
// within the match.
- var index = GrAnnotation.getStringLength(
+ const index = GrAnnotation.getStringLength(
line.text.substr(0, match.index));
- var length = GrAnnotation.getStringLength(match[0]);
+ const length = GrAnnotation.getStringLength(match[0]);
GrAnnotation.annotateElement(el, index, length,
'style-scope gr-diff trailing-whitespace');
}
@@ -375,11 +376,11 @@
* already exist and the user's comment will be quick to load.
* @see https://gerrit-review.googlesource.com/c/82213/
*/
- _preRenderThread: function() {
- var thread = document.createElement('gr-diff-comment-thread');
+ _preRenderThread() {
+ const thread = document.createElement('gr-diff-comment-thread');
thread.setAttribute('hidden', true);
thread.addDraft();
- var parent = Polymer.dom(this.root);
+ const parent = Polymer.dom(this.root);
parent.appendChild(thread);
Polymer.dom.flush();
parent.removeChild(thread);
@@ -389,9 +390,9 @@
* @return {Boolean} whether any of the lines in _groups are longer
* than SYNTAX_MAX_LINE_LENGTH.
*/
- _anyLineTooLong: function() {
- return this._groups.reduce(function(acc, group) {
- return acc || group.lines.reduce(function(acc, line) {
+ _anyLineTooLong() {
+ return this._groups.reduce((acc, group) => {
+ return acc || group.lines.reduce((acc, line) => {
return acc || line.text.length >= SYNTAX_MAX_LINE_LENGTH;
}, false);
}, false);
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.js b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.js
index c407829..bb23572 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.js
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder.js
@@ -14,8 +14,8 @@
(function(window, GrDiffGroup, GrDiffLine) {
'use strict';
- var HTML_ENTITY_PATTERN = /[&<>"'`\/]/g;
- var HTML_ENTITY_MAP = {
+ const HTML_ENTITY_PATTERN = /[&<>"'`\/]/g;
+ const HTML_ENTITY_MAP = {
'&': '&',
'<': '<',
'>': '>',
@@ -28,7 +28,7 @@
// Prevent redefinition.
if (window.GrDiffBuilder) { return; }
- var REGEX_ASTRAL_SYMBOL = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
+ const REGEX_ASTRAL_SYMBOL = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
function GrDiffBuilder(diff, comments, prefs, outputEl, layers) {
this._diff = diff;
@@ -39,11 +39,11 @@
this.layers = layers || [];
- this.layers.forEach(function(layer) {
+ for (const layer of this.layers) {
if (layer.addListener) {
layer.addListener(this._handleLayerUpdate.bind(this));
}
- }.bind(this));
+ }
}
GrDiffBuilder.LESS_THAN_CODE = '<'.charCodeAt(0);
@@ -76,7 +76,7 @@
ALL: 'all',
};
- var PARTIAL_CONTEXT_AMOUNT = 10;
+ const PARTIAL_CONTEXT_AMOUNT = 10;
/**
* Abstract method
@@ -96,16 +96,16 @@
};
GrDiffBuilder.prototype.emitGroup = function(group, opt_beforeSection) {
- var element = this.buildSectionElement(group);
+ const element = this.buildSectionElement(group);
this._outputEl.insertBefore(element, opt_beforeSection);
group.element = element;
};
GrDiffBuilder.prototype.renderSection = function(element) {
- for (var i = 0; i < this.groups.length; i++) {
- var group = this.groups[i];
+ for (let i = 0; i < this.groups.length; i++) {
+ const group = this.groups[i];
if (group.element === element) {
- var newElement = this.buildSectionElement(group);
+ const newElement = this.buildSectionElement(group);
group.element.parentElement.replaceChild(newElement, group.element);
group.element = newElement;
break;
@@ -115,14 +115,14 @@
GrDiffBuilder.prototype.getGroupsByLineRange = function(
startLine, endLine, opt_side) {
- var groups = [];
- for (var i = 0; i < this.groups.length; i++) {
- var group = this.groups[i];
+ const groups = [];
+ for (let i = 0; i < this.groups.length; i++) {
+ const group = this.groups[i];
if (group.lines.length === 0) {
continue;
}
- var groupStartLine = 0;
- var groupEndLine = 0;
+ let groupStartLine = 0;
+ let groupEndLine = 0;
if (opt_side) {
groupStartLine = group.lineRange[opt_side].start;
groupEndLine = group.lineRange[opt_side].end;
@@ -143,8 +143,8 @@
GrDiffBuilder.prototype.getContentByLine = function(lineNumber, opt_side,
opt_root) {
- var root = Polymer.dom(opt_root || this._outputEl);
- var sideSelector = !!opt_side ? ('.' + opt_side) : '';
+ const root = Polymer.dom(opt_root || this._outputEl);
+ const sideSelector = opt_side ? ('.' + opt_side) : '';
return root.querySelector('td.lineNum[data-value="' + lineNumber +
'"]' + sideSelector + ' ~ td.content .contentText');
};
@@ -162,17 +162,17 @@
*/
GrDiffBuilder.prototype.findLinesByRange = function(start, end, opt_side,
out_lines, out_elements) {
- var groups = this.getGroupsByLineRange(start, end, opt_side);
- groups.forEach(function(group) {
- var content = null;
- group.lines.forEach(function(line) {
+ const groups = this.getGroupsByLineRange(start, end, opt_side);
+ for (const group of groups) {
+ let content = null;
+ for (const line of group.lines) {
if ((opt_side === 'left' && line.type === GrDiffLine.Type.ADD) ||
(opt_side === 'right' && line.type === GrDiffLine.Type.REMOVE)) {
- return;
+ continue;
}
- var lineNumber = opt_side === 'left' ?
+ const lineNumber = opt_side === 'left' ?
line.beforeNumber : line.afterNumber;
- if (lineNumber < start || lineNumber > end) { return; }
+ if (lineNumber < start || lineNumber > end) { continue; }
if (out_lines) { out_lines.push(line); }
if (out_elements) {
@@ -184,8 +184,8 @@
}
if (content) { out_elements.push(content); }
}
- }.bind(this));
- }.bind(this));
+ }
+ }
};
/**
@@ -193,12 +193,12 @@
* diff content.
*/
GrDiffBuilder.prototype._renderContentByRange = function(start, end, side) {
- var lines = [];
- var elements = [];
- var line;
- var el;
+ const lines = [];
+ const elements = [];
+ let line;
+ let el;
this.findLinesByRange(start, end, side, lines, elements);
- for (var i = 0; i < lines.length; i++) {
+ for (let i = 0; i < lines.length; i++) {
line = lines[i];
el = elements[i];
el.parentElement.replaceChild(this._createTextEl(line, side).firstChild,
@@ -209,7 +209,7 @@
GrDiffBuilder.prototype.getSectionsByLineRange = function(
startLine, endLine, opt_side) {
return this.getGroupsByLineRange(startLine, endLine, opt_side).map(
- function(group) { return group.element; });
+ group => { return group.element; });
};
GrDiffBuilder.prototype._commentIsAtLineNum = function(side, lineNum) {
@@ -219,15 +219,15 @@
// TODO(wyatta): Move this completely into the processor.
GrDiffBuilder.prototype._insertContextGroups = function(groups, lines,
hiddenRange) {
- var linesBeforeCtx = lines.slice(0, hiddenRange[0]);
- var hiddenLines = lines.slice(hiddenRange[0], hiddenRange[1]);
- var linesAfterCtx = lines.slice(hiddenRange[1]);
+ const linesBeforeCtx = lines.slice(0, hiddenRange[0]);
+ const hiddenLines = lines.slice(hiddenRange[0], hiddenRange[1]);
+ const linesAfterCtx = lines.slice(hiddenRange[1]);
if (linesBeforeCtx.length > 0) {
groups.push(new GrDiffGroup(GrDiffGroup.Type.BOTH, linesBeforeCtx));
}
- var ctxLine = new GrDiffLine(GrDiffLine.Type.CONTEXT_CONTROL);
+ const ctxLine = new GrDiffLine(GrDiffLine.Type.CONTEXT_CONTROL);
ctxLine.contextGroup =
new GrDiffGroup(GrDiffGroup.Type.BOTH, hiddenLines);
groups.push(new GrDiffGroup(GrDiffGroup.Type.CONTEXT_CONTROL,
@@ -243,8 +243,8 @@
return null;
}
- var td = this._createElement('td');
- var showPartialLinks =
+ const td = this._createElement('td');
+ const showPartialLinks =
line.contextGroup.lines.length > PARTIAL_CONTEXT_AMOUNT;
if (showPartialLinks) {
@@ -266,14 +266,14 @@
};
GrDiffBuilder.prototype._createContextButton = function(type, section, line) {
- var contextLines = line.contextGroup.lines;
- var context = PARTIAL_CONTEXT_AMOUNT;
+ const contextLines = line.contextGroup.lines;
+ const context = PARTIAL_CONTEXT_AMOUNT;
- var button = this._createElement('gr-button', 'showContext');
+ const button = this._createElement('gr-button', 'showContext');
button.setAttribute('link', true);
- var text;
- var groups = []; // The groups that replace this one if tapped.
+ let text;
+ const groups = []; // The groups that replace this one if tapped.
if (type === GrDiffBuilder.ContextButtonType.ALL) {
text = 'Show ' + contextLines.length + ' common line';
@@ -291,10 +291,10 @@
button.textContent = text;
- button.addEventListener('tap', function(e) {
+ button.addEventListener('tap', e => {
e.detail = {
- groups: groups,
- section: section,
+ groups,
+ section,
};
// Let it bubble up the DOM tree.
});
@@ -310,15 +310,15 @@
(c.line === undefined && lineNum === GrDiffLine.FILE);
};
}
- var leftComments =
+ const leftComments =
comments[GrDiffBuilder.Side.LEFT].filter(byLineNum(line.beforeNumber));
- var rightComments =
+ const rightComments =
comments[GrDiffBuilder.Side.RIGHT].filter(byLineNum(line.afterNumber));
- leftComments.forEach(function(c) { c.__commentSide = 'left'; });
- rightComments.forEach(function(c) { c.__commentSide = 'right'; });
+ leftComments.forEach(c => { c.__commentSide = 'left'; });
+ rightComments.forEach(c => { c.__commentSide = 'right'; });
- var result;
+ let result;
switch (opt_side) {
case GrDiffBuilder.Side.LEFT:
@@ -337,7 +337,7 @@
GrDiffBuilder.prototype.createCommentThreadGroup = function(changeNum,
patchNum, path, isOnParent, projectConfig, range) {
- var threadGroupEl =
+ const threadGroupEl =
document.createElement('gr-diff-comment-thread-group');
threadGroupEl.changeNum = changeNum;
threadGroupEl.patchForNewThreads = patchNum;
@@ -348,24 +348,25 @@
return threadGroupEl;
};
- GrDiffBuilder.prototype._commentThreadGroupForLine =
- function(line, opt_side) {
- var comments = this._getCommentsForLine(this._comments, line, opt_side);
+ GrDiffBuilder.prototype._commentThreadGroupForLine = function(line,
+ opt_side) {
+ const comments =
+ this._getCommentsForLine(this._comments, line, opt_side);
if (!comments || comments.length === 0) {
return null;
}
- var patchNum = this._comments.meta.patchRange.patchNum;
- var isOnParent = comments[0].side === 'PARENT' || false;
+ let patchNum = this._comments.meta.patchRange.patchNum;
+ let isOnParent = comments[0].side === 'PARENT' || false;
if (line.type === GrDiffLine.Type.REMOVE ||
- opt_side === GrDiffBuilder.Side.LEFT) {
+ opt_side === GrDiffBuilder.Side.LEFT) {
if (this._comments.meta.patchRange.basePatchNum === 'PARENT') {
isOnParent = true;
} else {
patchNum = this._comments.meta.patchRange.basePatchNum;
}
}
- var threadGroupEl = this.createCommentThreadGroup(
+ const threadGroupEl = this.createCommentThreadGroup(
this._comments.meta.changeNum,
patchNum,
this._comments.meta.path,
@@ -380,7 +381,7 @@
GrDiffBuilder.prototype._createLineEl = function(line, number, type,
opt_class) {
- var td = this._createElement('td');
+ const td = this._createElement('td');
if (opt_class) {
td.classList.add(opt_class);
}
@@ -397,13 +398,13 @@
};
GrDiffBuilder.prototype._createTextEl = function(line, opt_side) {
- var td = this._createElement('td');
- var text = line.text;
+ const td = this._createElement('td');
+ const text = line.text;
if (line.type !== GrDiffLine.Type.BLANK) {
td.classList.add('content');
}
td.classList.add(line.type);
- var html = this._escapeHTML(text);
+ let html = this._escapeHTML(text);
html = this._addTabWrappers(html, this._prefs.tab_size);
if (!this._prefs.line_wrapping &&
this._textLength(text, this._prefs.tab_size) >
@@ -411,7 +412,7 @@
html = this._addNewlines(text, html);
}
- var contentText = this._createElement('div', 'contentText');
+ const contentText = this._createElement('div', 'contentText');
if (opt_side) {
contentText.setAttribute('data-side', opt_side);
}
@@ -424,9 +425,9 @@
contentText.innerHTML = html;
}
- this.layers.forEach(function(layer) {
+ for (const layer of this.layers) {
layer.annotate(contentText, line);
- });
+ }
td.appendChild(contentText);
@@ -439,8 +440,8 @@
*/
GrDiffBuilder.prototype._textLength = function(text, tabSize) {
text = text.replace(REGEX_ASTRAL_SYMBOL, '_');
- var numChars = 0;
- for (var i = 0; i < text.length; i++) {
+ let numChars = 0;
+ for (let i = 0; i < text.length; i++) {
if (text[i] === '\t') {
numChars += tabSize - (numChars % tabSize);
} else {
@@ -488,11 +489,11 @@
};
GrDiffBuilder.prototype._addNewlines = function(text, html) {
- var htmlIndex = 0;
- var indices = [];
- var numChars = 0;
- var prevHtmlIndex = 0;
- for (var i = 0; i < text.length; i++) {
+ let htmlIndex = 0;
+ const indices = [];
+ let numChars = 0;
+ let prevHtmlIndex = 0;
+ for (let i = 0; i < text.length; i++) {
if (numChars > 0 && numChars % this._prefs.line_length === 0) {
indices.push(htmlIndex);
}
@@ -512,11 +513,11 @@
}
prevHtmlIndex = htmlIndex;
}
- var result = html;
+ let result = html;
// Since the result string is being altered in place, start from the end
// of the string so that the insertion indices are not affected as the
// result string changes.
- for (var i = indices.length - 1; i >= 0; i--) {
+ for (let i = indices.length - 1; i >= 0; i--) {
result = result.slice(0, indices[i]) + GrDiffBuilder.LINE_FEED_HTML +
result.slice(indices[i]);
}
@@ -535,12 +536,12 @@
GrDiffBuilder.prototype._addTabWrappers = function(line, tabSize) {
if (!line.length) { return ''; }
- var result = '';
- var offset = 0;
- var split = line.split('\t');
- var width;
+ let result = '';
+ let offset = 0;
+ const split = line.split('\t');
+ let width;
- for (var i = 0; i < split.length - 1; i++) {
+ for (let i = 0; i < split.length - 1; i++) {
offset += split[i].length;
width = tabSize - (offset % tabSize);
result += split[i] + this._getTabWrapper(width);
@@ -560,7 +561,7 @@
throw Error('Invalid tab size from preferences.');
}
- var str = '<span class="style-scope gr-diff tab ';
+ let str = '<span class="style-scope gr-diff tab ';
str += '" style="';
// TODO(andybons): CSS tab-size is not supported in IE.
str += 'tab-size:' + tabSize + ';';
@@ -570,7 +571,7 @@
};
GrDiffBuilder.prototype._createElement = function(tagName, className) {
- var el = document.createElement(tagName);
+ const el = document.createElement(tagName);
// When Shady DOM is being used, these classes are added to account for
// Polymer's polyfill behavior. In order to guarantee sufficient
// specificity within the CSS rules, these are added to every element.
@@ -578,7 +579,7 @@
// automatically) are not being used for performance reasons, this is
// done manually.
el.classList.add('style-scope', 'gr-diff');
- if (!!className) {
+ if (className) {
el.classList.add(className);
}
return el;
@@ -612,7 +613,7 @@
};
GrDiffBuilder.prototype._escapeHTML = function(str) {
- return str.replace(HTML_ENTITY_PATTERN, function(s) {
+ return str.replace(HTML_ENTITY_PATTERN, s => {
return HTML_ENTITY_MAP[s];
});
};
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder_test.html b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder_test.html
index 591fa9c..6c4a9d9 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder_test.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff-builder/gr-diff-builder_test.html
@@ -54,15 +54,15 @@
</test-fixture>
<script>
- suite('gr-diff-builder tests', function() {
- var element;
- var builder;
+ suite('gr-diff-builder tests', () => {
+ let element;
+ let builder;
- setup(function() {
+ setup(() => {
stub('gr-rest-api-interface', {
- getLoggedIn: function() { return Promise.resolve(false); },
+ getLoggedIn() { return Promise.resolve(false); },
});
- var prefs = {
+ const prefs = {
line_length: 10,
show_tabs: true,
tab_size: 4,
@@ -70,18 +70,18 @@
builder = new GrDiffBuilder({content: []}, {left: [], right: []}, prefs);
});
- test('context control buttons', function() {
- var section = {};
- var line = {contextGroup: {lines: []}};
+ test('context control buttons', () => {
+ const section = {};
+ const line = {contextGroup: {lines: []}};
// Create 10 lines.
- for (var i = 0; i < 10; i++) {
+ for (let i = 0; i < 10; i++) {
line.contextGroup.lines.push('lorem upsum');
}
// Does not include +10 buttons when there are fewer than 11 lines.
- var td = builder._createContextControl(section, line);
- var buttons = td.querySelectorAll('gr-button.showContext');
+ let td = builder._createContextControl(section, line);
+ let buttons = td.querySelectorAll('gr-button.showContext');
assert.equal(buttons.length, 1);
assert.equal(buttons[0].textContent, 'Show 10 common lines');
@@ -99,8 +99,8 @@
assert.equal(buttons[2].textContent, '+10↓');
});
- test('newlines 1', function() {
- var text = 'abcdef';
+ test('newlines 1', () => {
+ let text = 'abcdef';
assert.equal(builder._addNewlines(text, text), text);
text = 'a'.repeat(20);
assert.equal(builder._addNewlines(text, text),
@@ -109,9 +109,10 @@
'a'.repeat(10));
});
- test('newlines 2', function() {
- var text = '<span class="thumbsup">👍</span>';
- var html = '<span class="thumbsup">👍</span>';
+ test('newlines 2', () => {
+ const text = '<span class="thumbsup">👍</span>';
+ const html =
+ '<span class="thumbsup">👍</span>';
assert.equal(builder._addNewlines(text, html),
'<span clas' +
GrDiffBuilder.LINE_FEED_HTML +
@@ -122,23 +123,23 @@
'n>');
});
- test('newlines 3', function() {
- var text = '01234\t56789';
- var html = '01234<span>\t</span>56789';
+ test('newlines 3', () => {
+ const text = '01234\t56789';
+ const html = '01234<span>\t</span>56789';
assert.equal(builder._addNewlines(text, html),
'01234<span>\t</span>5' +
GrDiffBuilder.LINE_FEED_HTML +
'6789');
});
- test('_addNewlines not called if line_wrapping is true', function(done) {
+ test('_addNewlines not called if line_wrapping is true', done => {
builder._prefs = {line_wrapping: true, tab_size: 4, line_length: 50};
- var text = (new Array(52)).join('a');
+ const text = (new Array(52)).join('a');
- var line = {text: text, highlights: []};
- var newLineStub = sinon.stub(builder, '_addNewlines');
+ const line = {text, highlights: []};
+ const newLineStub = sinon.stub(builder, '_addNewlines');
builder._createTextEl(line);
- flush(function() {
+ flush(() => {
assert.isFalse(newLineStub.called);
newLineStub.restore();
done();
@@ -146,33 +147,33 @@
});
test('_addNewlines called if line_wrapping is true and meets other ' +
- 'conditions', function(done) {
+ 'conditions', done => {
builder._prefs = {line_wrapping: false, tab_size: 4, line_length: 50};
- var text = (new Array(52)).join('a');
+ const text = (new Array(52)).join('a');
- var line = {text: text, highlights: []};
- var newLineStub = sinon.stub(builder, '_addNewlines');
+ const line = {text, highlights: []};
+ const newLineStub = sinon.stub(builder, '_addNewlines');
builder._createTextEl(line);
- flush(function() {
+ flush(() => {
assert.isTrue(newLineStub.called);
newLineStub.restore();
done();
});
});
- test('_createTextEl linewrap with tabs', function() {
- var text = _.times(7, _.constant('\t')).join('') + '!';
- var line = {text: text, highlights: []};
- var el = builder._createTextEl(line);
- var tabEl = el.querySelector('.contentText > .br');
+ test('_createTextEl linewrap with tabs', () => {
+ const text = _.times(7, _.constant('\t')).join('') + '!';
+ const line = {text, highlights: []};
+ const el = builder._createTextEl(line);
+ const tabEl = el.querySelector('.contentText > .br');
assert.isOk(tabEl);
assert.equal(
el.querySelector('.contentText .tab:nth-child(2)').nextSibling,
tabEl);
});
- test('text length with tabs and unicode', function() {
+ test('text length with tabs and unicode', () => {
assert.equal(builder._textLength('12345', 4), 5);
assert.equal(builder._textLength('\t\t12', 4), 10);
assert.equal(builder._textLength('abc💢123', 4), 7);
@@ -186,9 +187,9 @@
assert.equal(builder._textLength('\t\t\t\t\t', 20), 100);
});
- test('tab wrapper insertion', function() {
- var html = 'abc\tdef';
- var wrapper = builder._getTabWrapper(
+ test('tab wrapper insertion', () => {
+ const html = 'abc\tdef';
+ const wrapper = builder._getTabWrapper(
builder._prefs.tab_size - 3,
builder._prefs.show_tabs);
assert.ok(wrapper);
@@ -202,12 +203,12 @@
true));
});
- test('comments', function() {
- var line = new GrDiffLine(GrDiffLine.Type.BOTH);
+ test('comments', () => {
+ const line = new GrDiffLine(GrDiffLine.Type.BOTH);
line.beforeNumber = 3;
line.afterNumber = 5;
- var comments = {left: [], right: []};
+ let comments = {left: [], right: []};
assert.deepEqual(builder._getCommentsForLine(comments, line), []);
assert.deepEqual(builder._getCommentsForLine(comments, line,
GrDiffBuilder.Side.LEFT), []);
@@ -229,19 +230,19 @@
{id: 'r5', line: 5, __commentSide: 'right'}]);
assert.deepEqual(builder._getCommentsForLine(comments, line,
GrDiffBuilder.Side.LEFT), [{id: 'l3', line: 3,
- __commentSide: 'left'}]);
+ __commentSide: 'left'}]);
assert.deepEqual(builder._getCommentsForLine(comments, line,
GrDiffBuilder.Side.RIGHT), [{id: 'r5', line: 5,
- __commentSide: 'right'}]);
+ __commentSide: 'right'}]);
});
- test('comment thread group creation', function() {
- var l3 = {id: 'l3', line: 3, updated: '2016-08-09 00:42:32.000000000',
- __commentSide: 'left'};
- var l5 = {id: 'l5', line: 5, updated: '2016-08-09 00:42:32.000000000',
- __commentSide: 'left'};
- var r5 = {id: 'r5', line: 5, updated: '2016-08-09 00:42:32.000000000',
- __commentSide: 'right'};
+ test('comment thread group creation', () => {
+ const l3 = {id: 'l3', line: 3, updated: '2016-08-09 00:42:32.000000000',
+ __commentSide: 'left'};
+ const l5 = {id: 'l5', line: 5, updated: '2016-08-09 00:42:32.000000000',
+ __commentSide: 'left'};
+ const r5 = {id: 'r5', line: 5, updated: '2016-08-09 00:42:32.000000000',
+ __commentSide: 'right'};
builder._comments = {
meta: {
@@ -267,10 +268,10 @@
assert.deepEqual(threadGroupEl.comments, comments);
}
- var line = new GrDiffLine(GrDiffLine.Type.BOTH);
+ let line = new GrDiffLine(GrDiffLine.Type.BOTH);
line.beforeNumber = 5;
line.afterNumber = 5;
- var threadGroupEl = builder._commentThreadGroupForLine(line);
+ let threadGroupEl = builder._commentThreadGroupForLine(line);
checkThreadGroupProps(threadGroupEl, '3', false, [l5, r5]);
threadGroupEl =
@@ -306,51 +307,51 @@
line.beforeNumber = 3;
line.afterNumber = 5;
threadGroupEl = builder._commentThreadGroupForLine(line);
- checkThreadGroupProps(threadGroupEl, '3', false, [l3, r5]);
+ checkThreadGroupProps(threadGroupEl, '3', false, [l3, r5]);
});
- suite('_isTotal', function() {
- test('is total for add', function() {
- var group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
- for (var idx = 0; idx < 10; idx++) {
+ suite('_isTotal', () => {
+ test('is total for add', () => {
+ const group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
+ for (let idx = 0; idx < 10; idx++) {
group.addLine(new GrDiffLine(GrDiffLine.Type.ADD));
}
assert.isTrue(GrDiffBuilder.prototype._isTotal(group));
});
- test('is total for remove', function() {
- var group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
- for (var idx = 0; idx < 10; idx++) {
+ test('is total for remove', () => {
+ const group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
+ for (let idx = 0; idx < 10; idx++) {
group.addLine(new GrDiffLine(GrDiffLine.Type.REMOVE));
}
assert.isTrue(GrDiffBuilder.prototype._isTotal(group));
});
- test('not total for empty', function() {
- var group = new GrDiffGroup(GrDiffGroup.Type.BOTH);
+ test('not total for empty', () => {
+ const group = new GrDiffGroup(GrDiffGroup.Type.BOTH);
assert.isFalse(GrDiffBuilder.prototype._isTotal(group));
});
- test('not total for non-delta', function() {
- var group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
- for (var idx = 0; idx < 10; idx++) {
+ test('not total for non-delta', () => {
+ const group = new GrDiffGroup(GrDiffGroup.Type.DELTA);
+ for (let idx = 0; idx < 10; idx++) {
group.addLine(new GrDiffLine(GrDiffLine.Type.BOTH));
}
assert.isFalse(GrDiffBuilder.prototype._isTotal(group));
});
});
- suite('intraline differences', function() {
- var el;
- var str;
- var annotateElementSpy;
- var layer;
+ suite('intraline differences', () => {
+ let el;
+ let str;
+ let annotateElementSpy;
+ let layer;
function slice(str, start, end) {
return Array.from(str).slice(start, end).join('');
}
- setup(function() {
+ setup(() => {
el = fixture('div-with-text');
str = el.textContent;
annotateElementSpy = sinon.spy(GrAnnotation, 'annotateElement');
@@ -358,12 +359,12 @@
._createIntralineLayer();
});
- teardown(function() {
+ teardown(() => {
annotateElementSpy.restore();
});
- test('annotate no highlights', function() {
- var line = {
+ test('annotate no highlights', () => {
+ const line = {
text: str,
highlights: [],
};
@@ -377,19 +378,19 @@
assert.equal(str, el.childNodes[0].textContent);
});
- test('annotate with highlights', function() {
- var line = {
+ test('annotate with highlights', () => {
+ const line = {
text: str,
highlights: [
{startIndex: 6, endIndex: 12},
{startIndex: 18, endIndex: 22},
],
};
- var str0 = slice(str, 0, 6);
- var str1 = slice(str, 6, 12);
- var str2 = slice(str, 12, 18);
- var str3 = slice(str, 18, 22);
- var str4 = slice(str, 22);
+ const str0 = slice(str, 0, 6);
+ const str1 = slice(str, 6, 12);
+ const str2 = slice(str, 12, 18);
+ const str3 = slice(str, 18, 22);
+ const str4 = slice(str, 22);
layer.annotate(el, line);
@@ -412,16 +413,16 @@
assert.equal(el.childNodes[4].textContent, str4);
});
- test('annotate without endIndex', function() {
- var line = {
+ test('annotate without endIndex', () => {
+ const line = {
text: str,
highlights: [
{startIndex: 28},
],
};
- var str0 = slice(str, 0, 28);
- var str1 = slice(str, 28);
+ const str0 = slice(str, 0, 28);
+ const str1 = slice(str, 28);
layer.annotate(el, line);
@@ -435,8 +436,8 @@
assert.equal(el.childNodes[1].textContent, str1);
});
- test('annotate ignores empty highlights', function() {
- var line = {
+ test('annotate ignores empty highlights', () => {
+ const line = {
text: str,
highlights: [
{startIndex: 28, endIndex: 28},
@@ -449,20 +450,20 @@
assert.equal(el.childNodes.length, 1);
});
- test('annotate handles unicode', function() {
+ test('annotate handles unicode', () => {
// Put some unicode into the string:
str = str.replace(/\s/g, '💢');
el.textContent = str;
- var line = {
+ const line = {
text: str,
highlights: [
{startIndex: 6, endIndex: 12},
],
};
- var str0 = slice(str, 0, 6);
- var str1 = slice(str, 6, 12);
- var str2 = slice(str, 12);
+ const str0 = slice(str, 0, 6);
+ const str1 = slice(str, 6, 12);
+ const str2 = slice(str, 12);
layer.annotate(el, line);
@@ -479,20 +480,20 @@
assert.equal(el.childNodes[2].textContent, str2);
});
- test('annotate handles unicode w/o endIndex', function() {
+ test('annotate handles unicode w/o endIndex', () => {
// Put some unicode into the string:
str = str.replace(/\s/g, '💢');
el.textContent = str;
- var line = {
+ const line = {
text: str,
highlights: [
{startIndex: 6},
],
};
- var str0 = slice(str, 0, 6);
- var str1 = slice(str, 6);
+ const str0 = slice(str, 0, 6);
+ const str1 = slice(str, 6);
layer.annotate(el, line);
@@ -507,87 +508,92 @@
});
});
- suite('tab indicators', function() {
- var sandbox;
- var element;
- var layer;
+ suite('tab indicators', () => {
+ let sandbox;
+ let element;
+ let layer;
- setup(function() {
+ setup(() => {
sandbox = sinon.sandbox.create();
element = fixture('basic');
element._showTabs = true;
layer = element._createTabIndicatorLayer();
});
- teardown(function() {
+ teardown(() => {
sandbox.restore();
});
- test('does nothing with empty line', function() {
- var line = {text: ''};
- var el = document.createElement('div');
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ test('does nothing with empty line', () => {
+ const line = {text: ''};
+ const el = document.createElement('div');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
- test('does nothing with no tabs', function() {
- var str = 'lorem ipsum no tabs';
- var line = {text: str};
- var el = document.createElement('div');
+ test('does nothing with no tabs', () => {
+ const str = 'lorem ipsum no tabs';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
- test('annotates tab at beginning', function() {
- var str = '\tlorem upsum';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates tab at beginning', () => {
+ const str = '\tlorem upsum';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.equal(annotateElementStub.callCount, 1);
- var args = annotateElementStub.getCalls()[0].args;
+ const args = annotateElementStub.getCalls()[0].args;
assert.equal(args[0], el);
assert.equal(args[1], 0, 'offset of tab indicator');
assert.equal(args[2], 1, 'length of tab indicator');
assert.include(args[3], 'tab-indicator');
});
- test('does not annotate when disabled', function() {
+ test('does not annotate when disabled', () => {
element._showTabs = false;
- var str = '\tlorem upsum';
- var line = {text: str};
- var el = document.createElement('div');
+ const str = '\tlorem upsum';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
- test('annotates multiple in beginning', function() {
- var str = '\t\tlorem upsum';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates multiple in beginning', () => {
+ const str = '\t\tlorem upsum';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.equal(annotateElementStub.callCount, 2);
- var args = annotateElementStub.getCalls()[0].args;
+ let args = annotateElementStub.getCalls()[0].args;
assert.equal(args[0], el);
assert.equal(args[1], 0, 'offset of tab indicator');
assert.equal(args[2], 1, 'length of tab indicator');
@@ -600,17 +606,18 @@
assert.include(args[3], 'tab-indicator');
});
- test('annotates intermediate tabs', function() {
- var str = 'lorem\tupsum';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates intermediate tabs', () => {
+ const str = 'lorem\tupsum';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.equal(annotateElementStub.callCount, 1);
- var args = annotateElementStub.getCalls()[0].args;
+ const args = annotateElementStub.getCalls()[0].args;
assert.equal(args[0], el);
assert.equal(args[1], 5, 'offset of tab indicator');
assert.equal(args[2], 1, 'length of tab indicator');
@@ -618,108 +625,115 @@
});
});
- suite('trailing whitespace', function() {
- var sandbox;
- var element;
- var layer;
+ suite('trailing whitespace', () => {
+ let sandbox;
+ let element;
+ let layer;
- setup(function() {
+ setup(() => {
sandbox = sinon.sandbox.create();
element = fixture('basic');
element._showTrailingWhitespace = true;
layer = element._createTrailingWhitespaceLayer();
});
- teardown(function() {
+ teardown(() => {
sandbox.restore();
});
- test('does nothing with empty line', function() {
- var line = {text: ''};
- var el = document.createElement('div');
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ test('does nothing with empty line', () => {
+ const line = {text: ''};
+ const el = document.createElement('div');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
- test('does nothing with no trailing whitespace', function() {
- var str = 'lorem ipsum blah blah';
- var line = {text: str};
- var el = document.createElement('div');
+ test('does nothing with no trailing whitespace', () => {
+ const str = 'lorem ipsum blah blah';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
- test('annotates trailing spaces', function() {
- var str = 'lorem ipsum ';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates trailing spaces', () => {
+ const str = 'lorem ipsum ';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isTrue(annotateElementStub.called);
assert.equal(annotateElementStub.lastCall.args[1], 11);
assert.equal(annotateElementStub.lastCall.args[2], 3);
});
- test('annotates trailing tabs', function() {
- var str = 'lorem ipsum\t\t\t';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates trailing tabs', () => {
+ const str = 'lorem ipsum\t\t\t';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isTrue(annotateElementStub.called);
assert.equal(annotateElementStub.lastCall.args[1], 11);
assert.equal(annotateElementStub.lastCall.args[2], 3);
});
- test('annotates mixed trailing whitespace', function() {
- var str = 'lorem ipsum\t \t';
- var line = {text: str};
- var el = document.createElement('div');
+ test('annotates mixed trailing whitespace', () => {
+ const str = 'lorem ipsum\t \t';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isTrue(annotateElementStub.called);
assert.equal(annotateElementStub.lastCall.args[1], 11);
assert.equal(annotateElementStub.lastCall.args[2], 3);
});
- test('unicode preceding trailing whitespace', function() {
- var str = '💢\t';
- var line = {text: str};
- var el = document.createElement('div');
+ test('unicode preceding trailing whitespace', () => {
+ const str = '💢\t';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isTrue(annotateElementStub.called);
assert.equal(annotateElementStub.lastCall.args[1], 1);
assert.equal(annotateElementStub.lastCall.args[2], 1);
});
- test('does not annotate when disabled', function() {
+ test('does not annotate when disabled', () => {
element._showTrailingWhitespace = false;
- var str = 'lorem upsum\t \t ';
- var line = {text: str};
- var el = document.createElement('div');
+ const str = 'lorem upsum\t \t ';
+ const line = {text: str};
+ const el = document.createElement('div');
el.textContent = str;
- var annotateElementStub = sandbox.stub(GrAnnotation, 'annotateElement');
+ const annotateElementStub =
+ sandbox.stub(GrAnnotation, 'annotateElement');
layer.annotate(el, line);
assert.isFalse(annotateElementStub.called);
});
});
- suite('rendering', function() {
- var content;
- var outputEl;
- var sandbox;
+ suite('rendering', () => {
+ let content;
+ let outputEl;
+ let sandbox;
- setup(function(done) {
+ setup(done => {
sandbox = sinon.sandbox.create();
- var prefs = {
+ const prefs = {
line_length: 10,
show_tabs: true,
tab_size: 4,
@@ -729,13 +743,13 @@
content = [
{
a: ['all work and no play make andybons a dull boy'],
- b: ['elgoog elgoog elgoog']
+ b: ['elgoog elgoog elgoog'],
},
{
ab: [
'Non eram nescius, Brute, cum, quae summis ingeniis ',
'exquisitaque doctrina philosophi Graeco sermone tractavissent',
- ]
+ ],
},
];
stub('gr-reporting', {
@@ -744,30 +758,30 @@
});
element = fixture('basic');
outputEl = element.queryEffectiveChildren('#diffTable');
- sandbox.stub(element, '_getDiffBuilder', function() {
- var builder = new GrDiffBuilder(
- {content: content}, {left: [], right: []}, prefs, outputEl);
+ sandbox.stub(element, '_getDiffBuilder', () => {
+ const builder = new GrDiffBuilder(
+ {content}, {left: [], right: []}, prefs, outputEl);
sandbox.stub(builder, 'addColumns');
builder.buildSectionElement = function(group) {
- var section = document.createElement('stub');
- section.textContent = group.lines.reduce(function(acc, line) {
+ const section = document.createElement('stub');
+ section.textContent = group.lines.reduce((acc, line) => {
return acc + line.text;
}, '');
return section;
};
return builder;
});
- element.diff = {content: content};
+ element.diff = {content};
element.render({left: [], right: []}, prefs).then(done);
});
- teardown(function() {
+ teardown(() => {
sandbox.restore();
});
- test('reporting', function(done) {
- var timeStub = element.$.reporting.time;
- var timeEndStub = element.$.reporting.timeEnd;
+ test('reporting', done => {
+ const timeStub = element.$.reporting.time;
+ const timeEndStub = element.$.reporting.timeEnd;
assert.isTrue(timeStub.calledWithExactly('Diff Total Render'));
assert.isTrue(timeStub.calledWithExactly('Diff Content Render'));
assert.isTrue(timeStub.calledWithExactly('Diff Syntax Render'));
@@ -777,43 +791,43 @@
done();
});
- test('renderSection', function() {
- var section = outputEl.querySelector('stub:nth-of-type(2)');
- var prevInnerHTML = section.innerHTML;
+ test('renderSection', () => {
+ let section = outputEl.querySelector('stub:nth-of-type(2)');
+ const prevInnerHTML = section.innerHTML;
section.innerHTML = 'wiped';
element._builder.renderSection(section);
section = outputEl.querySelector('stub:nth-of-type(2)');
assert.equal(section.innerHTML, prevInnerHTML);
});
- test('addColumns is called', function(done) {
+ test('addColumns is called', done => {
element.render({left: [], right: []}, {}).then(done);
assert.isTrue(element._builder.addColumns.called);
});
- test('getSectionsByLineRange one line', function() {
- var section = outputEl.querySelector('stub:nth-of-type(2)');
- var sections = element._builder.getSectionsByLineRange(1, 1, 'left');
+ test('getSectionsByLineRange one line', () => {
+ const section = outputEl.querySelector('stub:nth-of-type(2)');
+ const sections = element._builder.getSectionsByLineRange(1, 1, 'left');
assert.equal(sections.length, 1);
assert.strictEqual(sections[0], section);
});
- test('getSectionsByLineRange over diff', function() {
- var section = [
+ test('getSectionsByLineRange over diff', () => {
+ const section = [
outputEl.querySelector('stub:nth-of-type(2)'),
outputEl.querySelector('stub:nth-of-type(3)'),
];
- var sections = element._builder.getSectionsByLineRange(1, 2, 'left');
+ const sections = element._builder.getSectionsByLineRange(1, 2, 'left');
assert.equal(sections.length, 2);
assert.strictEqual(sections[0], section[0]);
assert.strictEqual(sections[1], section[1]);
});
- test('render-start and render are fired', function(done) {
- var dispatchEventStub = sinon.stub(element, 'dispatchEvent');
- element.render({left: [], right: []}, {}).then(function() {
- var firedEventTypes = dispatchEventStub.getCalls()
- .map(function(c) { return c.args[0].type; });
+ test('render-start and render are fired', done => {
+ const dispatchEventStub = sinon.stub(element, 'dispatchEvent');
+ element.render({left: [], right: []}, {}).then(() => {
+ const firedEventTypes = dispatchEventStub.getCalls()
+ .map(c => { return c.args[0].type; });
assert.include(firedEventTypes, 'render-start');
assert.include(firedEventTypes, 'render-content');
assert.include(firedEventTypes, 'render');
@@ -821,18 +835,18 @@
});
});
- test('rendering normal-sized diff does not disable syntax', function() {
+ test('rendering normal-sized diff does not disable syntax', () => {
assert.isTrue(element.$.syntaxLayer.enabled);
});
- test('rendering large diff disables syntax', function(done) {
+ test('rendering large diff disables syntax', done => {
// Before it renders, set the first diff line to 500 '*' characters.
element.diff.content[0].a = [new Array(501).join('*')];
- element.addEventListener('render', function() {
+ element.addEventListener('render', () => {
assert.isFalse(element.$.syntaxLayer.enabled);
done();
});
- var prefs = {
+ const prefs = {
line_length: 10,
show_tabs: true,
tab_size: 4,
@@ -843,13 +857,13 @@
});
});
- suite('mock-diff', function() {
- var element;
- var builder;
- var diff;
- var prefs;
+ suite('mock-diff', () => {
+ let element;
+ let builder;
+ let diff;
+ let prefs;
- setup(function(done) {
+ setup(done => {
element = fixture('mock-diff');
diff = document.createElement('mock-diff-response').diffResponse;
element.diff = diff;
@@ -860,14 +874,14 @@
tab_size: 4,
};
- element.render({left: [], right: []}, prefs).then(function() {
+ element.render({left: [], right: []}, prefs).then(() => {
builder = element._builder;
done();
});
});
- test('getContentByLine', function() {
- var actual;
+ test('getContentByLine', () => {
+ let actual;
actual = builder.getContentByLine(2, 'left');
assert.equal(actual.textContent, diff.content[0].ab[1]);
@@ -882,19 +896,19 @@
assert.equal(actual.textContent, diff.content[1].b[0]);
});
- test('findLinesByRange', function() {
- var lines = [];
- var elems = [];
- var start = 6;
- var end = 10;
- var count = end - start + 1;
+ test('findLinesByRange', () => {
+ const lines = [];
+ const elems = [];
+ const start = 6;
+ const end = 10;
+ const count = end - start + 1;
builder.findLinesByRange(start, end, 'right', lines, elems);
assert.equal(lines.length, count);
assert.equal(elems.length, count);
- for (var i = 0; i < 5; i++) {
+ for (let i = 0; i < 5; i++) {
assert.instanceOf(lines[i], GrDiffLine);
assert.equal(lines[i].afterNumber, start + i);
assert.instanceOf(elems[i], HTMLElement);
@@ -902,59 +916,59 @@
}
});
- test('_renderContentByRange', function() {
- var spy = sinon.spy(builder, '_createTextEl');
- var start = 9;
- var end = 14;
- var count = end - start + 1;
+ test('_renderContentByRange', () => {
+ const spy = sinon.spy(builder, '_createTextEl');
+ const start = 9;
+ const end = 14;
+ const count = end - start + 1;
builder._renderContentByRange(start, end, 'left');
assert.equal(spy.callCount, count);
- spy.getCalls().forEach(function(call, i) {
+ spy.getCalls().forEach((call, i) => {
assert.equal(call.args[0].beforeNumber, start + i);
});
spy.restore();
});
- test('_getNextContentOnSide side-by-side left', function() {
- var startElem = builder.getContentByLine(5, 'left',
+ test('_getNextContentOnSide side-by-side left', () => {
+ const startElem = builder.getContentByLine(5, 'left',
element.$.diffTable);
- var expectedStartString = diff.content[2].ab[0];
- var expectedNextString = diff.content[2].ab[1];
+ const expectedStartString = diff.content[2].ab[0];
+ const expectedNextString = diff.content[2].ab[1];
assert.equal(startElem.textContent, expectedStartString);
- var nextElem = builder._getNextContentOnSide(startElem,
+ const nextElem = builder._getNextContentOnSide(startElem,
'left');
assert.equal(nextElem.textContent, expectedNextString);
});
- test('_getNextContentOnSide side-by-side right', function() {
- var startElem = builder.getContentByLine(5, 'right',
+ test('_getNextContentOnSide side-by-side right', () => {
+ const startElem = builder.getContentByLine(5, 'right',
element.$.diffTable);
- var expectedStartString = diff.content[1].b[0];
- var expectedNextString = diff.content[1].b[1];
+ const expectedStartString = diff.content[1].b[0];
+ const expectedNextString = diff.content[1].b[1];
assert.equal(startElem.textContent, expectedStartString);
- var nextElem = builder._getNextContentOnSide(startElem,
+ const nextElem = builder._getNextContentOnSide(startElem,
'right');
assert.equal(nextElem.textContent, expectedNextString);
});
- test('_getNextContentOnSide unified left', function(done) {
+ test('_getNextContentOnSide unified left', done => {
// Re-render as unified:
element.viewMode = 'UNIFIED_DIFF';
- element.render({left: [], right: []}, prefs).then(function() {
+ element.render({left: [], right: []}, prefs).then(() => {
builder = element._builder;
- var startElem = builder.getContentByLine(5, 'left',
+ const startElem = builder.getContentByLine(5, 'left',
element.$.diffTable);
- var expectedStartString = diff.content[2].ab[0];
- var expectedNextString = diff.content[2].ab[1];
+ const expectedStartString = diff.content[2].ab[0];
+ const expectedNextString = diff.content[2].ab[1];
assert.equal(startElem.textContent, expectedStartString);
- var nextElem = builder._getNextContentOnSide(startElem,
+ const nextElem = builder._getNextContentOnSide(startElem,
'left');
assert.equal(nextElem.textContent, expectedNextString);
@@ -962,19 +976,19 @@
});
});
- test('_getNextContentOnSide unified right', function(done) {
+ test('_getNextContentOnSide unified right', done => {
// Re-render as unified:
element.viewMode = 'UNIFIED_DIFF';
- element.render({left: [], right: []}, prefs).then(function() {
+ element.render({left: [], right: []}, prefs).then(() => {
builder = element._builder;
- var startElem = builder.getContentByLine(5, 'right',
+ const startElem = builder.getContentByLine(5, 'right',
element.$.diffTable);
- var expectedStartString = diff.content[1].b[0];
- var expectedNextString = diff.content[1].b[1];
+ const expectedStartString = diff.content[1].b[0];
+ const expectedNextString = diff.content[1].b[1];
assert.equal(startElem.textContent, expectedStartString);
- var nextElem = builder._getNextContentOnSide(startElem,
+ const nextElem = builder._getNextContentOnSide(startElem,
'right');
assert.equal(nextElem.textContent, expectedNextString);
@@ -982,11 +996,11 @@
});
});
- test('_escapeHTML', function() {
- var input = '<script>alert("XSS");<' + '/script>';
- var expected = '<script>alert("XSS");' +
+ test('_escapeHTML', () => {
+ let input = '<script>alert("XSS");<' + '/script>';
+ let expected = '<script>alert("XSS");' +
'</script>';
- var result = GrDiffBuilder.prototype._escapeHTML(input);
+ let result = GrDiffBuilder.prototype._escapeHTML(input);
assert.equal(result, expected);
input = '& < > " \' / `';