opendev/gerrit
Code Issues Proposed changes

Merge "Don't display tooltips on touch devices"

Browse Source
This commit is contained in:
Wyatt Allen
2016-10-18 17:05:58 +00:00
committed by Gerrit Code Review
parent 0457e24291 ac1280c8ce
commit cc11d0b029
2 changed files with 56 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
polygerrit-ui/app/behaviors/gr-tooltip-behavior/gr-tooltip-behavior.js
View File

@@ -22,6 +22,12 @@
properties: {
hasTooltip: Boolean,
_isTouchDevice: {
type: Boolean,
value: function() {
return 'ontouchstart' in document.documentElement;
},
},
_tooltip: Element,
_titleText: String,
},
@@ -29,10 +35,10 @@
attached: function() {
if (!this.hasTooltip) { return; }
this.addEventListener('mouseover', this._handleShowTooltip.bind(this));
this.addEventListener('mouseout', this._handleHideTooltip.bind(this));
this.addEventListener('focusin', this._handleShowTooltip.bind(this));
this.addEventListener('focusout', this._handleHideTooltip.bind(this));
this.addEventListener('mouseenter', this._handleShowTooltip.bind(this));
this.addEventListener('mouseleave', this._handleHideTooltip.bind(this));
this.addEventListener('tap', this._handleHideTooltip.bind(this));
this.listen(window, 'scroll', '_handleWindowScroll');
},
@@ -41,6 +47,8 @@
},
_handleShowTooltip: function(e) {
if (this._isTouchDevice) { return; }
if (!this.hasAttribute('title') ||
this.getAttribute('title') === '' ||
this._tooltip) {
@@ -66,9 +74,11 @@
},
_handleHideTooltip: function(e) {
if (this._isTouchDevice) { return; }
if (!this.hasAttribute('title') ||
this._titleText == null ||
this === document.activeElement) { return; }
this._titleText == null) {
return;
}
this.setAttribute('title', this._titleText);
if (this._tooltip && this._tooltip.parentNode) {

40
polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_test.html
View File

@@ -430,5 +430,45 @@ limitations under the License.
MockInteractions.tap(element.$$('.send'));
});
});
test('don"t display tooltips on touch devices', function() {
element.labels = {
Verified: {
values: {
'-1': 'Fails',
' 0': 'No score',
'+1': 'Verified'
},
default_value: 0
},
'Code-Review': {
values: {
'-2': 'Do not submit',
'-1': 'I would prefer that you didn\'t submit this',
' 0': 'No score',
'+1': 'Looks good to me, but someone else must approve',
'+2': 'Looks good to me, approved'
},
default_value: 0
}
};
var verifiedBtn = element.$$(
'iron-selector[data-label="Verified"] > ' +
'gr-button[data-value="-1"]');
// On touch devices, tooltips should not be shown
verifiedBtn._isTouchDevice = true;
verifiedBtn._handleShowTooltip();
assert.isNotOk(verifiedBtn._tooltip);
verifiedBtn._handleHideTooltip();
assert.isNotOk(verifiedBtn._tooltip);
// On other devices, tooltips should be shown.
verifiedBtn._isTouchDevice = false;
verifiedBtn._handleShowTooltip();
assert.isOk(verifiedBtn._tooltip);
verifiedBtn._handleHideTooltip();
assert.isNotOk(verifiedBtn._tooltip);
});
});
</script>