opendev/gerrit
Code Issues Proposed changes

Update gr-select for Polymer 2

Browse Source 
Polymer2 does not support type extension. As such, elements that rely on
it are  updated.

Instead of
<select is="gr-select"><select>

This will now be..
<gr-select>
  <select></select>
</gr-select>

This is similar to the implementation of iron-input, except that is more
complex, as it is supporting both type extention and non-type extension.
https://github.com/PolymerElements/iron-input/blob/master/iron-input.html

Bug: Issue 6371
Change-Id: I31091ff24791a9dc073b3325c7b0daa1580b69ef
This commit is contained in:
Becky Siegel
2017-07-05 14:12:44 -07:00
parent 7013809fee
commit 8e174ab23a
15 changed files with 266 additions and 245 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
polygerrit-ui/app/elements/admin/gr-admin-create-project/gr-admin-create-project.html
View File

@@ -72,25 +72,27 @@ limitations under the License.
<section>
<span class="title">Create initial empty commit</span>
<span class="value">
<select
<gr-select
id="initalCommit"
is="gr-select"
bind-value="{{_projectConfig.create_empty_commit}}">
<option value="false">False</option>
<option value="true">True</option>
</select>
<select>
<option value="false">False</option>
<option value="true">True</option>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Only serve as parent for other projects</span>
<span class="value">
<select
<gr-select
id="parentProject"
is="gr-select"
bind-value="{{_projectConfig.permissions_only}}">
<option value="false">False</option>
<option value="true">True</option>
</select>
<select>
<option value="false">False</option>
<option value="true">True</option>
</select>
</gr-select>
</span>
</section>
</fieldset>

158
polygerrit-ui/app/elements/admin/gr-admin-project/gr-admin-project.html
View File

@@ -79,44 +79,44 @@ limitations under the License.
<section>
<span class="title">State</span>
<span class="value">
<select
<gr-select
id="stateSelect"
is="gr-select"
bind-value="{{_projectConfig.state}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat" items=[[_states]]>
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.state}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat" items=[[_states]]>
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Submit type</span>
<span class="value">
<select
<gr-select
id="submitTypeSelect"
is="gr-select"
bind-value="{{_projectConfig.submit_type}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat" items="[[_submitTypes]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.submit_type}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat" items="[[_submitTypes]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Allow content merges</span>
<span class="value">
<select
<gr-select
id="contentMergeSelect"
is="gr-select"
bind-value="{{_projectConfig.use_content_merge.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_content_merge)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.use_content_merge.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_content_merge)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
@@ -124,47 +124,47 @@ limitations under the License.
Create a new change for every commit not in the target branch
</span>
<span class="value">
<select
<gr-select
id="newChangeSelect"
is="gr-select"
bind-value="{{_projectConfig.create_new_change_for_all_not_in_target.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.create_new_change_for_all_not_in_target)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.create_new_change_for_all_not_in_target.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.create_new_change_for_all_not_in_target)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Require Change-Id in commit message</span>
<span class="value">
<select
<gr-select
id="requireChangeIdSelect"
is="gr-select"
bind-value="{{_projectConfig.require_change_id.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.require_change_id)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.require_change_id.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.require_change_id)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">
Reject implicit merges when changes are pushed for review</span>
<span class="value">
<select
<gr-select
id="rejectImplicitMergesSelect"
is="gr-select"
bind-value="{{_projectConfig.reject_implicit_merges.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.reject_implicit_merges)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.reject_implicit_merges.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.reject_implicit_merges)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
@@ -181,16 +181,16 @@ limitations under the License.
<section>
<span class="title">Match authored date with committer date upon submit</span>
<span class="value">
<select
<gr-select
id="matchAuthoredDateWithCommitterDateSelect"
is="gr-select"
bind-value="{{_projectConfig.match_author_to_committer_date.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.match_author_to_committer_date)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
bind-value="{{_projectConfig.match_author_to_committer_date.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.match_author_to_committer_date)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
</fieldset>
@@ -200,31 +200,31 @@ limitations under the License.
<span class="title">
Require a valid contributor agreement to upload</span>
<span class="value">
<select
<gr-select
id="contributorAgreementSelect"
is="gr-select"
bind-value="{{_projectConfig.use_contributor_agreements.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_contributor_agreements)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
bind-value="{{_projectConfig.use_contributor_agreements.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_contributor_agreements)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Require Signed-off-by in commit message</span>
<span class="value">
<select
id="useSignedOffBySelect"
is="gr-select"
bind-value="{{_projectConfig.use_signed_off_by.configured_value}}"
disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_signed_off_by)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
<gr-select
id="useSignedOffBySelect"
bind-value="{{_projectConfig.use_signed_off_by.configured_value}}">
<select disabled$="[[_readOnly]]">
<template is="dom-repeat"
items="[[_formatBooleanSelect(_projectConfig.use_signed_off_by)]]">
<option value="[[item.value]]">[[item.label]]</option>
</template>
</select>
</gr-select>
</span>
</section>
</fieldset>

