Fix bug in autocomplete focus detection

https://goo.gl/j4Lr5w enabled conditional showing of autocomplete
suggestions based on focus of the autocomplete's child input. One case
in which the input is focused programmatically as opposed to through UI
interaction fell through the cracks.
This change addresses that case.

Change-Id: I24515557c3cf9af164991829746d597a2b769c84
This commit is contained in:
Kasper Nilsson
2016-09-19 10:37:41 -07:00
parent 44fe3f633b
commit 44c1b91c44
3 changed files with 20 additions and 21 deletions

View File

@@ -55,7 +55,8 @@ limitations under the License.
bind-value="{{text}}"
placeholder="[[placeholder]]"
on-keydown="_handleInputKeydown"
on-focus="_updateSuggestions"
on-focus="_onInputFocus"
on-blur="_onInputBlur"
autocomplete="off" />
<div
id="suggestions"

View File

@@ -117,14 +117,6 @@
},
attached: function() {
this.listen(document.body, 'click', '_handleBodyClick');
},
detached: function() {
this.unlisten(document.body, 'click', '_handleBodyClick');
},
get focusStart() {
return this.$.input;
},
@@ -147,6 +139,15 @@
this._disableSuggestions = false;
},
_onInputFocus: function() {
this._focused = true;
this._updateSuggestions();
},
_onInputBlur: function() {
this._focused = false;
},
_updateSuggestions: function() {
if (!this.text || this._disableSuggestions) { return; }
if (this.text.length < this.threshold) {
@@ -228,18 +229,6 @@
}
},
_handleBodyClick: function(e) {
var eventPath = Polymer.dom(e).path;
for (var i = 0; i < eventPath.length; i++) {
if (eventPath[i] == this) {
this._focused = true;
return;
}
}
this._suggestions = [];
this._focused = false;
},
_handleSuggestionTap: function(e) {
this.$.cursor.setCursor(e.target);
this._commit();

View File

@@ -266,6 +266,15 @@ limitations under the License.
assert.isTrue(commitHandler.called);
});
test('_focused flag properly triggered', function() {
flushAsynchronousOperations();
assert.isFalse(element._focused);
element.$.input.focus();
assert.isTrue(element._focused);
element.$.input.blur();
assert.isFalse(element._focused);
});
test('_focused flag shows/hides the suggestions', function() {
var suggestions = ['hello', 'its me'];
assert.isTrue(element._computeSuggestionsHidden(suggestions, false));