I have a select element that contains options whose values contain tab characters. My original use case was a trailing tab (string\t), but I've also tested with leading tabs (\tstring) and tabs in the middle of non-whitespace (str\ting).
I called .val('value with tab') on the select element and expected the corresponding option to be selected since the values are identical, but no option is selected.
.val('value with tab')
A few interesting observations:
JSFiddle: https://jsfiddle.net/onnucjx7/2/ You'll see in the console what I expect the behavior to be compared to what the behavior actually is.
I searched for "tab" and "whitespace" and didn't see anything directly relevant; I did find this issue #1902 but it only mentions IE10 and I am seeing the unexpected behavior in Firefox 44 and Chrome 48.
Yeah, this bug fix seems responsible. Here's the PR and discussion. If we pull out that fix it seems like the code you're trying to use may not work on IE9 or 10, but then again we seem to have broken it consistently everywhere with this.
Actually, it looks to me like f6302b0 was overzealous in expanding 541e734 to include trimming of values rather than just text. I think a partial revert is in order.
Is it really broken, though? From what I see we do the same that Chrome/Firefox does with one exception that we return null when no value is selected instead of an empty string: https://jsfiddle.net/m_gol/onnucjx7/3/
I think your fiddle is broken with respect to my comment (what's with the val attributes and replaced whitespace?). Focusing on value, I see the same behavior in Chrome, Firefox, and Edge: https://jsfiddle.net/onnucjx7/4/
All three are defining the value IDL attribute as a stripped and collapsed whitespace version of the content attribute, treating it like text instead of following the spec.
EDIT: The browsers are fine; this is jQuery's fault. I forgot that the <option> valHook getter is also used in the <select> valHook getter.
Fixing this should consist of updating the <option> valHook to return elem.value directly when it is correct, and otherwise performing the full strip and collapse whitespace operation (which requires more than jQuery.trim) upon jQuery.text( elem ).
jQuery.text( elem )
Attributes: strip/collapse whitespace for set values on selects