29
polygerrit-ui/app/elements/change/gr-change-view/gr-change-view.html
View File

@@ -454,24 +454,25 @@ limitations under the License.
<label class="patchSelectLabel" for="patchSetSelect">
Patch set
</label>
<select
is="gr-select"
<gr-select
id="patchSetSelect"
bind-value="{{_selectedPatchSet}}"
class="patchSetSelect"
on-change="_handlePatchChange">
<template is="dom-repeat" items="[[_allPatchSets]]"
as="patchNum">
<option value$="[[patchNum.num]]"
disabled$="[[_computePatchSetDisabled(patchNum.num, _patchRange.basePatchNum)]]">
[[patchNum.num]]
/
[[computeLatestPatchNum(_allPatchSets)]]
[[_computePatchSetCommentsString(_comments, patchNum.num)]]
[[_computePatchSetDescription(_change, patchNum.num)]]
</option>
</template>
</select>
<select>
<template is="dom-repeat" items="[[_allPatchSets]]"
as="patchNum">
<option value$="[[patchNum.num]]"
disabled$="[[_computePatchSetDisabled(patchNum.num, _patchRange.basePatchNum)]]">
[[patchNum.num]]
/
[[computeLatestPatchNum(_allPatchSets)]]
[[_computePatchSetCommentsString(_comments, patchNum.num)]]
[[_computePatchSetDescription(_change, patchNum.num)]]
</option>
</template>
</select>
</gr-select>
/
<gr-commit-info
change="[[_change]]"

20
polygerrit-ui/app/elements/change/gr-change-view/gr-change-view_test.html
View File

