From 2789ace601f20b237408e4b51531f246fb77420d Mon Sep 17 00:00:00 2001
From: yosuke ota <otameshiyo23@gmail.com>
Date: Mon, 11 Apr 2022 10:36:04 +0900
Subject: [PATCH] check leading newline immediately after `<textarea>` in SSR.

---
 .../compile/render_ssr/handlers/Element.ts    | 10 +++++++--
 .../samples/textarea-content/_expected.html   | 21 +++++++------------
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/src/compiler/compile/render_ssr/handlers/Element.ts b/src/compiler/compile/render_ssr/handlers/Element.ts
index 0469bac531..5957e1db0d 100644
--- a/src/compiler/compile/render_ssr/handlers/Element.ts
+++ b/src/compiler/compile/render_ssr/handlers/Element.ts
@@ -168,9 +168,15 @@ export default function (node: Element, renderer: Renderer, options: RenderOptio
 			renderer.add_expression(x`($$value => $$value === void 0 ? ${result} : $$value)(${node_contents})`);
 		} else {
 			if (node.name === 'textarea') {
-				// Restore the leading newline immediately after `<textarea>`.
+				// Two or more leading newlines are required to restore the leading newline immediately after `<textarea>`.
 				// see https://html.spec.whatwg.org/multipage/syntax.html#element-restrictions
-				renderer.add_string('\n');
+				const value_attribute = node.attributes.find(({ name }) => name === 'value');
+				if (value_attribute) {
+					const first = value_attribute.chunks[0];
+					if (first && first.type === 'Text' && start_newline.test(first.data)) {
+						renderer.add_string('\n');
+					}
+				}
 			}
 			renderer.add_expression(node_contents);
 		}
diff --git a/test/server-side-rendering/samples/textarea-content/_expected.html b/test/server-side-rendering/samples/textarea-content/_expected.html
index 7be30b0037..5ca4604bb6 100644
--- a/test/server-side-rendering/samples/textarea-content/_expected.html
+++ b/test/server-side-rendering/samples/textarea-content/_expected.html
@@ -1,27 +1,20 @@
-<textarea id="textarea">
-  A
+<textarea id="textarea">  A
   B
 </textarea>
 
-<div id="div-with-textarea"><textarea>
-    A
+<div id="div-with-textarea"><textarea>    A
     B
   </textarea></div>
 
-<div id="textarea-with-leading-newline"><textarea>
-leading newline</textarea>
-  <textarea>
-  leading newline and spaces</textarea>
+<div id="textarea-with-leading-newline"><textarea>leading newline</textarea>
+  <textarea>  leading newline and spaces</textarea>
   <textarea>
 
 leading newlines</textarea></div>
 
-<div id="textarea-without-leading-newline"><textarea>
-without spaces</textarea>
-  <textarea>
-  with spaces  </textarea>
-  <textarea>
- 
+<div id="textarea-without-leading-newline"><textarea>without spaces</textarea>
+  <textarea>  with spaces  </textarea>
+  <textarea> 
 newline after leading space</textarea></div>
 
 <textarea id="textarea-with-multiple-leading-newlines">