Use data-... attributes instead of name property
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:
@@ -111,7 +111,7 @@ limitations under the License.
|
||||
</template>
|
||||
<iron-selector
|
||||
id="labelSelector"
|
||||
attr-for-selected="value"
|
||||
attr-for-selected="data-value"
|
||||
selected="[[_computeLabelValue(labels, permittedLabels, label)]]"
|
||||
hidden$="[[!_computeAnyPermittedLabelValues(permittedLabels, label.name)]]"
|
||||
on-selected-item-changed="_setSelectedValueText">
|
||||
@@ -121,8 +121,8 @@ limitations under the License.
|
||||
<gr-button
|
||||
class$="[[_computeButtonClass(value, index, _items.length)]]"
|
||||
has-tooltip
|
||||
name="[[label.name]]"
|
||||
value$="[[value]]"
|
||||
data-name$="[[label.name]]"
|
||||
data-value$="[[value]]"
|
||||
title$="[[_computeLabelValueTitle(labels, label.name, value)]]">
|
||||
[[value]]</gr-button>
|
||||
</template>
|
||||
|
||||
@@ -140,8 +140,8 @@
|
||||
this._selectedValueText = e.target.selectedItem.getAttribute('title');
|
||||
// Needed to update the style of the selected button.
|
||||
this.updateStyles();
|
||||
const name = e.target.selectedItem.name;
|
||||
const value = e.target.selectedItem.getAttribute('value');
|
||||
const name = e.target.selectedItem.dataset.name;
|
||||
const value = e.target.selectedItem.dataset.value;
|
||||
this.dispatchEvent(new CustomEvent(
|
||||
'labels-changed',
|
||||
{detail: {name, value}, bubbles: true, composed: true}));
|
||||
|
||||
@@ -110,7 +110,7 @@ limitations under the License.
|
||||
element.addEventListener('labels-changed', labelsChangedHandler);
|
||||
assert.ok(element.$.labelSelector);
|
||||
MockInteractions.tap(element.$$(
|
||||
'gr-button[value="-1"]'));
|
||||
'gr-button[data-value="-1"]'));
|
||||
flushAsynchronousOperations();
|
||||
assert.strictEqual(element.selectedValue, '-1');
|
||||
assert.strictEqual(element.selectedItem
|
||||
@@ -167,7 +167,7 @@ limitations under the License.
|
||||
|
||||
test('do not display tooltips on touch devices', () => {
|
||||
const verifiedBtn = element.$$(
|
||||
'iron-selector > gr-button[value="-1"]');
|
||||
'iron-selector > gr-button[data-value="-1"]');
|
||||
|
||||
// On touch devices, tooltips should not be shown.
|
||||
verifiedBtn._isTouchDevice = true;
|
||||
|
||||
@@ -156,7 +156,7 @@ limitations under the License.
|
||||
const labelScoreRows = Polymer.dom(element.$.labelScores.root)
|
||||
.querySelector('gr-label-score-row[name="Code-Review"]');
|
||||
const selectedBtn = Polymer.dom(labelScoreRows.root)
|
||||
.querySelector('gr-button[value="+1"].iron-selected');
|
||||
.querySelector('gr-button[data-value="+1"].iron-selected');
|
||||
assert.isOk(selectedBtn);
|
||||
done();
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user