@@ -522,7 +522,7 @@ limitations under the License.
element.viewState.diffMode = 'UNIFIED';
flushAsynchronousOperations();
const selectEl = element.$$('.patchInfo-header select');
const selectEl = element.$$('.patchInfo-header gr-select');
assert.ok(selectEl);
const optionEls = Polymer.dom(element.root).querySelectorAll(
'.patchInfo-header option');
@@ -540,16 +540,16 @@ limitations under the License.
if (numEvents == 1) {
assert.isTrue(navigateToChangeStub.lastCall.calledWithExactly(
element._change, 1, 'PARENT'));
selectEl.value = '3';
element.fire('change', {}, {node: selectEl});
selectEl.nativeSelect.value = '3';
element.fire('change', {}, {node: selectEl.nativeSelect});
} else if (numEvents == 2) {
assert.isTrue(navigateToChangeStub.lastCall.calledWithExactly(
element._change, 3, 'PARENT'));
done();
}
});
selectEl.value = '1';
element.fire('change', {}, {node: selectEl});
selectEl.nativeSelect.value = '1';
element.fire('change', {}, {node: selectEl.nativeSelect});
});
test('patch num change with missing current_revision', done => {
@@ -570,7 +570,7 @@ limitations under the License.
labels: {},
};
flushAsynchronousOperations();
const selectEl = element.$$('.patchInfo-header select');
const selectEl = element.$$('.patchInfo-header gr-select');
assert.ok(selectEl);
const optionEls = Polymer.dom(element.root).querySelectorAll(
'.patchInfo-header option');
@@ -589,16 +589,16 @@ limitations under the License.
if (numEvents == 1) {
assert.isTrue(navigateToChangeStub.lastCall.calledWithExactly(
element._change, 1, 'PARENT'));
selectEl.value = '3';
element.fire('change', {}, {node: selectEl});
selectEl.nativeSelect.value = '3';
element.fire('change', {}, {node: selectEl.nativeSelect});
} else if (numEvents == 2) {
assert.isTrue(navigateToChangeStub.lastCall.calledWithExactly(
element._change, 3, 'PARENT'));
done();
}
});
selectEl.value = '1';
element.fire('change', {}, {node: selectEl});
selectEl.nativeSelect.value = '1';
element.fire('change', {}, {node: selectEl.nativeSelect});
});
test('don’t reload entire page when patchRange changes', () => {

41
polygerrit-ui/app/elements/change/gr-file-list/gr-file-list.html
View File

@@ -210,31 +210,34 @@ limitations under the License.
</div>
</template>
<span class="separator">/</span>
<select
<gr-select
id="modeSelect"
is="gr-select"
bind-value="{{diffViewMode}}">
<option value="SIDE_BY_SIDE">Side By Side</option>
<option value="UNIFIED_DIFF">Unified</option>
</select>
<select>
<option value="SIDE_BY_SIDE">Side By Side</option>
<option value="UNIFIED_DIFF">Unified</option>
</select>
</gr-select>
<span class="separator">/</span>
<label>
Diff against
<select id="patchChange" bind-value="{{_diffAgainst}}" is="gr-select"
<gr-select id="patchChange" bind-value="{{_diffAgainst}}"
class="patchSetSelect" on-change="_handlePatchChange">
<option value="PARENT">Base</option>
<template
is="dom-repeat"
items="[[computeAllPatchSets(change)]]"
as="patchNum">
<option
disabled$="[[_computePatchSetDisabled(patchNum.num, patchRange.patchNum)]]"
value$="[[patchNum.num]]">
[[patchNum.num]]
[[patchNum.desc]]
</option>
</template>
</select>
<select>
<option value="PARENT">Base</option>
<template
is="dom-repeat"
items="[[computeAllPatchSets(change)]]"
as="patchNum">
<option
disabled$="[[_computePatchSetDisabled(patchNum.num, patchRange.patchNum)]]"
value$="[[patchNum.num]]">
[[patchNum.num]]
[[patchNum.desc]]
</option>
</template>
</select>
</gr-select>
</label>
</div>
</header>

12
polygerrit-ui/app/elements/change/gr-file-list/gr-file-list_test.html
View File

@@ -648,17 +648,17 @@ limitations under the License.
};
flush(() => {
const selectEl = element.$.patchChange;
assert.equal(selectEl.value, 'PARENT');
assert.equal(selectEl.nativeSelect.value, 'PARENT');
assert.isTrue(element.$$('option[value="3"]').hasAttribute('disabled'));
selectEl.addEventListener('change', () => {
assert.equal(selectEl.value, '2');
assert.equal(selectEl.nativeSelect.value, '2');
assert(navStub.lastCall.calledWithExactly(element.change, '3', '2'),
'Should navigate to /c/42/2..3');
navStub.restore();
done();
});
selectEl.value = '2';
element.fire('change', {}, {node: selectEl});
selectEl.nativeSelect.value = '2';
element.fire('change', {}, {node: selectEl.nativeSelect});
});
});
@@ -729,12 +729,12 @@ limitations under the License.
flushAsynchronousOperations();
// At this point the diff mode doesn't yet have the user's preference.
assert.equal(select.value, 'SIDE_BY_SIDE');
assert.equal(select.nativeSelect.value, 'SIDE_BY_SIDE');
// Receive the overriding preference.
resolvePrefs({default_diff_view: 'UNIFIED'});
flushAsynchronousOperations();
assert.equal(select.value, 'SIDE_BY_SIDE');
assert.equal(select.nativeSelect.value, 'SIDE_BY_SIDE');
document.getElementById('blank').restore();
});

11
polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html
View File

@@ -272,14 +272,15 @@ limitations under the License.
</span>
</div>
<div>
<select
<gr-select
id="modeSelect"
is="gr-select"
bind-value="{{changeViewState.diffMode}}"
hidden$="[[_computeModeSelectHidden(_isImageDiff)]]">
<option value="SIDE_BY_SIDE">Side By Side</option>
<option value="UNIFIED_DIFF">Unified</option>
</select>
<select>
<option value="SIDE_BY_SIDE">Side By Side</option>
<option value="UNIFIED_DIFF">Unified</option>
</select>
</gr-select>
<span id="diffPrefsContainer"
hidden$="[[_computePrefsButtonHidden(_prefs, _loggedIn)]]" hidden>
<span class="preferences desktop">

14
polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html
View File

