Allow single empty line between JSX expressions

CHANGELOG.md

@@ -31,6 +31,7 @@
 - AST cleanup: represent concatenation (`++`) and (dis)equality operators (`==`, `===`, `!=`, `!==`) just like in the syntax. https://github.com/rescript-lang/rescript/pull/7248
 - AST cleanup: use inline record for `Ptyp_arrow`. https://github.com/rescript-lang/rescript/pull/7250
 - Playground: Bundle stdlib runtime so that the playground can execute functions from Core/Belt/Js. (#7255)
+- Allow single newline in JSX. https://github.com/rescript-lang/rescript/pull/7246
 
 # 12.0.0-alpha.7
 

compiler/syntax/src/res_printer.ml

@@ -4435,33 +4435,46 @@ and print_jsx_children ~state (children_expr : Parsetree.expression) ~sep
   match children_expr.pexp_desc with
   | Pexp_construct ({txt = Longident.Lident "::"}, _) ->
     let children, _ = ParsetreeViewer.collect_list_expressions children_expr in
-    Doc.group
-      (Doc.join ~sep
-         (List.map
-            (fun (expr : Parsetree.expression) ->
-              let leading_line_comment_present =
-                has_leading_line_comment cmt_tbl expr.pexp_loc
-              in
-              let expr_doc =
-                print_expression_with_comments ~state expr cmt_tbl
-              in
-              let add_parens_or_braces expr_doc =
-                (* {(20: int)} make sure that we also protect the expression inside *)
-                let inner_doc =
-                  if Parens.braced_expr expr then add_parens expr_doc
-                  else expr_doc
-                in
-                if leading_line_comment_present then add_braces inner_doc
-                else Doc.concat [Doc.lbrace; inner_doc; Doc.rbrace]
-              in
-              match Parens.jsx_child_expr expr with
-              | Nothing -> expr_doc
-              | Parenthesized -> add_parens_or_braces expr_doc
-              | Braced braces_loc ->
-                print_comments
-                  (add_parens_or_braces expr_doc)
-                  cmt_tbl braces_loc)
-            children))
+    let print_expr (expr : Parsetree.expression) =
+      let leading_line_comment_present =
+        has_leading_line_comment cmt_tbl expr.pexp_loc
+      in
+      let expr_doc = print_expression_with_comments ~state expr cmt_tbl in
+      let add_parens_or_braces expr_doc =
+        (* {(20: int)} make sure that we also protect the expression inside *)
+        let inner_doc =
+          if Parens.braced_expr expr then add_parens expr_doc else expr_doc
+        in
+        if leading_line_comment_present then add_braces inner_doc
+        else Doc.concat [Doc.lbrace; inner_doc; Doc.rbrace]
+      in
+      match Parens.jsx_child_expr expr with
+      | Nothing -> expr_doc
+      | Parenthesized -> add_parens_or_braces expr_doc
+      | Braced braces_loc ->
+        print_comments (add_parens_or_braces expr_doc) cmt_tbl braces_loc
+    in
+    let get_loc expr =
+      match ParsetreeViewer.process_braces_attr expr with
+      | None, _ -> expr.pexp_loc
+      | Some ({loc}, _), _ -> loc
+    in
+    let rec loop prev acc exprs =
+      match exprs with
+      | [] -> List.rev acc
+      | expr :: tails ->
+        let start_loc = (get_loc expr).loc_start.pos_lnum in
+        let end_loc = (get_loc prev).loc_end.pos_lnum in
+        let expr_doc = print_expr expr in
+        let docs =
+          if start_loc - end_loc > 1 then
+            Doc.concat [Doc.hard_line; expr_doc] :: acc
+          else expr_doc :: acc
+        in
+        loop expr docs tails
+    in
+    let docs = loop children_expr [] children in
+    Doc.group (Doc.join ~sep docs)
   | _ ->
     let leading_line_comment_present =
       has_leading_line_comment cmt_tbl children_expr.pexp_loc

tests/syntax_tests/data/printer/comments/expected/jsx.res.txt

@@ -69,6 +69,7 @@ let x =
   <>
     // before a
     {a} // after a
+
     // before b
     {b} // after b
   </>

tests/syntax_tests/data/printer/expr/expected/jsx.res.txt

@@ -351,6 +351,7 @@ module App = {
     // comment
     content
   }
+
   {
     // comment
     if condition() {
@@ -460,3 +461,49 @@ let x = {
   let _ = <C> {children} </C>
   msg->React.string
 }
+
+let x =
+  <div>
+    <span
+      id="1"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}
+    />
+
+    // Comment 2
+
+    <span
+      id="2"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}>
+      <span
+        id="2-1"
+        className="sdf sdfdsf sdfs sdf asdf dsf"
+        onClick={() => {
+          ()
+        }}
+      />
+
+      // Comment
+      <span
+        id="2-2"
+        className="sdf sdfdsf sdfs sdf asdf dsf"
+        onClick={() => {
+          ()
+        }}
+      />
+
+      <span id="2-3" />
+    </span>
+    <span
+      id="3"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}
+    />
+  </div>

tests/syntax_tests/data/printer/expr/jsx.res

@@ -443,3 +443,52 @@ let x = {
   let _ = <C> {children} </C>
   msg->React.string
 }
+
+let x =
+  <div>
+    <span
+      id="1"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}
+    />
+
+    // Comment 2
+
+    <span
+      id="2"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}
+    >
+      <span
+        id="2-1"
+        className="sdf sdfdsf sdfs sdf asdf dsf"
+        onClick={() => {
+          ()
+        }}
+      />
+
+
+      // Comment
+      <span
+        id="2-2"
+        className="sdf sdfdsf sdfs sdf asdf dsf"
+        onClick={() => {
+          ()
+        }}
+      />
+
+      <span id="2-3" 
+      />
+    </span>
+    <span
+      id="3"
+      className="sdf sdfdsf sdfs sdf asdf dsf"
+      onClick={() => {
+        ()
+      }}
+    />
+  </div>