3278d7b611
Changes that become marked as unreviewed can only be marked as reviewed in the dashboard by clicking into the review, selecting the vertical dropdown, and finally clicking "Mark reviewed". For users with busy dashboards who would like to quickly mark changes as reviewed, it becomes quite cumbersome to have to navigate into every review they want to mark as reviewed. To improve their user experience, they should be able to mark reviews quickly and easily from the changes list in the dashboard without having to click into each individual review. Reviewers may come across reviews that they want to quickly mark as read in various situations. One example is when the code owner rebases with no new code changes, resulting in the review to be bolded on the dashboard but unable to be quickly dismissed. Other situations are discussed in the issue comments. Feature: Issue 2390 Change-Id: I86664055f3315fb497e887c6702c24f483b5dff6
520 lines
16 KiB
HTML
520 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
@license
|
|
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-change-list</title>
|
|
|
|
<script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
|
|
<script src="../../../bower_components/web-component-tester/browser.js"></script>
|
|
<link rel="import" href="../../../test/common-test-setup.html"/>
|
|
<script src="../../../bower_components/page/page.js"></script>
|
|
|
|
<link rel="import" href="gr-change-list.html">
|
|
|
|
<script>void(0);</script>
|
|
|
|
<test-fixture id="basic">
|
|
<template>
|
|
<gr-change-list></gr-change-list>
|
|
</template>
|
|
</test-fixture>
|
|
|
|
<test-fixture id="grouped">
|
|
<template>
|
|
<gr-change-list></gr-change-list>
|
|
</template>
|
|
</test-fixture>
|
|
|
|
<script>
|
|
suite('gr-change-list basic tests', () => {
|
|
let element;
|
|
let sandbox;
|
|
|
|
setup(() => {
|
|
sandbox = sinon.sandbox.create();
|
|
element = fixture('basic');
|
|
});
|
|
|
|
teardown(() => { sandbox.restore(); });
|
|
|
|
suite('test show change number not logged in', () => {
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.account = null;
|
|
element.preferences = null;
|
|
});
|
|
|
|
test('show number disabled', () => {
|
|
assert.isFalse(element.showNumber);
|
|
});
|
|
});
|
|
|
|
suite('test show change number preference enabled', () => {
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.preferences = {
|
|
legacycid_in_change_table: true,
|
|
time_format: 'HHMM_12',
|
|
change_table: [],
|
|
};
|
|
element.account = {_account_id: 1001};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('show number enabled', () => {
|
|
assert.isTrue(element.showNumber);
|
|
});
|
|
});
|
|
|
|
suite('test show change number preference disabled', () => {
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
// legacycid_in_change_table is not set when false.
|
|
element.preferences = {
|
|
time_format: 'HHMM_12',
|
|
change_table: [],
|
|
};
|
|
element.account = {_account_id: 1001};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('show number disabled', () => {
|
|
assert.isFalse(element.showNumber);
|
|
});
|
|
});
|
|
|
|
test('computed fields', () => {
|
|
assert.equal(element._computeLabelNames(
|
|
[{results: [{_number: 0, labels: {}}]}]).length, 0);
|
|
assert.equal(element._computeLabelNames([
|
|
{results: [
|
|
{_number: 0, labels: {Verified: {approved: {}}}},
|
|
{
|
|
_number: 1,
|
|
labels: {
|
|
'Verified': {approved: {}},
|
|
'Code-Review': {approved: {}},
|
|
},
|
|
},
|
|
{
|
|
_number: 2,
|
|
labels: {
|
|
'Verified': {approved: {}},
|
|
'Library-Compliance': {approved: {}},
|
|
},
|
|
},
|
|
]},
|
|
]).length, 3);
|
|
|
|
assert.equal(element._computeLabelShortcut('Code-Review'), 'CR');
|
|
assert.equal(element._computeLabelShortcut('Verified'), 'V');
|
|
assert.equal(element._computeLabelShortcut('Library-Compliance'), 'LC');
|
|
assert.equal(element._computeLabelShortcut('PolyGerrit-Review'), 'PR');
|
|
assert.equal(element._computeLabelShortcut('polygerrit-review'), 'PR');
|
|
assert.equal(element._computeLabelShortcut(
|
|
'Invalid-Prolog-Rules-Label-Name--Verified'), 'V');
|
|
assert.equal(element._computeLabelShortcut(
|
|
'Some-Special-Label-7'), 'SSL7');
|
|
assert.equal(element._computeLabelShortcut('--Too----many----dashes---'),
|
|
'TMD');
|
|
assert.equal(element._computeLabelShortcut(
|
|
'Really-rather-entirely-too-long-of-a-label-name'), 'RRETL');
|
|
});
|
|
|
|
test('colspans', () => {
|
|
const thItemCount = Polymer.dom(element.root).querySelectorAll(
|
|
'th').length;
|
|
|
|
const changeTableColumns = [];
|
|
const labelNames = [];
|
|
assert.equal(thItemCount, element._computeColspan(
|
|
changeTableColumns, labelNames));
|
|
});
|
|
|
|
test('keyboard shortcuts', done => {
|
|
sandbox.stub(element, '_computeLabelNames');
|
|
element.sections = [
|
|
{results: new Array(1)},
|
|
{results: new Array(2)},
|
|
];
|
|
element.selectedIndex = 0;
|
|
element.changes = [
|
|
{_number: 0},
|
|
{_number: 1},
|
|
{_number: 2},
|
|
];
|
|
flushAsynchronousOperations();
|
|
const elementItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(elementItems.length, 3);
|
|
|
|
flush(() => {
|
|
assert.isTrue(elementItems[0].hasAttribute('selected'));
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74, null, 'j');
|
|
assert.equal(element.selectedIndex, 1);
|
|
assert.isTrue(elementItems[1].hasAttribute('selected'));
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74, null, 'j');
|
|
assert.equal(element.selectedIndex, 2);
|
|
assert.isTrue(elementItems[2].hasAttribute('selected'));
|
|
|
|
const navStub = sandbox.stub(Gerrit.Nav, 'navigateToChange');
|
|
assert.equal(element.selectedIndex, 2);
|
|
MockInteractions.pressAndReleaseKeyOn(element, 13, null, 'enter');
|
|
assert.deepEqual(navStub.lastCall.args[0], {_number: 2},
|
|
'Should navigate to /c/2/');
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 75, null, 'k');
|
|
assert.equal(element.selectedIndex, 1);
|
|
MockInteractions.pressAndReleaseKeyOn(element, 13, null, 'enter');
|
|
assert.deepEqual(navStub.lastCall.args[0], {_number: 1},
|
|
'Should navigate to /c/1/');
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 75, null, 'k');
|
|
MockInteractions.pressAndReleaseKeyOn(element, 75, null, 'k');
|
|
MockInteractions.pressAndReleaseKeyOn(element, 75, null, 'k');
|
|
assert.equal(element.selectedIndex, 0);
|
|
|
|
const reloadStub = sandbox.stub(element, '_reloadWindow');
|
|
MockInteractions.pressAndReleaseKeyOn(element, 82, 'shift', 'r');
|
|
assert.isTrue(reloadStub.called);
|
|
|
|
done();
|
|
});
|
|
});
|
|
|
|
test('changes needing review', () => {
|
|
element.changes = [
|
|
{
|
|
_number: 0,
|
|
status: 'NEW',
|
|
reviewed: true,
|
|
owner: {_account_id: 0},
|
|
},
|
|
{
|
|
_number: 1,
|
|
status: 'NEW',
|
|
owner: {_account_id: 0},
|
|
},
|
|
{
|
|
_number: 2,
|
|
status: 'MERGED',
|
|
owner: {_account_id: 0},
|
|
},
|
|
{
|
|
_number: 3,
|
|
status: 'ABANDONED',
|
|
owner: {_account_id: 0},
|
|
},
|
|
];
|
|
flushAsynchronousOperations();
|
|
let elementItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(elementItems.length, 4);
|
|
for (let i = 0; i < elementItems.length; i++) {
|
|
assert.isFalse(elementItems[i].hasAttribute('needs-review'));
|
|
}
|
|
|
|
element.showReviewedState = true;
|
|
elementItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(elementItems.length, 4);
|
|
assert.isFalse(elementItems[0].hasAttribute('needs-review'));
|
|
assert.isTrue(elementItems[1].hasAttribute('needs-review'));
|
|
assert.isFalse(elementItems[2].hasAttribute('needs-review'));
|
|
assert.isFalse(elementItems[3].hasAttribute('needs-review'));
|
|
|
|
element.account = {_account_id: 42};
|
|
elementItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(elementItems.length, 4);
|
|
assert.isFalse(elementItems[0].hasAttribute('needs-review'));
|
|
assert.isTrue(elementItems[1].hasAttribute('needs-review'));
|
|
assert.isFalse(elementItems[2].hasAttribute('needs-review'));
|
|
assert.isFalse(elementItems[3].hasAttribute('needs-review'));
|
|
});
|
|
|
|
test('no changes', () => {
|
|
element.changes = [];
|
|
flushAsynchronousOperations();
|
|
const listItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(listItems.length, 0);
|
|
const noChangesMsg =
|
|
Polymer.dom(element.root).querySelector('.noChanges');
|
|
assert.ok(noChangesMsg);
|
|
});
|
|
|
|
test('empty sections', () => {
|
|
element.sections = [{results: []}, {results: []}];
|
|
flushAsynchronousOperations();
|
|
const listItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(listItems.length, 0);
|
|
const noChangesMsg = Polymer.dom(element.root).querySelectorAll(
|
|
'.noChanges');
|
|
assert.equal(noChangesMsg.length, 2);
|
|
});
|
|
|
|
suite('empty column preference', () => {
|
|
let element;
|
|
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.account = {_account_id: 1001};
|
|
element.preferences = {
|
|
legacycid_in_change_table: true,
|
|
time_format: 'HHMM_12',
|
|
change_table: [],
|
|
};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('show number enabled', () => {
|
|
assert.isTrue(element.showNumber);
|
|
});
|
|
|
|
test('all columns visible', () => {
|
|
for (const column of element.columnNames) {
|
|
const elementClass = '.' + element._lowerCase(column);
|
|
assert.isFalse(element.$$(elementClass).hidden);
|
|
}
|
|
});
|
|
});
|
|
|
|
suite('full column preference', () => {
|
|
let element;
|
|
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.account = {_account_id: 1001};
|
|
element.preferences = {
|
|
legacycid_in_change_table: true,
|
|
time_format: 'HHMM_12',
|
|
change_table: [
|
|
'Subject',
|
|
'Status',
|
|
'Owner',
|
|
'Assignee',
|
|
'Project',
|
|
'Branch',
|
|
'Updated',
|
|
'Size',
|
|
],
|
|
};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('all columns visible', () => {
|
|
for (const column of element.changeTableColumns) {
|
|
const elementClass = '.' + element._lowerCase(column);
|
|
assert.isFalse(element.$$(elementClass).hidden);
|
|
}
|
|
});
|
|
});
|
|
|
|
suite('partial column preference', () => {
|
|
let element;
|
|
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.account = {_account_id: 1001};
|
|
element.preferences = {
|
|
legacycid_in_change_table: true,
|
|
time_format: 'HHMM_12',
|
|
change_table: [
|
|
'Subject',
|
|
'Status',
|
|
'Owner',
|
|
'Assignee',
|
|
'Branch',
|
|
'Updated',
|
|
'Size',
|
|
],
|
|
};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('all columns except project visible', () => {
|
|
for (const column of element.changeTableColumns) {
|
|
const elementClass = '.' + column.toLowerCase();
|
|
if (column === 'Project') {
|
|
assert.isTrue(element.$$(elementClass).hidden);
|
|
} else {
|
|
assert.isFalse(element.$$(elementClass).hidden);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
suite('random column does not exist', () => {
|
|
let element;
|
|
|
|
/* This would only exist if somebody manually updated the config
|
|
file. */
|
|
setup(() => {
|
|
element = fixture('basic');
|
|
element.account = {_account_id: 1001};
|
|
element.preferences = {
|
|
legacycid_in_change_table: true,
|
|
time_format: 'HHMM_12',
|
|
change_table: [
|
|
'Bad',
|
|
],
|
|
};
|
|
flushAsynchronousOperations();
|
|
});
|
|
|
|
test('bad column does not exist', () => {
|
|
const elementClass = '.bad';
|
|
assert.isNotOk(element.$$(elementClass));
|
|
});
|
|
});
|
|
});
|
|
|
|
suite('gr-change-list sections', () => {
|
|
let element;
|
|
let sandbox;
|
|
|
|
setup(() => {
|
|
sandbox = sinon.sandbox.create();
|
|
element = fixture('basic');
|
|
});
|
|
|
|
teardown(() => { sandbox.restore(); });
|
|
|
|
test('keyboard shortcuts', () => {
|
|
element.selectedIndex = 0;
|
|
element.sections = [
|
|
{
|
|
results: [
|
|
{_number: 0},
|
|
{_number: 1},
|
|
{_number: 2},
|
|
],
|
|
},
|
|
{
|
|
results: [
|
|
{_number: 3},
|
|
{_number: 4},
|
|
{_number: 5},
|
|
],
|
|
},
|
|
{
|
|
results: [
|
|
{_number: 6},
|
|
{_number: 7},
|
|
{_number: 8},
|
|
],
|
|
},
|
|
];
|
|
flushAsynchronousOperations();
|
|
const elementItems = Polymer.dom(element.root).querySelectorAll(
|
|
'gr-change-list-item');
|
|
assert.equal(elementItems.length, 9);
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74); // 'j'
|
|
assert.equal(element.selectedIndex, 1);
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74); // 'j'
|
|
|
|
const navStub = sandbox.stub(Gerrit.Nav, 'navigateToChange');
|
|
assert.equal(element.selectedIndex, 2);
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 13); // 'enter'
|
|
assert.deepEqual(navStub.lastCall.args[0], {_number: 2},
|
|
'Should navigate to /c/2/');
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 75); // 'k'
|
|
assert.equal(element.selectedIndex, 1);
|
|
MockInteractions.pressAndReleaseKeyOn(element, 13); // 'enter'
|
|
assert.deepEqual(navStub.lastCall.args[0], {_number: 1},
|
|
'Should navigate to /c/1/');
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74); // 'j'
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74); // 'j'
|
|
MockInteractions.pressAndReleaseKeyOn(element, 74); // 'j'
|
|
assert.equal(element.selectedIndex, 4);
|
|
MockInteractions.pressAndReleaseKeyOn(element, 13); // 'enter'
|
|
assert.deepEqual(navStub.lastCall.args[0], {_number: 4},
|
|
'Should navigate to /c/4/');
|
|
|
|
MockInteractions.pressAndReleaseKeyOn(element, 82); // 'r'
|
|
const change = element._changeForIndex(element.selectedIndex);
|
|
assert.equal(change.reviewed, true,
|
|
'Should mark change as reviewed');
|
|
MockInteractions.pressAndReleaseKeyOn(element, 82); // 'r'
|
|
assert.equal(change.reviewed, false,
|
|
'Should mark change as unreviewed');
|
|
});
|
|
|
|
test('highlight attribute is updated correctly', () => {
|
|
element.changes = [
|
|
{
|
|
_number: 0,
|
|
status: 'NEW',
|
|
owner: {_account_id: 0},
|
|
},
|
|
{
|
|
_number: 1,
|
|
status: 'ABANDONED',
|
|
owner: {_account_id: 0},
|
|
},
|
|
];
|
|
element.account = {_account_id: 42};
|
|
flushAsynchronousOperations();
|
|
let items = element._getListItems();
|
|
assert.equal(items.length, 2);
|
|
assert.isFalse(items[0].hasAttribute('highlight'));
|
|
assert.isFalse(items[1].hasAttribute('highlight'));
|
|
|
|
// Assign all issues to the user, but only the first one is highlighted
|
|
// because the second one is abandoned.
|
|
element.set(['changes', 0, 'assignee'], {_account_id: 12});
|
|
element.set(['changes', 1, 'assignee'], {_account_id: 12});
|
|
element.account = {_account_id: 12};
|
|
flushAsynchronousOperations();
|
|
items = element._getListItems();
|
|
assert.isTrue(items[0].hasAttribute('highlight'));
|
|
assert.isFalse(items[1].hasAttribute('highlight'));
|
|
});
|
|
|
|
test('_computeItemHighlight gives false for null account', () => {
|
|
assert.isFalse(
|
|
element._computeItemHighlight(null, {assignee: {_account_id: 42}}));
|
|
});
|
|
|
|
test('_computeItemAbsoluteIndex', () => {
|
|
sandbox.stub(element, '_computeLabelNames');
|
|
element.sections = [
|
|
{results: new Array(1)},
|
|
{results: new Array(2)},
|
|
{results: new Array(3)},
|
|
];
|
|
|
|
assert.equal(element._computeItemAbsoluteIndex(0, 0), 0);
|
|
// Out of range but no matter.
|
|
assert.equal(element._computeItemAbsoluteIndex(0, 1), 1);
|
|
|
|
assert.equal(element._computeItemAbsoluteIndex(1, 0), 1);
|
|
assert.equal(element._computeItemAbsoluteIndex(1, 1), 2);
|
|
assert.equal(element._computeItemAbsoluteIndex(1, 2), 3);
|
|
assert.equal(element._computeItemAbsoluteIndex(2, 0), 3);
|
|
assert.equal(element._computeItemAbsoluteIndex(3, 0), 6);
|
|
});
|
|
});
|
|
</script>
|