dijit/form/_AutoCompleterMixin | _TextBoxMixin regression with "input" event listeners

[Adrian Vasiliu]

This is reproducible with master and the 1.10 branch, presumably also with the 1.9 and 1.8 branches. I entered version=1.10.4 because I didn't see a better choice available such as "master".

When a widget based on dijit/form/_AutoCompleterMixin is used with a listener on "input" events, when the user enters a character in the input field the following error is raised:

Uncaught TypeError?: Cannot read property 'charOrCode' of undefined

The error is thrown by dijit/form/_SearchMixin._processInput():

_processInput: function(evt){
	if(this.disabled || this.readOnly){ return; }
	var key = evt.charOrCode; // error here, evt is undefined
	...
}

which is called by dijit/form/_TextBoxMixin._onInput() which passes undefined for the event argument:

_onInput: function(){
	this._lastInputEventValue = this.textbox.value;
	// For Combobox, this needs to be called w/the keydown/keypress event that was passed to onInput()
	this._processInput(this._lastInputProducingEvent);
	...
}

The issue seems to be a side-effect of ​https://github.com/dojo/dijit/commit/054073823470949ace3003f20fdb66ea5e470670 - similar commits in 1.10, 1.9, and 1.8 branches - in the context of #14703).

How to reproduce: Load ​https://github.com/AdrianVasiliu/dijit/blob/autocompleter-textbox-issue/tests/form/AutoCompleterMixin.adrian.html in a browser (reproduced in several desktop and mobile browsers), type a character in the input field and check the console => the error mentioned above shows up.

This test file is a modified version of ​https://github.com/dojo/dijit/blob/master/tests/form/AutoCompleterMixin.html. The changes consist in:

• (for simplicity) removing all but one dijit widget based on _AutoCompleterMixin and _TextBoxMixin
• ensuring the input field is initially empty, and
• adding to the widget a listener for "input" events.

The issue also impacts dojox/mobile widgets using these dijit/form mixins via dojox/mobile/SearchBox. It prevents for instance to perform the filtering of a List using the FilteredListMixin? - however, on the dojox/mobile side this is reproducible only with same mobile browsers.

[bill]

I see, good catch. In your simplified test case the problem is presumably that you overrode onInput() and that prevents this _TextBoxMixin code from running:

 onInput: function(/*Event*/ evt){
	 // summary:
	 //		Connect to this function to receive notifications of various user data-input events.
	 //		Return false to cancel the event and prevent it from being processed.
	 // event:
	 //		keydown | keypress | cut | paste | compositionend
	 // tags:
	 //		callback

	 this._lastInputProducingEvent = evt;
 },

I don't know why I put that code to set _lastInputProducingEvent inside of a user-overridable function. Probably I should have put it right before the call to onInput().

[Bill Keese <[email protected]…>]

In 563129c4745338d859d4b26460b225ff0a80955c/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In bc4a82d4d017509faededebbbdbad7c6054a25df/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In f3f10cc5be13c3cb2531c5cdbfe53b0fd0b55b3b/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 74445e54eeb74821df470a25140bbbad248fa32c/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Adrian Vasiliu]

Thanks Bill. This fixes fine the test case I initially submitted. Unfortunatelly, it does not fix the similar error that I still get with dojox/mobile/SearchBox - which, for some reason, only hurts on some mobile browsers. I was finally able to create a "pure dijit" test reproducing it: ​https://github.com/AdrianVasiliu/dijit/blob/autocompleter-textbox-issue/tests/form/aTestAdrian1.html

It is a very reduced variant of a custom widget with the same inherintence from dijit mixins as dojox/mobile/SearchBox.

Using this sample on at least Chrome / HTC One X / Android 4.2.2 or Chrome / Nexus 5 / Android 6 preview, the console shows the same error when typing into the input field. Note it does not hurt on Chrome / Win, nor on HTC One X using stock browser.

[bill]

OK, does it reproduce in the emulator? If so, what are the exact settings that you used? Preferably something that reproduces out of the box, without having to install chrome from the app store.

[Adrian Vasiliu]

Chrome is mandatory for reproducing. Strangely, even the emulator of Nexus 5 (either Android 5 or 6) comes with stock browser, not Chrome. I was able to install Chrome (downloading the apk then installing with adb command), but... for nothing, because the issue didn't hurt the emulator (tried with Android 6 on Nexus 5 emulator). Also tried with latest Chrome on iOS 8 / iPhone 6, doesn't reproduce either.

So, sadly, Chrome on a physical Android device seems needed for reproducing. I reproduce with Android 4.x (4.2.2 on HTC One X), 5.x (5.1 on Nexus 5) and 6.x (6.0-preview on Nexus 5). Might hold for Chrome on other devices than HTC One X or Nexus5. No chance to get your hands on an Android device on your side?

[bill]

Ah OK I have a very old and almost broken phone where I reproduced it. It's happening because typing normal keys (like abcdefg) produces keydown events but not keypress events, so this._lastInputProducingEvent is never set.

Why are there no keypress events? My guess is because of the phone's word suggestions / predictive text, where the characters you type are tentative (and underlined) until you select something from the multiple choice suggestion menu, similar to ​http://www.techrepublic.com/article/pro-tip-get-more-word-suggestions-from-your-android-keyboard/. You can check if turning off that feature works around the problem for you. (I can't seem to turn it off on my phone, but my phone is Japanese.)

[Adrian Vasiliu]

Good guess! Turning off auto-corrections works it around (at least on Android 5.1 / Nexus 5).

[Adrian Vasiliu]

This might be related: ​https://code.google.com/p/chromium/issues/detail?id=118639 It's an old Chrome issue (opened in 2012) but there have been comments starting in January 2015 (from ​https://code.google.com/p/chromium/issues/detail?id=118639#c209) about composition events, about Google's clame that only hardware keyboard need to send keycodes, not software keyboards etc...

[bill]

PR at ​https://github.com/dojo/dijit/pull/99.

That chromium ticket does seem related, but not sure. It's really long :-).

[Adrian Vasiliu]

To recap here the test results for ​https://github.com/dojo/dijit/pull/99:

a) Webapp in Chrome

• OK: Chrome 44 on Android 6.0 preview / Nexus 5
• OK: Chrome 44 on Android 5.1 / Nexus 5
• KO: Chrome 29 on Android 4.2.2 / HTC One X
• OK: Chrome 44 on Android 4.2.2 / HTC One X (that is, upgrading Chrome fixes it)

b) Hybrid with Cordova 5.1.1

• OK: Android 6.0 preview / Nexus 5
• OK: Android 5.1 / Nexus 5
• OK: Android 4.2.2 / HTC One X

[Bill Keese <[email protected]…>]

In d428c3a5c3cbd6df347010cde62c3190cedab0ae/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 09f3293ce152ebadeb4df7d2cbae1baf08f107fc/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 23c79aa383159103bb9e7827c7c3c2b27edb4e07/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 60065ec5b696c9f00c9c6f1d62333a726aad39a1/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled?