opendev/gerrit
Code Issues Proposed changes

Use data-... attributes instead of name property

Browse Source 
gr-button doesn't have name property. It is better to use data-...
attributes to attach additional data to the gr-button element.

Change-Id: I33cc62f2e426376db40b3060be91401361da0d90
This commit is contained in:
Dmitrii Filippov
2019-11-12 15:52:05 +01:00
parent 720b8b743d
commit 4c6970dee7
4 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
polygerrit-ui/app/elements/change/gr-label-score-row/gr-label-score-row.html
View File

@@ -111,7 +111,7 @@ limitations under the License.
</template> </template>
<iron-selector <iron-selector
id="labelSelector" id="labelSelector"
attr-for-selected="value" attr-for-selected="data-value"
selected="[[_computeLabelValue(labels, permittedLabels, label)]]" selected="[[_computeLabelValue(labels, permittedLabels, label)]]"
hidden$="[[!_computeAnyPermittedLabelValues(permittedLabels, label.name)]]" hidden$="[[!_computeAnyPermittedLabelValues(permittedLabels, label.name)]]"
on-selected-item-changed="_setSelectedValueText"> on-selected-item-changed="_setSelectedValueText">
@@ -121,8 +121,8 @@ limitations under the License.
<gr-button <gr-button
class$="[[_computeButtonClass(value, index, _items.length)]]" class$="[[_computeButtonClass(value, index, _items.length)]]"
has-tooltip has-tooltip
name="[[label.name]]" data-name$="[[label.name]]"
value$="[[value]]" data-value$="[[value]]"
title$="[[_computeLabelValueTitle(labels, label.name, value)]]"> title$="[[_computeLabelValueTitle(labels, label.name, value)]]">
[[value]]</gr-button> [[value]]</gr-button>
</template> </template>

4
polygerrit-ui/app/elements/change/gr-label-score-row/gr-label-score-row.js
View File

@@ -140,8 +140,8 @@
this._selectedValueText = e.target.selectedItem.getAttribute('title'); this._selectedValueText = e.target.selectedItem.getAttribute('title');
// Needed to update the style of the selected button. // Needed to update the style of the selected button.
this.updateStyles(); this.updateStyles();
const name = e.target.selectedItem.name; const name = e.target.selectedItem.dataset.name;
const value = e.target.selectedItem.getAttribute('value'); const value = e.target.selectedItem.dataset.value;
this.dispatchEvent(new CustomEvent( this.dispatchEvent(new CustomEvent(
'labels-changed', 'labels-changed',
{detail: {name, value}, bubbles: true, composed: true})); {detail: {name, value}, bubbles: true, composed: true}));

4
polygerrit-ui/app/elements/change/gr-label-score-row/gr-label-score-row_test.html
View File

@@ -110,7 +110,7 @@ limitations under the License.
element.addEventListener('labels-changed', labelsChangedHandler); element.addEventListener('labels-changed', labelsChangedHandler);
assert.ok(element.$.labelSelector); assert.ok(element.$.labelSelector);
MockInteractions.tap(element.$$( MockInteractions.tap(element.$$(
'gr-button[value="-1"]')); 'gr-button[data-value="-1"]'));
flushAsynchronousOperations(); flushAsynchronousOperations();
assert.strictEqual(element.selectedValue, '-1'); assert.strictEqual(element.selectedValue, '-1');
assert.strictEqual(element.selectedItem assert.strictEqual(element.selectedItem
@@ -167,7 +167,7 @@ limitations under the License.
test('do not display tooltips on touch devices', () => { test('do not display tooltips on touch devices', () => {
const verifiedBtn = element.$$( const verifiedBtn = element.$$(
'iron-selector > gr-button[value="-1"]'); 'iron-selector > gr-button[data-value="-1"]');
// On touch devices, tooltips should not be shown. // On touch devices, tooltips should not be shown.
verifiedBtn._isTouchDevice = true; verifiedBtn._isTouchDevice = true;

2
polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog-it_test.html
View File

@@ -156,7 +156,7 @@ limitations under the License.
const labelScoreRows = Polymer.dom(element.$.labelScores.root) const labelScoreRows = Polymer.dom(element.$.labelScores.root)
.querySelector('gr-label-score-row[name="Code-Review"]'); .querySelector('gr-label-score-row[name="Code-Review"]');
const selectedBtn = Polymer.dom(labelScoreRows.root) const selectedBtn = Polymer.dom(labelScoreRows.root)
.querySelector('gr-button[value="+1"].iron-selected'); .querySelector('gr-button[data-value="+1"].iron-selected');
assert.isOk(selectedBtn); assert.isOk(selectedBtn);
done(); done();
}); });