15f796c7a4
+ Also update iron-test-helpers to 1.1.5 to be able to use modifiers in fake key events. Bug: Issue 3925 Change-Id: I41ce2efe0b5df63a2a637e0942a97e9dafc432f9
301 lines
10 KiB
HTML
301 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Copyright (C) 2015 The Android Open Source Project
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
you may not use this file except in compliance with the License.
|
|
You may obtain a copy of the License at
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
See the License for the specific language governing permissions and
|
|
limitations under the License.
|
|
-->
|
|
|
|
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
|
<title>gr-diff-side</title>
|
|
|
|
<script src="../bower_components/webcomponentsjs/webcomponents.min.js"></script>
|
|
<script src="../bower_components/web-component-tester/browser.js"></script>
|
|
<script src="../scripts/util.js"></script>
|
|
|
|
<link rel="import" href="../bower_components/iron-test-helpers/iron-test-helpers.html">
|
|
<link rel="import" href="../elements/gr-diff-side.html">
|
|
|
|
<test-fixture id="basic">
|
|
<template>
|
|
<gr-diff-side></gr-diff-side>
|
|
</template>
|
|
</test-fixture>
|
|
|
|
<script>
|
|
suite('gr-diff-side tests', function() {
|
|
var element;
|
|
|
|
function isVisibleInWindow(el) {
|
|
var rect = el.getBoundingClientRect();
|
|
return rect.top >= 0 && rect.left >= 0 &&
|
|
rect.bottom <= window.innerHeight && rect.right <= window.innerWidth;
|
|
}
|
|
|
|
setup(function() {
|
|
element = fixture('basic');
|
|
});
|
|
|
|
test('comments', function() {
|
|
assert.isFalse(element.$$('.container').classList.contains('canComment'));
|
|
element.canComment = true;
|
|
assert.isTrue(element.$$('.container').classList.contains('canComment'));
|
|
// TODO(andybons): Check for comment creation events firing/not firing
|
|
// when implemented.
|
|
});
|
|
|
|
test('scroll to line', function() {
|
|
var content = [];
|
|
for (var i = 0; i < 300; i++) {
|
|
content.push({
|
|
type: 'CODE',
|
|
content: 'All work and no play makes Jack a dull boy',
|
|
numLines: 1,
|
|
lineNum: i + 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
});
|
|
}
|
|
element.content = content;
|
|
|
|
window.scrollTo(0, 0);
|
|
element.scrollToLine(-12849);
|
|
assert.equal(window.scrollY, 0);
|
|
element.scrollToLine('sup');
|
|
assert.equal(window.scrollY, 0);
|
|
var lineEl = element.$$('.numbers .lineNum[data-line-num="150"]');
|
|
assert.ok(lineEl);
|
|
element.scrollToLine(150);
|
|
assert.isAbove(window.scrollY, 0);
|
|
assert.isTrue(isVisibleInWindow(lineEl), 'element should be visible');
|
|
});
|
|
|
|
test('intraline highlights', function() {
|
|
var content = ' <gr-linked-text content="' +
|
|
'[[_computeCurrentRevisionMessage(change)]]"></gr-linked-text>';
|
|
var html = util.escapeHTML(content);
|
|
var highlights = [
|
|
{startIndex: 0, endIndex: 33},
|
|
{startIndex: 75},
|
|
];
|
|
assert.equal(
|
|
content.slice(highlights[0].startIndex, highlights[0].endIndex),
|
|
' <gr-linked-text content="');
|
|
assert.equal(content.slice(highlights[1].startIndex),
|
|
'"></gr-linked-text>');
|
|
var result = element._addIntralineHighlights(content, html, highlights);
|
|
var expected = element._highlightStartTag +
|
|
' <gr-linked-text content="' +
|
|
element._highlightEndTag +
|
|
'[[_computeCurrentRevisionMessage(change)]]' +
|
|
element._highlightStartTag +
|
|
'"></gr-linked-text>' +
|
|
element._highlightEndTag;
|
|
assert.equal(result, expected);
|
|
});
|
|
|
|
test('newlines', function() {
|
|
element.prefs = {
|
|
line_length: 80,
|
|
tab_size: 4,
|
|
};
|
|
|
|
element.content = [{
|
|
type: 'CODE',
|
|
content: 'A'.repeat(50),
|
|
numLines: 1,
|
|
lineNum: 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
}];
|
|
|
|
var lineEl = element.$$('.numbers .lineNum[data-line-num="1"]');
|
|
assert.ok(lineEl);
|
|
var contentEl = element.$$('.content .code[data-line-num="1"]');
|
|
assert.ok(contentEl);
|
|
assert.equal(contentEl.innerHTML, 'A'.repeat(50));
|
|
|
|
element.content = [{
|
|
type: 'CODE',
|
|
content: 'A'.repeat(100),
|
|
numLines: 2,
|
|
lineNum: 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
}];
|
|
|
|
lineEl = element.$$('.numbers .lineNum[data-line-num="1"]');
|
|
assert.ok(lineEl);
|
|
contentEl = element.$$('.content .code[data-line-num="1"]');
|
|
assert.ok(contentEl);
|
|
assert.equal(contentEl.innerHTML,
|
|
'A'.repeat(80) + element._lineFeedHTML +
|
|
'A'.repeat(20) + element._lineFeedHTML);
|
|
});
|
|
|
|
test('tabs', function(done) {
|
|
element.prefs = {
|
|
line_length: 80,
|
|
tab_size: 4,
|
|
show_tabs: true,
|
|
};
|
|
|
|
element.content = [{
|
|
type: 'CODE',
|
|
content: 'A'.repeat(50) + '\t' + 'A'.repeat(50),
|
|
numLines: 2,
|
|
lineNum: 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
}];
|
|
|
|
var lineEl = element.$$('.numbers .lineNum[data-line-num="1"]');
|
|
assert.ok(lineEl);
|
|
var contentEl = element.$$('.content .code[data-line-num="1"]');
|
|
assert.ok(contentEl);
|
|
var spanEl = contentEl.childNodes[1];
|
|
assert.equal(spanEl.tagName, 'SPAN');
|
|
assert.isTrue(spanEl.classList.contains(
|
|
'style-scope', 'gr-diff-side', 'tab', 'withIndicator'));
|
|
|
|
element.prefs.show_tabs = false;
|
|
element.content = [{
|
|
type: 'CODE',
|
|
content: 'A'.repeat(50) + '\t' + 'A'.repeat(50),
|
|
numLines: 2,
|
|
lineNum: 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
}];
|
|
contentEl = element.$$('.content .code[data-line-num="1"]');
|
|
assert.ok(contentEl);
|
|
spanEl = contentEl.childNodes[1];
|
|
assert.equal(spanEl.tagName, 'SPAN');
|
|
assert.isTrue(spanEl.classList.contains(
|
|
'style-scope', 'gr-diff-side', 'tab'));
|
|
|
|
var alertStub = sinon.stub(window, 'alert');
|
|
element.prefs.tab_size =
|
|
'"><img src="/" onerror="alert(1);"><span class="';
|
|
element.content = [{
|
|
type: 'CODE',
|
|
content: '\t',
|
|
numLines: 1,
|
|
lineNum: 1,
|
|
highlight: false,
|
|
intraline: [],
|
|
}];
|
|
element.async(function() {
|
|
assert.isFalse(alertStub.called);
|
|
alertStub.restore();
|
|
done();
|
|
}, 100); // Allow some time for the img error event to fire.
|
|
});
|
|
|
|
test('diff context', function() {
|
|
var content = [
|
|
{type: 'CODE', hidden: true, content: '<!DOCTYPE html>'},
|
|
{type: 'CODE', hidden: true, content: '<meta charset="utf-8">'},
|
|
{type: 'CODE', hidden: true, content: '<title>My great page</title>'},
|
|
{type: 'CODE', hidden: true, content: '<style>'},
|
|
{type: 'CODE', hidden: true, content: ' *,'},
|
|
{type: 'CODE', hidden: true, content: ' *:before,'},
|
|
{type: 'CODE', hidden: true, content: ' *:after {'},
|
|
{type: 'CODE', hidden: true, content: ' box-sizing: border-box;'},
|
|
{type: 'CONTEXT_CONTROL', numLines: 8, start: 0, end: 8},
|
|
{type: 'CODE', hidden: false, content: ' }'},
|
|
];
|
|
element.content = content;
|
|
|
|
// Only the context elements and the following code line elements should
|
|
// be present in the DOM.
|
|
var contextEls =
|
|
Polymer.dom(element.root).querySelectorAll('.contextControl');
|
|
assert.equal(contextEls.length, 2);
|
|
var codeLineEls =
|
|
Polymer.dom(element.root).querySelectorAll('.lineNum, .code');
|
|
assert.equal(codeLineEls.length, 2);
|
|
|
|
for (var i = 0; i <= 8; i++) {
|
|
element.content[i].hidden = false;
|
|
}
|
|
element.renderLineIndexRange(0, 8);
|
|
element.hideElementsWithIndex(8);
|
|
|
|
contextEls =
|
|
Polymer.dom(element.root).querySelectorAll('.contextControl');
|
|
for (var i = 0; i < contextEls.length; i++) {
|
|
assert.isTrue(contextEls[i].hasAttribute('hidden'));
|
|
}
|
|
|
|
codeLineEls =
|
|
Polymer.dom(element.root).querySelectorAll('.lineNum, .code');
|
|
|
|
// Nine lines should now be present in the DOM.
|
|
assert.equal(codeLineEls.length, 9 * 2);
|
|
});
|
|
|
|
test('tap line to add a draft', function() {
|
|
var numAddDraftEvents = 0;
|
|
sinon.stub(element, 'fire', function(eventName) {
|
|
if (eventName == 'add-draft') {
|
|
numAddDraftEvents++;
|
|
}
|
|
});
|
|
element.content = [{type: 'CODE', content: '<!DOCTYPE html>'}];
|
|
element.canComment = false;
|
|
flushAsynchronousOperations();
|
|
|
|
var lineEl = element.$$('.lineNum');
|
|
assert.ok(lineEl);
|
|
MockInteractions.tap(lineEl);
|
|
assert.equal(numAddDraftEvents, 0);
|
|
|
|
element.canComment = true;
|
|
MockInteractions.tap(lineEl);
|
|
assert.equal(numAddDraftEvents, 1);
|
|
});
|
|
|
|
test('jump to diff chunk/thread', function() {
|
|
element.content = [
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 1, highlight: true},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 2, highlight: true},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 3 },
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 4 },
|
|
{type: 'COMMENT_THREAD', comments: [ { line: 4 }]},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 5 },
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 6, highlight: true},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 7, highlight: true},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 8 },
|
|
{type: 'COMMENT_THREAD', comments: [ { line: 8 }]},
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 9 },
|
|
{type: 'CODE', content: '', intraline: [], lineNum: 10,
|
|
highlight: true},
|
|
];
|
|
|
|
var scrollToLineStub = sinon.stub(element, 'scrollToLine');
|
|
element.scrollToNextDiffChunk();
|
|
assert.isTrue(scrollToLineStub.lastCall.calledWithExactly(6));
|
|
element.scrollToPreviousDiffChunk();
|
|
assert.isTrue(scrollToLineStub.lastCall.calledWithExactly(1));
|
|
element.scrollToNextCommentThread();
|
|
assert.isTrue(scrollToLineStub.lastCall.calledWithExactly(4));
|
|
element.scrollToNextCommentThread();
|
|
assert.isTrue(scrollToLineStub.lastCall.calledWithExactly(8));
|
|
element.scrollToPreviousDiffChunk();
|
|
assert.isTrue(scrollToLineStub.lastCall.calledWithExactly(6));
|
|
|
|
scrollToLineStub.restore();
|
|
});
|
|
});
|
|
</script>
|