Search code examples
javascripthtmlline-breaks

Is textarea line break value always normalized to "\n" javascript string?


Having a Windows system, I found out that a textarea's value consisting of one single line break is equal to the JavaScript string "\n", and not "\r\n":

console.log(document.getElementById("textarea").value === "\n"); // true
console.log(document.getElementById("textarea").value === "\r\n"); //false
<textarea name="" id="textarea" cols="30" rows="10">

</textarea>

Does it mean I should not worry about the CRLF vs LF issue while working with textarea values as their line breaks always normalized to the "\n" === "\u{000A}" string, so I can surely say that lineBreakOnlyValue.length === 1 and fulfill such an assignment document.getElementById("textarea").value = "\n" without thoughts about different systems line breaking addressing?

Was this behavior specificated in some way?


Solution

  • In the current HTML Standard, it says about the textarea element:

    The API value is the value used in the value IDL attribute, textLength IDL attribute, and by the maxlength and minlength content attributes. It is normalized so that line breaks use U+000A LINE FEED (LF) characters.

    [...] The algorithm for obtaining the element's API value is to return the element's raw value, with newlines normalized.

    The normalization of newlines is described as follows:

    To normalize newlines in a string, replace every U+000D CR U+000A LF code point pair with a single U+000A LF code point, and then replace every remaining U+000D CR code point with a U+000A LF code point.

    Comparison with other properties

    While the value property is subject to this normalization, the textContent, innerHTML, ... properties are not.

    A little demo:

    console.log("innerHTML", JSON.stringify(txt.innerHTML));
    console.log("textContent", JSON.stringify(txt.textContent));
    console.log("value", JSON.stringify(txt.value));
    <textarea id="txt">a&#13;&#10;b</textarea>