Update on "[compiler] Outline JSX with non-jsx children"

Previously, we bailed out on outlining jsx that had children that were not part of the outlined jsx. Now, we add support for children by treating as attributes. [ghstack-poisoned]
facebook · Nov 6, 2024 · d3d4e27 · d3d4e27
2 parents 296a0de + 58e5c6c
commit d3d4e27
Show file tree

Hide file tree

Showing 5 changed files with 42 additions and 42 deletions.
diff --git a/...iler/src/__tests__/fixtures/compiler/jsx-outlining-dup-key-diff-value.expect.md b/...iler/src/__tests__/fixtures/compiler/jsx-outlining-dup-key-diff-value.expect.md
@@ -55,7 +55,7 @@ function Component(t0) {
   const { arr } = t0;
   const x = useX();
   let t1;
-  if ($[0] !== x || $[1] !== arr) {
+  if ($[0] !== arr || $[1] !== x) {
     let t2;
     if ($[3] !== x) {
       t2 = (i, id) => {
@@ -68,8 +68,8 @@ function Component(t0) {
       t2 = $[4];
     }
     t1 = arr.map(t2);
-    $[0] = x;
-    $[1] = arr;
+    $[0] = arr;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];
@@ -104,16 +104,16 @@ function _temp(t0) {
     t2 = $[3];
   }
   let t3;
-  if ($[4] !== x || $[5] !== t1 || $[6] !== t2) {
+  if ($[4] !== t1 || $[5] !== t2 || $[6] !== x) {
     t3 = (
       <Bar x={x}>
         {t1}
         {t2}
       </Bar>
     );
-    $[4] = x;
-    $[5] = t1;
-    $[6] = t2;
+    $[4] = t1;
+    $[5] = t2;
+    $[6] = x;
     $[7] = t3;
   } else {
     t3 = $[7];
@@ -125,15 +125,15 @@ function Bar(t0) {
   const $ = _c(3);
   const { x, children } = t0;
   let t1;
-  if ($[0] !== x || $[1] !== children) {
+  if ($[0] !== children || $[1] !== x) {
     t1 = (
       <>
         {x}
         {children}
       </>
     );
-    $[0] = x;
-    $[1] = children;
+    $[0] = children;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];

diff --git a/.../src/__tests__/fixtures/compiler/jsx-outlining-dupe-attr-after-rename.expect.md b/.../src/__tests__/fixtures/compiler/jsx-outlining-dupe-attr-after-rename.expect.md
@@ -56,7 +56,7 @@ function Component(t0) {
   const { arr } = t0;
   const x = useX();
   let t1;
-  if ($[0] !== x || $[1] !== arr) {
+  if ($[0] !== arr || $[1] !== x) {
     let t2;
     if ($[3] !== x) {
       t2 = (i, id) => {
@@ -69,8 +69,8 @@ function Component(t0) {
       t2 = $[4];
     }
     t1 = arr.map(t2);
-    $[0] = x;
-    $[1] = arr;
+    $[0] = arr;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];
@@ -113,18 +113,18 @@ function _temp(t0) {
     t3 = $[5];
   }
   let t4;
-  if ($[6] !== x || $[7] !== t1 || $[8] !== t2 || $[9] !== t3) {
+  if ($[6] !== t1 || $[7] !== t2 || $[8] !== t3 || $[9] !== x) {
     t4 = (
       <Bar x={x}>
         {t1}
         {t2}
         {t3}
       </Bar>
     );
-    $[6] = x;
-    $[7] = t1;
-    $[8] = t2;
-    $[9] = t3;
+    $[6] = t1;
+    $[7] = t2;
+    $[8] = t3;
+    $[9] = x;
     $[10] = t4;
   } else {
     t4 = $[10];
@@ -136,15 +136,15 @@ function Bar(t0) {
   const $ = _c(3);
   const { x, children } = t0;
   let t1;
-  if ($[0] !== x || $[1] !== children) {
+  if ($[0] !== children || $[1] !== x) {
     t1 = (
       <>
         {x}
         {children}
       </>
     );
-    $[0] = x;
-    $[1] = children;
+    $[0] = children;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];

diff --git a/...src/__tests__/fixtures/compiler/jsx-outlining-dupe-key-dupe-component.expect.md b/...src/__tests__/fixtures/compiler/jsx-outlining-dupe-key-dupe-component.expect.md
@@ -51,7 +51,7 @@ function Component(t0) {
   const { arr } = t0;
   const x = useX();
   let t1;
-  if ($[0] !== x || $[1] !== arr) {
+  if ($[0] !== arr || $[1] !== x) {
     let t2;
     if ($[3] !== x) {
       t2 = (i, id) => {
@@ -64,8 +64,8 @@ function Component(t0) {
       t2 = $[4];
     }
     t1 = arr.map(t2);
-    $[0] = x;
-    $[1] = arr;
+    $[0] = arr;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];
@@ -100,16 +100,16 @@ function _temp(t0) {
     t2 = $[3];
   }
   let t3;
-  if ($[4] !== x || $[5] !== t1 || $[6] !== t2) {
+  if ($[4] !== t1 || $[5] !== t2 || $[6] !== x) {
     t3 = (
       <Bar x={x}>
         {t1}
         {t2}
       </Bar>
     );
-    $[4] = x;
-    $[5] = t1;
-    $[6] = t2;
+    $[4] = t1;
+    $[5] = t2;
+    $[6] = x;
     $[7] = t3;
   } else {
     t3 = $[7];
@@ -121,15 +121,15 @@ function Bar(t0) {
   const $ = _c(3);
   const { x, children } = t0;
   let t1;
-  if ($[0] !== x || $[1] !== children) {
+  if ($[0] !== children || $[1] !== x) {
     t1 = (
       <>
         {x}
         {children}
       </>
     );
-    $[0] = x;
-    $[1] = children;
+    $[0] = children;
+    $[1] = x;
     $[2] = t1;
   } else {
     t1 = $[2];

diff --git a/...compiler/src/__tests__/fixtures/compiler/jsx-outlining-duplicate-prop.expect.md b/...compiler/src/__tests__/fixtures/compiler/jsx-outlining-duplicate-prop.expect.md
@@ -104,16 +104,16 @@ function _temp(t0) {
     t2 = $[3];
   }
   let t3;
-  if ($[4] !== x || $[5] !== t1 || $[6] !== t2) {
+  if ($[4] !== t1 || $[5] !== t2 || $[6] !== x) {
     t3 = (
       <Bar x={x}>
         {t1}
         {t2}
       </Bar>
     );
-    $[4] = x;
-    $[5] = t1;
-    $[6] = t2;
+    $[4] = t1;
+    $[5] = t2;
+    $[6] = x;
     $[7] = t3;
   } else {
     t3 = $[7];

diff --git a/...r/src/__tests__/fixtures/compiler/jsx-outlining-with-non-jsx-children.expect.md b/...r/src/__tests__/fixtures/compiler/jsx-outlining-with-non-jsx-children.expect.md
@@ -112,16 +112,16 @@ function _temp(t0) {
     t2 = $[4];
   }
   let t3;
-  if ($[5] !== x || $[6] !== t1 || $[7] !== t2) {
+  if ($[5] !== t1 || $[6] !== t2 || $[7] !== x) {
     t3 = (
       <Bar x={x}>
         {t1}
         {t2}
       </Bar>
     );
-    $[5] = x;
-    $[6] = t1;
-    $[7] = t2;
+    $[5] = t1;
+    $[6] = t2;
+    $[7] = x;
     $[8] = t3;
   } else {
     t3 = $[8];
@@ -153,15 +153,15 @@ function Baz(t0) {
   const $ = _c(3);
   const { i, children } = t0;
   let t1;
-  if ($[0] !== i || $[1] !== children) {
+  if ($[0] !== children || $[1] !== i) {
     t1 = (
       <>
         {i}
         {children}
       </>
     );
-    $[0] = i;
-    $[1] = children;
+    $[0] = children;
+    $[1] = i;
     $[2] = t1;
   } else {
     t1 = $[2];