Opened 5 years ago

Last modified 3 years ago

#18325 assigned defect

FilteringSelect shows a validation error for async stores when pressing enter in IE

Reported by: Kris Zyp Owned by: bill
Priority: undecided Milestone: 1.15
Component: Dijit Version: 1.10.2
Keywords: Cc:
Blocked By: Blocking:

Description

When using an asynchronous store in Internet Explorer, when you enter a valid value in a FilteringSelect?, and press enter before the async store has completed its query, the FilteringSelect? shows a validation error. This is readily reproducible in all versions of Internet Explorer (that I have tested) with the test_FilteringSelect.html, by entering a valid state in the "Artificially slowed-down data store" FilteringSelect?, and quickly pressing enter.

The problem is due to the fact that when you press enter in a textbox in IE, it will immediately move focus to the submit button of the form. Normally, the enter key will end up triggering a _AutoCompleteMixin#_setBlurValue call from _onKey. However, when the enter causes a change in focus, a blur event also triggers the _setBlurValue method call a second time. The _setBlurValue method is not prepared to handle two rapid sequential calls. The this.item value is expected to be undefined if the fetch for the item is in process, but the line https://github.com/dojo/dijit/blob/master/form/_AutoCompleterMixin.js#L335 sets item to null, so the second time through, item is null and this is understood to mean that the fetch has completed and not found any matching item, and triggers the _refreshState method which then performs validation while the fetch is actually still in flight.

As far as I can tell, the correct solution here is simply to remove line 335 (this.item = null) from _AutoCompleterMixin.js, so that the item is still undefined, denoting that it is still in flight. With this line removed, the issues seems to be resolved and all the other tests seem to work properly.

Change History (6)

comment:1 Changed 5 years ago by Kris Zyp

Component: GeneralDijit
Milestone: tbd1.11
Owner: set to bill
Status: newassigned

comment:3 Changed 3 years ago by dylan

Summary: FilteringSelect shows a validation error for async stores when pressing enter in IE[patch][cla][pr][needs test] FilteringSelect shows a validation error for async stores when pressing enter in IE

comment:4 Changed 3 years ago by bill

Summary: [patch][cla][pr][needs test] FilteringSelect shows a validation error for async stores when pressing enter in IEFilteringSelect shows a validation error for async stores when pressing enter in IE

I agree it's a bug for the field to be marked as invalid.

But also, I think it's a bug to shift focus to the submit button. That behavior is presumably really annoying for keyboard users, because they need to tab all the way back to the previous field to continue filling in the form. In particular, if the user types "ala" and then hits the ENTER key to auto-complete to "Alabama", focus should remain on the FilteringSelect? (or perhaps move to the next form field).

So probably the fix to both those problems is to call event.preventDefault() somewhere.

comment:5 Changed 3 years ago by dylan

Milestone: 1.111.12

Moving to 1.12.

comment:6 Changed 3 years ago by dylan

Milestone: 1.131.15

Ticket planning... move current 1.13 tickets out to 1.15 to make it easier to move tickets into the 1.13 milestone.

Note: See TracTickets for help on using tickets.