Some of the decisions taken on the design of TextField views are controversial, but there is a lot of reasons behind them, I wanted to briefly explain the reasoning behind it. Here is a list of issues we hit with the cross-browser implementation:

• <input type=text> <textarea> tags are implemented in different ways across all browsers as they were not fully spec-ed in CSS. They have different borders, different ways to show focus, and some of the css parameters don't work consistently across browsers like vertical alignment and padding.

• Padding doesn't work in IE, and there is no way to use border-box in IE8 unless you are in quirks or IE7 mode (this is funny since they came up with the concept).
•  

• Firefox is really buggy when you use input or textarea inside absolutely positioned elements(!!!). This are some of the issues we have observed:

-Text editing cursor is not visible but you can type and select but no blinking cursor.

-Text cursor is visible but you cannot select.

-Text cursor is visible and you can select but the selection highlight is not visible.

-Mousepressed events only trigger once if you leave the key pressed (varies depending on the key and the caret position). This works consistently in both IE and Safari.

Solutions

After a lot of trials and discussions we decided to completely remove the chrome and style textfields to get a consistent rendering across all browsers and we added some extra divs to simulate the border and padding (always trying to keep it as light as possible). *You can style textfield views to use the native chrome but if you want pixel perfect styles across all browsers you are going to hit a lot of roadblocks.

As for the firefox bugs this was a bit of a nightmare. In our search for a fix we found tons of workarounds like hiding the element, disabling and then enabling the element, and finally the most consistent: setting the position to be fixed. Initially we were applying this fix when the view obtained focus but this approach had a big problem, as you clicked to start selecting, the element switched the position to be fixed and therefore loosing track of where we started selecting. Once you released the mouse the cursor will appear blinking at the end of text, the second time you tried it would work since the position was already set to be fixed.

SC ended up applying the fix for all textfields all the time as this was the only to way to have a consistent workaround for this bugs. You might be thinking "what about performance", and yes we did think about it. This fix was the last option because we were concerned with performance as every time you scrolled or resized a window the fixed position would have to be recalculated for all textfields. Surprisingly, we have done enough performance tweaks to have firefox render the textfields without having any noticeable performance hit. :D

PS. All related firefox text selection/ cursor visibility bugs appear as closed for FF3.5. We will report this to their bugzilla.