@@ -58,7 +106,40 @@ limitations under the License.
is: 'gr-button',
properties: {
+ disabled: {
+ type: Boolean,
+ observer: '_disabledChanged',
+ reflectToAttribute: true,
+ },
+ _enabledTabindex: {
+ type: String,
+ value: '0',
+ },
+ },
+ behaviors: [
+ Gerrit.KeyboardShortcutBehavior,
+ ],
+
+ hostAttributes: {
+ role: 'button',
+ tabindex: '0',
+ },
+
+ _disabledChanged: function(disabled) {
+ if (disabled) {
+ this._enabledTabindex = this.getAttribute('tabindex');
+ }
+ this.setAttribute('tabindex', disabled ? '-1' : this._enabledTabindex);
+ },
+
+ _handleKey: function(e) {
+ switch (e.keyCode) {
+ case 32: // 'spacebar'
+ case 13: // 'enter'
+ e.preventDefault();
+ this.click();
+ }
},
});
})();
diff --git a/polygerrit-ui/app/elements/gr-change-actions.html b/polygerrit-ui/app/elements/gr-change-actions.html
index 997bfb2289..9e9b078b47 100644
--- a/polygerrit-ui/app/elements/gr-change-actions.html
+++ b/polygerrit-ui/app/elements/gr-change-actions.html
@@ -18,6 +18,7 @@ limitations under the License.
+
@@ -28,39 +29,12 @@ limitations under the License.
:host {
display: block;
}
- .primary {
- background-color: #448aff;
- border-color: #448aff;
- color: #fff;
- }
- button:before {
+ gr-button:before {
content: attr(data-label);
}
- button {
- background-color: #f1f2f3;
- border: 1px solid #aaa;
- border-radius: 2px;
- cursor: pointer;
- font: inherit;
- padding: .5em .75em;
- }
- button[loading],
- button[disabled] {
- opacity: .75;
- }
- button[loading] {
- cursor: wait;
- }
- button[loading]:before {
+ gr-button[loading]:before {
content: attr(data-loading-label);
}
- button[disabled] {
- cursor: default;
- }
- button[loading],
- button[loading][disabled] {
- cursor: wait;
- }
-
+ on-tap="_handleActionTap">
-
+ on-tap="_handleActionTap">
@@ -183,6 +157,10 @@ limitations under the License.
}[action];
},
+ _computePrimary: function(actionKey) {
+ return actionKey == 'submit';
+ },
+
_computeButtonClass: function(action) {
return action == 'submit' ? 'primary' : '';
},
diff --git a/polygerrit-ui/app/elements/gr-change-star.html b/polygerrit-ui/app/elements/gr-change-star.html
index b3ff00dd62..ad377ef159 100644
--- a/polygerrit-ui/app/elements/gr-change-star.html
+++ b/polygerrit-ui/app/elements/gr-change-star.html
@@ -34,7 +34,7 @@ limitations under the License.
outline: none;
}
.starButton svg {
- fill: #aab8c2;
+ fill: #ccc;
width: 1em;
height: 1em;
}
diff --git a/polygerrit-ui/app/elements/gr-confirm-dialog.html b/polygerrit-ui/app/elements/gr-confirm-dialog.html
index beea8d2e00..0ba36d685e 100644
--- a/polygerrit-ui/app/elements/gr-confirm-dialog.html
+++ b/polygerrit-ui/app/elements/gr-confirm-dialog.html
@@ -15,6 +15,7 @@ limitations under the License.
-->
+
@@ -35,25 +36,12 @@ limitations under the License.
display: flex;
justify-content: space-between;
}
- button {
- background-color: #f1f2f3;
- border: 1px solid #aaa;
- border-radius: 2px;
- cursor: pointer;
- font: inherit;
- padding: .5em .75em;
- }
- .confirm {
- background-color: #448aff;
- border-color: #448aff;
- color: #fff;
- }
diff --git a/polygerrit-ui/app/test/gr-download-dialog-test.html b/polygerrit-ui/app/test/gr-download-dialog-test.html
index 0f674e5438..fe2637190a 100644
--- a/polygerrit-ui/app/test/gr-download-dialog-test.html
+++ b/polygerrit-ui/app/test/gr-download-dialog-test.html
@@ -98,7 +98,7 @@ limitations under the License.
element.addEventListener('close', function() {
done();
});
- MockInteractions.tap(element.$$('.closeButtonContainer a'));
+ MockInteractions.tap(element.$$('.closeButtonContainer gr-button'));
});
test('tab selection', function() {
diff --git a/polygerrit-ui/app/test/gr-message-test.html b/polygerrit-ui/app/test/gr-message-test.html
index 1bc65f6146..503da1bb94 100644
--- a/polygerrit-ui/app/test/gr-message-test.html
+++ b/polygerrit-ui/app/test/gr-message-test.html
@@ -57,7 +57,7 @@ limitations under the License.
assert.deepEqual(e.detail.message, element.message);
done();
});
- MockInteractions.tap(element.$$('button.reply'));
+ MockInteractions.tap(element.$$('.replyContainer gr-button'));
});
});
diff --git a/polygerrit-ui/app/test/gr-reply-dropdown-test.html b/polygerrit-ui/app/test/gr-reply-dropdown-test.html
index ca6e541ed9..47fe03ddee 100644
--- a/polygerrit-ui/app/test/gr-reply-dropdown-test.html
+++ b/polygerrit-ui/app/test/gr-reply-dropdown-test.html
@@ -126,9 +126,11 @@ limitations under the License.
}
element.draft = 'I wholeheartedly disapprove';
MockInteractions.tap(element.$$(
- 'iron-selector[data-label="Code-Review"] > button[data-value="-1"]'));
+ 'iron-selector[data-label="Code-Review"] > ' +
+ 'gr-button[data-value="-1"]'));
MockInteractions.tap(element.$$(
- 'iron-selector[data-label="Verified"] > button[data-value="-1"]'));
+ 'iron-selector[data-label="Verified"] > ' +
+ 'gr-button[data-value="-1"]'));
// This is needed on non-Blink engines most likely due to the ways in
// which the dom-repeat elements are stamped.