Merge pull request #383 from childrentime/fix/early-wrapReturn

Fix: mv wrapReturn behind transform

Author: carbonrobot

packages/react-live/src/utils/test/fixtures/optional-chain.test.js

@@ -0,0 +1,23 @@
+import { generateElement } from "../../transpile";
+import { shallow } from "../renderer";
+
+describe("transpile", () => {
+  it("should support optional chain", () => {
+    const code = `function Demo() {
+        return <h3 style={{
+            background: 'darkslateblue',
+            color: 'white',
+            padding: 8,
+            borderRadius: 4
+        }}>
+            {'1'?.toString()}
+        </h3>
+        }`;
+    const Component = generateElement({ code });
+    const wrapper = shallow(<Component />);
+
+    expect(wrapper.html()).toMatchInlineSnapshot(
+      `"<h3 style=\\"background:darkslateblue;color:white;padding:8px;border-radius:4px\\">1</h3>"`
+    );
+  });
+});

packages/react-live/src/utils/transpile/index.ts

@@ -35,10 +35,10 @@ export const generateElement = (
   const transformed = compose<string>(
     addJsxConst,
     transform({ transforms: ["imports"] }),
-    wrapReturn,
     spliceJsxConst,
     trimCode,
     transform({ transforms: firstPassTransforms }),
+    wrapReturn,
     trimCode
   )(code);