suggest using jsx fragment where appropriate

Author: zth

compiler/ml/error_message_utils.ml

@@ -353,11 +353,24 @@ let print_extra_type_clash_help ~extract_concrete_typedecl ~env loc ppf
     ->
     fprintf ppf
       "@,@,Dicts are written like: @{<info>dict{\"a\": 1, \"b\": 2}@}@,"
-  | _, Some ({Types.desc = Tconstr (_p1, _, _)}, {desc = Tconstr (p2, _, _)})
+  | ( _,
+      Some
+        (({Types.desc = Tconstr (_p1, _, _)} as ty), {desc = Tconstr (p2, _, _)})
+    )
     when Path.same Predef.path_unit p2 ->
+    fprintf ppf "\n\n";
+    let is_jsx_element =
+      match Ctype.expand_head env ty with
+      | {desc = Tconstr (Pdot (Pident {name = "Jsx"}, "element", _), _, _)} ->
+        true
+      | _ -> false
+    in
+    if is_jsx_element then
+      fprintf ppf
+        "  - Did you forget to wrap this + adjacent JSX in a JSX fragment \
+         (@{<info><></>@})?\n";
     fprintf ppf
-      "\n\n\
-      \  - Did you mean to assign this to a variable?\n\
+      "  - Did you mean to assign this to a variable?\n\
       \  - If you don't care about the result of this expression, you can \
        assign it to @{<info>_@} via @{<info>let _ = ...@} or pipe it to \
        @{<info>ignore@} via @{<info>expression->ignore@}\n\n"
@@ -714,7 +727,7 @@ let type_clash_context_maybe_option ty_expected ty_res =
 
 let type_clash_context_in_statement sexp =
   match sexp.Parsetree.pexp_desc with
-  | Pexp_apply _ -> Some (Statement FunctionCall)
+  | Pexp_apply {transformed_jsx = false} -> Some (Statement FunctionCall)
   | _ -> None
 
 let print_contextual_unification_error ppf t1 t2 =

tests/build_tests/super_errors/expected/jsx_maybe_missing_fragment.res.expected

@@ -0,0 +1,16 @@
+
+  We've found a bug for you!
+  /.../fixtures/jsx_maybe_missing_fragment.res:18:3-8
+
+  16 │ 
+  17 │ let x = {
+  18 │   <> </>
+  19 │   <> </>
+  20 │ }
+
+  This has type: React.element (defined as Jsx.element)
+  But it's expected to have type: unit
+
+  - Did you forget to wrap this + adjacent JSX in a JSX fragment (<></>)?
+  - Did you mean to assign this to a variable?
+  - If you don't care about the result of this expression, you can assign it to _ via let _ = ... or pipe it to ignore via expression->ignore

tests/build_tests/super_errors/fixtures/jsx_maybe_missing_fragment.res

@@ -0,0 +1,20 @@
+@@config({
+  flags: ["-bs-jsx", "4"],
+})
+
+module React = {
+  type element = Jsx.element
+  type componentLike<'props, 'return> = 'props => 'return
+  type component<'props> = Jsx.component<'props>
+
+  @module("react/jsx-runtime")
+  external jsx: (component<'props>, 'props) => element = "jsx"
+
+  type fragmentProps = {children?: element}
+  @module("react/jsx-runtime") external jsxFragment: component<fragmentProps> = "Fragment"
+}
+
+let x = {
+  <> </>
+  <> </>
+}