textarea placeholder bug in Firefox


The new Firefox is out! Powered by the ludicrous-speed quantum engine - it really is a marvel to behold.

Unfortunately, there's a rather annoying bug in the way it renders placeholder text. Consider the following HTML:

<textarea placeholder="In loving memory of
Buffy Anne Summers
She saved the world
A lot..."></textarea>

This should render a textarea (a multi-line input box) pre-filled with placeholder text. The text should be over multiple lines. Instead, it renders like this:

Screenshot - the text is rendered on a single line

Is that right? No! Let's see what the spec says (disclaimer - I'm an editor on the HTML 5.3 spec).

User agents should present this hint to the user when the element’s value is the empty string and the control is not focused (e.g., by displaying it inside a blank unfocused control). All U+000D CARRIAGE RETURN U+000A LINE FEED character pairs (CRLF) in the hint, as well as all other U+000D CARRIAGE RETURN (CR) and U+000A LINE FEED (LF) characters in the hint, must be treated as line breaks when rendering the hint.
HTML 5.2 - 4.10.11. The textarea element

Amusingly, Mozilla's own documentation corroborates this:

placeholder
A hint to the user of what can be entered in the control. Carriage returns or line-feeds within the placeholder text must be treated as line breaks when rendering the hint.
MDN <textarea>

I've raised this as a bug with Mozilla - sadly, my C++ is too rusty to contribute a patch!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.