Affects: IE10 (Windows 7) (Might affect Windows 8)
Microsoft released IE10 RTM for Windows 7 on February 26th exactly 4 whole months after it was released for Windows 8.
While this was a welcome upgrade for the developer community it was met with a lack-luster response.
The UI skin was directly ported from Windows 8 and so every control is rendered flat, no longer responds to the hover event visually and has lost all the visual styling and clues that made Windows 7 such a successful operating system.
2 significant issues have come out of this (1 is related to select lists (but that will be coming in a future post)) but the other is a behavior regression in the Textarea Element.
In normal use a user can place the cursor at the end of any line of text by clicking in the textarea anywhere to the right of that line. This enables easy navigation within the textarea to jump in at any point and start editing.
In IE10 it does work but only in very specific circumstances.
The bug exhibits itself currently in any Textarea where the field is defined but no line break appears in the content of the tag. e.g. an empty Textarea (the default for most textarea's initially). Instead of putting the focus at the end of the line IE 10 places it at the beginning of the next line unless you click within a pixel or two of the last character.
If any developers can test this in IE10 on Windows 8 (both Desktop and Metro) please let us know if the issue exists there too.
Example:
This Fails:
<textarea cols="60" rows="8">Add Lines and try to navigate!</textarea>
Yet this works fine:
<textarea cols="60" rows="8">One
Two
Three
</textarea>
We hope that Microsoft can fix this quickly and thus can get this patched up before Automatic Updates kick in for Windows users. Currently this regression is annoying and is a direct violation of Fitts's Law.
Known Workarounds: None. Well you could add line breaks to every textarea in your sites/apps but this is something that Microsoft should fix ASAP not Web Developers.
Related Issues: None.
Posts
5 comments:
Actually, in testing with JSFiddle on IE10 (win7x64) the example that should work, you still cannot put your cursor at the end of "three" without the above mentioned hassle. "one" and "two" work, however.
From the looks of it, it's putting the cursor after the last character, a newline character. But since it doesn't do this when the text is already in the textarea, and I haven't tested it much, it's hard to say what is actually happening with certainty.
Actually, in testing with JSFiddle on IE10 (win7x64) the example that should work, you still cannot put your cursor at the end of "three" without the above mentioned hassle. "one" and "two" work, however.
From the looks of it, it's putting the cursor after the last character, a newline character. But since it doesn't do this when the text is already in the textarea, and I haven't tested it much, it's hard to say what is actually happening with certainty.
I can confirm this behavior in Windows 8 in both Desktop and Metro mode.
I also noticed that it is possible to select the end of the second line of an empty textarea using this method, but ONLY the second line, and I am unable to select the first line at all.
Tried this on Windows 8 RT (Both Metro and Desktop IE10) and and it fails on both.
I also tested this on Windows 7 with the final version of IE10 and it fails there too!
It works fine in all other browsers on all other Operating Systems. Only IE10 is affected by this bug.
First of all let me tell you, you have got a great blog. I am interested in looking for more of such topics and would like to have
further information. Hope to see the next blog soon.
Bug defect tracking
Post a Comment