fixes + autowrap insertion text with braces when in jsx

Author: zth

analysis/src/CompletionBackEnd.ml

@@ -876,20 +876,23 @@ let rec getCompletionsForContextPath ~full ~opens ~rawOpens ~allFiles ~pos ~env
            ~opens ~allFiles ~pos ~env ~scope
       |> completionsGetTypeEnv
     in
-    let isBuiltin =
+    let lowercaseComponent =
       match pathToComponent with
       | [elName] when Char.lowercase_ascii elName.[0] = elName.[0] -> true
       | _ -> false
     in
     let targetLabel =
-      if isBuiltin then
+      if lowercaseComponent then
         let rec digToTypeForCompletion path ~env =
           match
             path
             |> getCompletionsForPath ~completionContext:Type ~exact:true
                  ~package ~opens ~allFiles ~pos ~env ~scope
           with
           | {kind = Type {kind = Abstract (Some (p, _))}; env} :: _ ->
+            (* This case happens when what we're looking for is a type alias.
+               This is the case in newer rescript-react versions where
+               ReactDOM.domProps is an alias for JsxEvent.t. *)
             let pathRev = p |> Utils.expandPath in
             pathRev |> List.rev |> digToTypeForCompletion ~env
           | {kind = Type {kind = Record fields}; env} :: _ -> (
@@ -1149,7 +1152,7 @@ let rec completeTypedValue (t : SharedTypes.completionType) ~env ~full ~prefix
         (* Pretty print a few common patterns. *)
         match Path.head p |> Ident.name with
         | "unit" -> "()"
-        | "ReactEvent" -> "event"
+        | "ReactEvent" | "JsxEvent" -> "event"
         | _ -> "v" ^ indexText)
     in
     let mkFnArgs ~asSnippet =
@@ -1333,10 +1336,25 @@ let rec processCompletable ~debug ~full ~scope ~env ~pos ~forHover
       with
       | None -> []
       | Some (typ, env, completionContext) -> (
+        let isJsx =
+          match contextPath with
+          | CJsxPropValue _ | CPPipe {inJsx = true} -> true
+          | _ -> false
+        in
         let items =
           typ
           |> completeTypedValue ~mode:Expression ~env ~full ~prefix
                ~completionContext
+          |> List.map (fun (c : Completion.t) ->
+                 if isJsx then
+                   {
+                     c with
+                     insertText =
+                       (match c.insertText with
+                       | None -> None
+                       | Some text -> Some ("{" ^ text ^ "}"));
+                   }
+                 else c)
         in
         match (prefix, completionContext) with
         | "", _ -> items

analysis/tests/src/CompletionJsxProps.res

@@ -16,3 +16,6 @@
 // let _ = <div muted= />
 //                    ^com
 
+// let _ = <div onMouseEnter= />
+//                           ^com
+

analysis/tests/src/expected/CompletionJsxProps.res.txt

@@ -39,7 +39,7 @@ Completable: Cexpression CJsxPropValue [CompletionSupport, TestComponent] test=T
     "detail": "Two\n\ntype testVariant = One | Two | Three(int)",
     "documentation": null,
     "sortText": "A Two",
-    "insertText": "Two",
+    "insertText": "{Two}",
     "insertTextFormat": 2
   }, {
     "label": "Three(_)",
@@ -48,7 +48,7 @@ Completable: Cexpression CJsxPropValue [CompletionSupport, TestComponent] test=T
     "detail": "Three(int)\n\ntype testVariant = One | Two | Three(int)",
     "documentation": null,
     "sortText": "A Three(_)",
-    "insertText": "Three(${1:_})",
+    "insertText": "{Three(${1:_})}",
     "insertTextFormat": 2
   }, {
     "label": "TableclothMap",
@@ -74,31 +74,31 @@ Completable: Cexpression CJsxPropValue [CompletionSupport, TestComponent] polyAr
     "tags": [],
     "detail": "#one\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "#one",
+    "insertText": "{#one}",
     "insertTextFormat": 2
   }, {
     "label": "#three(_, _)",
     "kind": 4,
     "tags": [],
     "detail": "#three(int, bool)\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "#three(${1:_}, ${2:_})",
+    "insertText": "{#three(${1:_}, ${2:_})}",
     "insertTextFormat": 2
   }, {
     "label": "#two",
     "kind": 4,
     "tags": [],
     "detail": "#two\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "#two",
+    "insertText": "{#two}",
     "insertTextFormat": 2
   }, {
     "label": "#two2",
     "kind": 4,
     "tags": [],
     "detail": "#two2\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "#two2",
+    "insertText": "{#two2}",
     "insertTextFormat": 2
   }]
 
@@ -112,23 +112,23 @@ Completable: Cexpression CJsxPropValue [CompletionSupport, TestComponent] polyAr
     "tags": [],
     "detail": "#three(int, bool)\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "three(${1:_}, ${2:_})",
+    "insertText": "{three(${1:_}, ${2:_})}",
     "insertTextFormat": 2
   }, {
     "label": "#two",
     "kind": 4,
     "tags": [],
     "detail": "#two\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "two",
+    "insertText": "{two}",
     "insertTextFormat": 2
   }, {
     "label": "#two2",
     "kind": 4,
     "tags": [],
     "detail": "#two2\n\n[#one | #three(int, bool) | #two | #two2]",
     "documentation": null,
-    "insertText": "two2",
+    "insertText": "{two2}",
     "insertTextFormat": 2
   }]
 
@@ -150,3 +150,18 @@ Completable: Cexpression CJsxPropValue [div] muted
     "documentation": null
   }]
 
+Complete src/CompletionJsxProps.res 18:29
+posCursor:[18:29] posNoWhite:[18:28] Found expr:[18:12->18:32]
+JSX <div:[18:12->18:15] onMouseEnter[18:16->18:28]=...__ghost__[0:-1->0:-1]> _children:18:30
+Completable: Cexpression CJsxPropValue [div] onMouseEnter
+[{
+    "label": "event => {}",
+    "kind": 12,
+    "tags": [],
+    "detail": "JsxEvent.Mouse.t => unit",
+    "documentation": null,
+    "sortText": "A",
+    "insertText": "{${1:event} => {$0}}",
+    "insertTextFormat": 2
+  }]
+