dijit/Select hides selected option when validation fails

[Nick Fenwick]

I've found that dijit/Select incorrectly hides the currently selected option if it's invalid, leading to just a narrow "!" being displayed for the entire Select dropdown.

From a quick look, it seems that the element that holds the selected item's text is given a class that sets its display to 'none'.

​http://dojo-sandbox.net/public/b35b9/1 is a test case with the first option given a value of " " as described in the docs at http://dojotoolkit.org/reference-guide/1.8/dijit/form/Select.html#note-about-validation .. with this option selected, tabbing off the Select causes its validation to correctly fail, and in the call to this._set("state", ...) the classes applied causes the selected option to dissappear.

I'll attach a screenshot of the situation.

[Nick Fenwick]

Screenshot of debugger just after CSS classes are applied to invalid Select.

[Nick Fenwick]

For the record, the classes are applied in _CssStateMixin line 191:

tn.className = newClasses.join(" ");

where newClasses is:

newClasses: Array[16]
0: "dijit"
1: "dijitReset"
2: "dijitInline"
3: "dijitLeft"
4: "dijitDownArrowButton"
5: "dijitSelect"
6: "dijitValidationTextBox"
7: "dijitSelectError"
8: "dijitValidationTextBoxError"
9: "dijitError"
10: "dijitSelectFocused"
11: "dijitValidationTextBoxFocused"
12: "dijitSelectErrorFocused"
13: "dijitValidationTextBoxErrorFocused"
14: "dijitErrorFocused"
15: "dijitFocused"

As soon as that line is executed and the classes applied, the selected options text "- select an option -" dissappears.

[Douglas Hays]

In [30519]:

Fixes #16422. Don't hide invalid option label in Select.