@@ -510,21 +510,21 @@ limitations under the License.
element._userPrefs = {default_diff_view: 'SIDE_BY_SIDE'};
// The mode selected in the view state reflects the selected option.
assert.equal(element._getDiffViewMode(), select.value);
assert.equal(element._getDiffViewMode(), select.nativeSelect.value);
// The mode selected in the view state reflects the view rednered in the
// diff.
assert.equal(select.value, diffDisplay.viewMode);
assert.equal(select.nativeSelect.value, diffDisplay.viewMode);
// We will simulate a user change of the selected mode.
const newMode = 'UNIFIED_DIFF';
// Set the actual value of the select, and simulate the change event.
select.value = newMode;
element.fire('change', {}, {node: select});
select.nativeSelect.value = newMode;
element.fire('change', {}, {node: select.nativeSelect});
// Make sure the handler was called and the state is still coherent.
assert.equal(element._getDiffViewMode(), newMode);
assert.equal(element._getDiffViewMode(), select.value);
assert.equal(element._getDiffViewMode(), select.nativeSelect.value);
assert.equal(element._getDiffViewMode(), diffDisplay.viewMode);
});
@@ -542,12 +542,12 @@ limitations under the License.
flushAsynchronousOperations();
// At this point the diff mode doesn't yet have the user's preference.
assert.equal(select.value, 'SIDE_BY_SIDE');
assert.equal(select.nativeSelect.value, 'SIDE_BY_SIDE');
// Receive the overriding preference.
resolvePrefs({default_diff_view: 'UNIFIED'});
flushAsynchronousOperations();
assert.equal(select.value, 'SIDE_BY_SIDE');
assert.equal(select.nativeSelect.value, 'SIDE_BY_SIDE');
});
test('_loadHash', () => {

46
polygerrit-ui/app/elements/diff/gr-patch-range-select/gr-patch-range-select.html
View File

@@ -42,17 +42,19 @@ limitations under the License.
</style>
Patch set:
<span class="patchRange">
<select id="leftPatchSelect" bind-value="{{_leftSelected}}"
on-change="_handlePatchChange" is="gr-select">
<option value="PARENT">Base</option>
<template is="dom-repeat" items="{{availablePatches}}" as="patchNum">
<option value$="[[patchNum]]"
disabled$="[[_computeLeftDisabled(patchNum, patchRange)]]">
[[patchNum]]
[[_computePatchSetDescription(revisions, patchNum)]]
</option>
</template>
</select>
<gr-select id="leftPatchSelect" bind-value="{{_leftSelected}}"
on-change="_handlePatchChange">
<select>
<option value="PARENT">Base</option>
<template is="dom-repeat" items="{{availablePatches}}" as="patchNum">
<option value$="[[patchNum]]"
disabled$="[[_computeLeftDisabled(patchNum, patchRange)]]">
[[patchNum]]
[[_computePatchSetDescription(revisions, patchNum)]]
</option>
</template>
</select>
</gr-select>
</span>
<span is="dom-if" if="[[filesWeblinks.meta_a]]" class="filesWeblinks">
<template is="dom-repeat" items="[[filesWeblinks.meta_a]]" as="weblink">
@@ -62,16 +64,18 @@ limitations under the License.
</span>
&rarr;
<span class="patchRange">
<select id="rightPatchSelect" bind-value="{{_rightSelected}}"
on-change="_handlePatchChange" is="gr-select">
<template is="dom-repeat" items="{{availablePatches}}" as="patchNum">
<option value$="[[patchNum]]"
disabled$="[[_computeRightDisabled(patchNum, patchRange)]]">
[[patchNum]]
[[_computePatchSetDescription(revisions, patchNum)]]
</option>
</template>
</select>
<gr-select id="rightPatchSelect" bind-value="{{_rightSelected}}"
on-change="_handlePatchChange">
<select>
<template is="dom-repeat" items="{{availablePatches}}" as="patchNum">
<option value$="[[patchNum]]"
disabled$="[[_computeRightDisabled(patchNum, patchRange)]]">
[[patchNum]]
[[_computePatchSetDescription(revisions, patchNum)]]
</option>
</template>
</select>
</gr-select>
<span is="dom-if" if="[[filesWeblinks.meta_b]]" class="filesWeblinks">
<template is="dom-repeat" items="[[filesWeblinks.meta_b]]" as="weblink">
<a target="_blank"

6
polygerrit-ui/app/elements/diff/gr-patch-range-select/gr-patch-range-select_test.html
View File

@@ -82,7 +82,7 @@ limitations under the License.
assert(showStub.lastCall.calledWithExactly(
'/c/42/3/path/to/file.txt'),
'Should navigate to /c/42/3/path/to/file.txt');
leftSelectEl.value = '1';
leftSelectEl.nativeSelect.value = '1';
element.fire('change', {}, {node: leftSelectEl});
assert(blurSpy.called, 'Dropdown should be blurred after selection');
} else if (numEvents == 2) {
@@ -93,8 +93,8 @@ limitations under the License.
done();
}
});
leftSelectEl.value = 'PARENT';
rightSelectEl.value = '3';
leftSelectEl.nativeSelect.value = 'PARENT';
rightSelectEl.nativeSelect.value = '3';
element.fire('change', {}, {node: leftSelectEl});
});

18
polygerrit-ui/app/elements/settings/gr-registration-dialog/gr-registration-dialog.html
View File

@@ -69,16 +69,14 @@ limitations under the License.
</section>
<section>
<div class="title">Preferred Email</div>
<select
is="gr-select"
id="email"
bind-value="{{_account.email}}"
disabled="[[_saving]]">
<option value="[[_account.email]]">[[_account.email]]</option>
<template is="dom-repeat" items="[[_account.secondary_emails]]">
<option value="[[item]]">[[item]]</option>
</template>
</select>
<gr-select id="email">
<select disabled="[[_saving]]">
<option value="[[_account.email]]">[[_account.email]]</option>
<template is="dom-repeat" items="[[_account.secondary_emails]]">
<option value="[[item]]">[[item]]</option>
</template>
</select>
</gr-select>
</section>
</main>
<footer>

100
polygerrit-ui/app/elements/settings/gr-settings-view/gr-settings-view.html
View File

@@ -90,68 +90,74 @@ limitations under the License.
<section>
<span class="title">Changes per page</span>
<span class="value">
<select
is="gr-select"
<gr-select
bind-value="{{_localPrefs.changes_per_page}}">
<option value="10">10 rows per page</option>
<option value="25">25 rows per page</option>
<option value="50">50 rows per page</option>
<option value="100">100 rows per page</option>
</select>
<select>
<option value="10">10 rows per page</option>
<option value="25">25 rows per page</option>
<option value="50">50 rows per page</option>
<option value="100">100 rows per page</option>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Date/time format</span>
<span class="value">
<select
is="gr-select"
<gr-select
bind-value="{{_localPrefs.date_format}}">
<option value="STD">Jun 3 ; Jun 3, 2016</option>
<option value="US">06/03 ; 06/03/16</option>
<option value="ISO">06-03 ; 2016-06-03</option>
<option value="EURO">3. Jun ; 03.06.2016</option>
<option value="UK">03/06 ; 03/06/2016</option>
</select>
<select
is="gr-select"
<select>
<option value="STD">Jun 3 ; Jun 3, 2016</option>
<option value="US">06/03 ; 06/03/16</option>
<option value="ISO">06-03 ; 2016-06-03</option>
<option value="EURO">3. Jun ; 03.06.2016</option>
<option value="UK">03/06 ; 03/06/2016</option>
</select>
</gr-select>
<gr-select
bind-value="{{_localPrefs.time_format}}">
<option value="HHMM_12">4:10 PM</option>
<option value="HHMM_24">16:10</option>
</select>
<select>
<option value="HHMM_12">4:10 PM</option>
<option value="HHMM_24">16:10</option>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Email notifications</span>
<span class="value">
<select
is="gr-select"
<gr-select
bind-value="{{_localPrefs.email_strategy}}">
<option value="CC_ON_OWN_COMMENTS">Every comment</option>
<option value="ENABLED">Only comments left by others</option>
<option value="DISABLED">None</option>
</select>
<select>
<option value="CC_ON_OWN_COMMENTS">Every comment</option>
<option value="ENABLED">Only comments left by others</option>
<option value="DISABLED">None</option>
</select>
</gr-select>
</span>
</section>
<section hidden$="[[!_localPrefs.email_format]]">
<span class="title">Email format</span>
<span class="value">
<select
is="gr-select"
<gr-select
bind-value="{{_localPrefs.email_format}}">
<option value="HTML_PLAINTEXT">HTML and plaintext</option>
<option value="PLAINTEXT">Plaintext only</option>
</select>
<select>
<option value="HTML_PLAINTEXT">HTML and plaintext</option>
<option value="PLAINTEXT">Plaintext only</option>
</select>
</gr-select>
</span>
</section>
<section>
<span class="title">Diff view</span>
<span class="value">
<select
is="gr-select"
<gr-select
bind-value="{{_localPrefs.diff_view}}">
<option value="SIDE_BY_SIDE">Side by side</option>
<option value="UNIFIED_DIFF">Unified diff</option>
</select>
<select>
<option value="SIDE_BY_SIDE">Side by side</option>
<option value="UNIFIED_DIFF">Unified diff</option>
</select>
</gr-select>
</span>
</section>
<section>
@@ -188,17 +194,17 @@ limitations under the License.
<section>
<span class="title">Context</span>
<span class="value">
<select
is="gr-select"
bind-value="{{_diffPrefs.context}}">
<option value="3">3 lines</option>
<option value="10">10 lines</option>
<option value="25">25 lines</option>
<option value="50">50 lines</option>
<option value="75">75 lines</option>
<option value="100">100 lines</option>
<option value="-1">Whole file</option>
</select>
<gr-select bind-value="{{_diffPrefs.context}}">
<select>
<option value="3">3 lines</option>
<option value="10">10 lines</option>
<option value="25">25 lines</option>
<option value="50">50 lines</option>
<option value="75">75 lines</option>
<option value="100">100 lines</option>
<option value="-1">Whole file</option>
</select>
</gr-select>
</span>
</section>
<section>

