diff --git a/compiler/core/js_dump.ml b/compiler/core/js_dump.ml
index e4c9f47736..c862052b25 100644
--- a/compiler/core/js_dump.ml
+++ b/compiler/core/js_dump.ml
@@ -1123,23 +1123,13 @@ and print_jsx cxt ?(spread_props : J.expression option)
       fields
   in
   let print_props cxt props =
-    let print_prop_value (x : J.expression) ctx =
-      let needs_braces =
-        match x.expression_desc with
-        | Str _ | Optional_block ({expression_desc = Str _}, _) -> false
-        | _ -> true
-      in
-      if needs_braces then P.string f "{";
-      let next_cxt = expression ~level:0 ctx f x in
-      if needs_braces then P.string f "}";
-      next_cxt
-    in
-
     (* If a key is present, should be printed before the spread props,
     This is to ensure tools like ESBuild use the automatic JSX runtime *)
     let print_key key cxt =
-      P.string f "key=";
-      print_prop_value key cxt
+      P.string f "key={";
+      let cxt_k = expression ~level:0 cxt f key in
+      P.string f "} ";
+      cxt_k
     in
 
     let print_spread_props spread cxt =
@@ -1153,7 +1143,10 @@ and print_jsx cxt ?(spread_props : J.expression option)
       let prop_name = Ext_ident.unwrap_uppercase_exotic n in
       P.string f prop_name;
       P.string f "=";
-      print_prop_value x ctx
+      P.string f "{";
+      let next_cxt = expression ~level:0 ctx f x in
+      P.string f "}";
+      next_cxt
     in
     let printable_props =
       (match key with
diff --git a/tests/tests/src/jsx_preserve_test.mjs b/tests/tests/src/jsx_preserve_test.mjs
index 5a3ddc0ca0..3c71b71dc7 100644
--- a/tests/tests/src/jsx_preserve_test.mjs
+++ b/tests/tests/src/jsx_preserve_test.mjs
@@ -29,21 +29,21 @@ let _single_element_fragment = <>
 
 let _multiple_element_fragment = <>
   <input
-    type="text"
+    type={"text"}
   />
   <input
-    type="number"
+    type={"number"}
   />
 </>;
 
 let _unary_element_with_props = <input
-  className="foo"
-  type="text"
+  className={"foo"}
+  type={"text"}
 />;
 
 let _container_element_with_props_and_children = <div
-  className="foo"
-  title="foo"
+  className={"foo"}
+  title={"foo"}
 >
   {"Hello, world!"}
 </div>;
@@ -57,19 +57,19 @@ let newrecord = {...baseProps};
 
 let _unary_element_with_spread_props = <input
   {...newrecord} 
-  type="text"
+  type={"text"}
 />;
 
 let newrecord$1 = {...baseProps};
 
 let _container_with_spread_props = <div
   {...newrecord$1} 
-  title="barry"
-  className="barry"
+  title={"barry"}
+  className={"barry"}
 >
   {"Hello, world!"}
   <input
-    type="text"
+    type={"text"}
   />
 </div>;
 
@@ -83,8 +83,8 @@ let baseChildren = [
 ];
 
 let _container_with_spread_children = <div
-  className="barry"
-  title="barry"
+  className={"barry"}
+  title={"barry"}
 >
   {baseChildren}
 </div>;
@@ -93,8 +93,8 @@ let newrecord$2 = {...baseProps};
 
 let _container_with_spread_props_and_children = <div
   {...newrecord$2} 
-  title="barry"
-  className="barry"
+  title={"barry"}
+  className={"barry"}
 >
   {baseChildren}
 </div>;
@@ -102,22 +102,22 @@ let _container_with_spread_props_and_children = <div
 let newrecord$3 = {...baseProps};
 
 let _unary_element_with_spread_props_keyed = <input
-  key="barry-key"
+  key={"barry-key"} 
   {...newrecord$3} 
-  type="text"
+  type={"text"}
 />;
 
 let newrecord$4 = {...baseProps};
 
 let _container_with_spread_props_keyed = <div
-  key="barry-key"
+  key={"barry-key"} 
   {...newrecord$4} 
-  title="barry"
-  className="barry"
+  title={"barry"}
+  className={"barry"}
 >
   {"Hello, world!"}
   <input
-    type="text"
+    type={"text"}
   />
 </div>;
 
@@ -156,29 +156,29 @@ let MyWeirdComponent = {
 };
 
 let _escaped_jsx_prop = <Jsx_preserve_test$MyWeirdComponent
-  MyWeirdProp="bar"
+  MyWeirdProp={"bar"}
 />;
 
 let _large_component = <div
-  className="bar"
+  className={"bar"}
   tabIndex={1}
-  title="foo"
+  title={"foo"}
   onClick={param => {}}
   onMouseDown={param => {}}
 >
   <p
-    className="bar"
+    className={"bar"}
     tabIndex={1}
-    title="foo"
+    title={"foo"}
     onClick={param => {}}
     onMouseDown={param => {}}
   >
     {"Hello, world!"}
   </p>
   <strong
-    className="bar"
+    className={"bar"}
     tabIndex={1}
-    title="foo"
+    title={"foo"}
     onClick={param => {}}
     onMouseDown={param => {}}
   >
@@ -199,13 +199,13 @@ let ComponentWithOptionalProps = {
 
 let _optional_props = <Jsx_preserve_test$ComponentWithOptionalProps
   i={1}
-  s="test"
+  s={"test"}
   element={<div />}
 />;
 
 let _props_with_hyphen = <label
-  aria-label="close sidebar"
-  data-testid="test"
+  aria-label={"close sidebar"}
+  data-testid={"test"}
 />;
 
 export {