d0dd392794
Apply diff annotations (intraline differences and comment ranges) by executing the annotation layers in order to each line. The diff builder maintains an ordered array of annotation layers which are communicated to GrDiffBuilder subclass instances. The builder also listens to each layer for notifications that annotations have changed for some line range and re-renders (i.e. re-applies the pipeline on DIV.contentText elements) accordingly. Change-Id: Iea0599d4869cafaadc0974158153a91d927913e8
287 lines
10 KiB
HTML
287 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-comment</title>
|
||
|
||
<script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
|
||
<script src="../../../bower_components/web-component-tester/browser.js"></script>
|
||
<script src="../../../bower_components/page/page.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="gr-diff-comment.html">
|
||
|
||
<test-fixture id="basic">
|
||
<template>
|
||
<gr-diff-comment></gr-diff-comment>
|
||
</template>
|
||
</test-fixture>
|
||
|
||
<test-fixture id="draft">
|
||
<template>
|
||
<gr-diff-comment draft="true"></gr-diff-comment>
|
||
</template>
|
||
</test-fixture>
|
||
|
||
<script>
|
||
suite('gr-diff-comment tests', function() {
|
||
var element;
|
||
setup(function() {
|
||
stub('gr-rest-api-interface', {
|
||
getAccount: function() { return Promise.resolve(null); },
|
||
});
|
||
element = fixture('basic');
|
||
element.comment = {
|
||
author: {
|
||
name: 'Mr. Peanutbutter',
|
||
email: 'tenn1sballchaser@aol.com',
|
||
},
|
||
id: 'baf0414d_60047215',
|
||
line: 5,
|
||
message: 'is this a crossover episode!?',
|
||
updated: '2015-12-08 19:48:33.843000000',
|
||
};
|
||
});
|
||
|
||
test('proper event fires on reply', function(done) {
|
||
element.addEventListener('reply', function(e) {
|
||
assert.ok(e.detail.comment);
|
||
done();
|
||
});
|
||
MockInteractions.tap(element.$$('.reply'));
|
||
});
|
||
|
||
test('proper event fires on quote', function(done) {
|
||
element.addEventListener('reply', function(e) {
|
||
assert.ok(e.detail.comment);
|
||
assert.isTrue(e.detail.quote);
|
||
done();
|
||
});
|
||
MockInteractions.tap(element.$$('.quote'));
|
||
});
|
||
|
||
test('proper event fires on done', function(done) {
|
||
element.addEventListener('done', function(e) {
|
||
done();
|
||
});
|
||
MockInteractions.tap(element.$$('.done'));
|
||
});
|
||
|
||
test('clicking on date link does not trigger nav', function() {
|
||
var showStub = sinon.stub(page, 'show');
|
||
var dateEl = element.$$('.date');
|
||
assert.ok(dateEl);
|
||
MockInteractions.tap(dateEl);
|
||
var dest = window.location.pathname + '#5';
|
||
assert(showStub.lastCall.calledWithExactly(dest, null, false),
|
||
'Should navigate to ' + dest + ' without triggering nav');
|
||
showStub.restore();
|
||
});
|
||
});
|
||
|
||
suite('gr-diff-comment draft tests', function() {
|
||
var element;
|
||
|
||
setup(function() {
|
||
stub('gr-rest-api-interface', {
|
||
getAccount: function() { return Promise.resolve(null); },
|
||
saveDiffDraft: function() {
|
||
return Promise.resolve({
|
||
ok: true,
|
||
text: function() {
|
||
return Promise.resolve(
|
||
')]}\'\n{' +
|
||
'"id": "baf0414d_40572e03",' +
|
||
'"path": "/path/to/file",' +
|
||
'"line": 5,' +
|
||
'"updated": "2015-12-08 21:52:36.177000000",' +
|
||
'"message": "saved!"' +
|
||
'}'
|
||
);
|
||
},
|
||
});
|
||
},
|
||
removeChangeReviewer: function() {
|
||
return Promise.resolve({ok: true});
|
||
},
|
||
});
|
||
stub('gr-storage', {
|
||
getDraftComment: function() { return null; },
|
||
});
|
||
element = fixture('draft');
|
||
element.changeNum = 42;
|
||
element.patchNum = 1;
|
||
element.editing = false;
|
||
element.comment = {
|
||
__draft: true,
|
||
__draftID: 'temp_draft_id',
|
||
path: '/path/to/file',
|
||
line: 5,
|
||
};
|
||
});
|
||
|
||
function isVisible(el) {
|
||
assert.ok(el);
|
||
return getComputedStyle(el).getPropertyValue('display') != 'none';
|
||
}
|
||
|
||
test('button visibility states', function() {
|
||
element.showActions = false;
|
||
assert.isTrue(element.$$('.actions').hasAttribute('hidden'));
|
||
element.showActions = true;
|
||
assert.isFalse(element.$$('.actions').hasAttribute('hidden'));
|
||
|
||
element.draft = true;
|
||
assert.isTrue(isVisible(element.$$('.edit')), 'edit is visible');
|
||
assert.isTrue(isVisible(element.$$('.discard')), 'discard is visible');
|
||
assert.isFalse(isVisible(element.$$('.save')), 'save is not visible');
|
||
assert.isFalse(isVisible(element.$$('.cancel')), 'cancel is not visible');
|
||
assert.isFalse(isVisible(element.$$('.reply')), 'reply is not visible');
|
||
assert.isFalse(isVisible(element.$$('.quote')), 'quote is not visible');
|
||
assert.isFalse(isVisible(element.$$('.done')), 'done is not visible');
|
||
|
||
element.editing = true;
|
||
assert.isFalse(isVisible(element.$$('.edit')), 'edit is not visible');
|
||
assert.isTrue(isVisible(element.$$('.discard')), 'discard is visible');
|
||
assert.isTrue(isVisible(element.$$('.save')), 'save is visible');
|
||
assert.isFalse(isVisible(element.$$('.cancel')), 'cancel is visible');
|
||
assert.isFalse(isVisible(element.$$('.reply')), 'reply is not visible');
|
||
assert.isFalse(isVisible(element.$$('.quote')), 'quote is not visible');
|
||
assert.isFalse(isVisible(element.$$('.done')), 'done is not visible');
|
||
|
||
element.draft = false;
|
||
element.editing = false;
|
||
assert.isFalse(isVisible(element.$$('.edit')), 'edit is not visible');
|
||
assert.isFalse(isVisible(element.$$('.discard')),
|
||
'discard is not visible');
|
||
assert.isFalse(isVisible(element.$$('.save')), 'save is not visible');
|
||
assert.isFalse(isVisible(element.$$('.cancel')), 'cancel is not visible');
|
||
assert.isTrue(isVisible(element.$$('.reply')), 'reply is visible');
|
||
assert.isTrue(isVisible(element.$$('.quote')), 'quote is visible');
|
||
assert.isTrue(isVisible(element.$$('.done')), 'done is visible');
|
||
|
||
element.comment.id = 'foo';
|
||
element.draft = true;
|
||
element.editing = true;
|
||
assert.isTrue(isVisible(element.$$('.cancel')), 'cancel is visible');
|
||
});
|
||
|
||
test('draft creation/cancelation', function(done) {
|
||
assert.isFalse(element.editing);
|
||
MockInteractions.tap(element.$$('.edit'));
|
||
assert.isTrue(element.editing);
|
||
|
||
element._messageText = '';
|
||
// Save should be disabled on an empty message.
|
||
var disabled = element.$$('.save').hasAttribute('disabled');
|
||
assert.isTrue(disabled, 'save button should be disabled.');
|
||
element._messageText = ' ';
|
||
disabled = element.$$('.save').hasAttribute('disabled');
|
||
assert.isTrue(disabled, 'save button should be disabled.');
|
||
|
||
var numDiscardEvents = 0;
|
||
element.addEventListener('comment-discard', function(e) {
|
||
numDiscardEvents++;
|
||
if (numDiscardEvents == 3) {
|
||
done();
|
||
}
|
||
});
|
||
MockInteractions.tap(element.$$('.cancel'));
|
||
MockInteractions.tap(element.$$('.discard'));
|
||
MockInteractions.pressAndReleaseKeyOn(element.$.editTextarea, 27); // esc
|
||
});
|
||
|
||
test('draft saving/editing', function(done) {
|
||
var fireStub = sinon.stub(element, 'fire');
|
||
|
||
element.draft = true;
|
||
MockInteractions.tap(element.$$('.edit'));
|
||
element._messageText = 'good news, everyone!';
|
||
element.flushDebouncer('fire-update');
|
||
element.flushDebouncer('store');
|
||
assert(fireStub.calledWith('comment-update'),
|
||
'comment-update should be sent');
|
||
assert.deepEqual(fireStub.lastCall.args, [
|
||
'comment-update', {
|
||
comment: {
|
||
__draft: true,
|
||
__draftID: 'temp_draft_id',
|
||
__editing: true,
|
||
line: 5,
|
||
path: '/path/to/file',
|
||
},
|
||
patchNum: 1,
|
||
},
|
||
]);
|
||
MockInteractions.tap(element.$$('.save'));
|
||
|
||
assert.isTrue(element.disabled,
|
||
'Element should be disabled when creating draft.');
|
||
|
||
element._xhrPromise.then(function(draft) {
|
||
assert(fireStub.calledWith('comment-save'),
|
||
'comment-save should be sent');
|
||
assert.deepEqual(fireStub.lastCall.args[1], {
|
||
comment: {
|
||
__draft: true,
|
||
__draftID: 'temp_draft_id',
|
||
__editing: false,
|
||
id: 'baf0414d_40572e03',
|
||
line: 5,
|
||
message: 'saved!',
|
||
path: '/path/to/file',
|
||
updated: '2015-12-08 21:52:36.177000000',
|
||
},
|
||
patchNum: 1,
|
||
});
|
||
assert.isFalse(element.disabled,
|
||
'Element should be enabled when done creating draft.');
|
||
assert.equal(draft.message, 'saved!');
|
||
assert.isFalse(element.editing);
|
||
}).then(function() {
|
||
MockInteractions.tap(element.$$('.edit'));
|
||
element._messageText = 'You’ll be delivering a package to Chapek 9, ' +
|
||
'a world where humans are killed on sight.';
|
||
MockInteractions.tap(element.$$('.save'));
|
||
assert.isTrue(element.disabled,
|
||
'Element should be disabled when updating draft.');
|
||
|
||
element._xhrPromise.then(function(draft) {
|
||
assert.isFalse(element.disabled,
|
||
'Element should be enabled when done updating draft.');
|
||
assert.equal(draft.message, 'saved!');
|
||
assert.isFalse(element.editing);
|
||
fireStub.restore();
|
||
done();
|
||
});
|
||
});
|
||
});
|
||
|
||
test('clicking on date link does not trigger nav', function() {
|
||
var showStub = sinon.stub(page, 'show');
|
||
var dateEl = element.$$('.date');
|
||
assert.ok(dateEl);
|
||
MockInteractions.tap(dateEl);
|
||
var dest = window.location.pathname + '#5';
|
||
assert(showStub.lastCall.calledWithExactly(dest, null, false),
|
||
'Should navigate to ' + dest + ' without triggering nav');
|
||
showStub.restore();
|
||
});
|
||
});
|
||
</script>
|