1
polygerrit-ui/app/elements/shared/gr-select/gr-select.html
View File

@@ -16,5 +16,6 @@ limitations under the License.
<link rel="import" href="../../../bower_components/polymer/polymer.html">
<dom-module id="gr-select">
<content></content>
<script src="gr-select.js"></script>
</dom-module>

11
polygerrit-ui/app/elements/shared/gr-select/gr-select.js
View File

@@ -16,7 +16,6 @@
Polymer({
is: 'gr-select',
extends: 'select',
properties: {
bindValue: {
type: String,
@@ -30,19 +29,23 @@
'dom-change': '_updateValue',
},
get nativeSelect() {
return this.$$('select');
},
_updateValue() {
if (this.bindValue) {
this.value = this.bindValue;
this.nativeSelect.value = this.bindValue;
}
},
_valueChanged() {
this.bindValue = this.value;
this.bindValue = this.nativeSelect.value;
},
ready() {
// If not set via the property, set bind-value to the element value.
if (!this.bindValue) { this.bindValue = this.value; }
if (!this.bindValue) { this.bindValue = this.nativeSelect.value; }
},
});
})();

22
polygerrit-ui/app/elements/shared/gr-select/gr-select_test.html
View File

@@ -27,11 +27,13 @@ limitations under the License.
<test-fixture id="basic">
<template>
<select is="gr-select">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<gr-select>
<select>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</gr-select>
</template>
</test-fixture>
@@ -48,7 +50,7 @@ limitations under the License.
element.addEventListener('bind-value-changed', changeStub);
// The selected element should be the first one by default.
assert.equal(element.value, '1');
assert.equal(element.nativeSelect.value, '1');
assert.equal(element.bindValue, '1');
assert.isFalse(changeStub.called);
@@ -56,7 +58,7 @@ limitations under the License.
element.bindValue = '2';
// It should be updated.
assert.equal(element.value, '2');
assert.equal(element.nativeSelect.value, '2');
assert.equal(element.bindValue, '2');
assert.isTrue(changeStub.called);
});
@@ -66,16 +68,16 @@ limitations under the License.
element.addEventListener('bind-value-changed', changeStub);
// The selected element should be the first one by default.
assert.equal(element.value, '1');
assert.equal(element.nativeSelect.value, '1');
assert.equal(element.bindValue, '1');
assert.isFalse(changeStub.called);
// Now change the value.
element.value = '3';
element.nativeSelect.value = '3';
element.fire('change');
// It should be updated.
assert.equal(element.value, '3');
assert.equal(element.nativeSelect.value, '3');
assert.equal(element.bindValue, '3');
assert.isTrue(changeStub.called);
});