From bd0d74fdec677f50ca2cb9ff9e6598a4c3751738 Mon Sep 17 00:00:00 2001
From: Pionxzh <pionxzh@csie.io>
Date: Tue, 7 May 2024 23:04:44 +0800
Subject: [PATCH] test: update test cases

---
 .../transformations/__tests__/un-jsx.spec.ts  | 117 ++++++++++++++----
 1 file changed, 92 insertions(+), 25 deletions(-)

diff --git a/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts b/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts
index dae71dfc..6df29cc3 100644
--- a/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts
+++ b/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts
@@ -154,7 +154,7 @@ inlineTest('jsx with dynamic Component tag',
   `
 function fn() {
   return React.createElement(
-    "div",
+    r ? "a" : "div",
     null,
     "Hello",
   );
@@ -162,7 +162,8 @@ function fn() {
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const Component = r ? "a" : "div";
+  return <Component>Hello</Component>;
 }
 `,
 )
@@ -170,7 +171,6 @@ function fn() {
 inlineTest('jsx with dynamic Component tag #2',
   `
 function fn() {
-  const components = ["div", "a"]
   return React.createElement(
     components[0],
     null,
@@ -180,7 +180,8 @@ function fn() {
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const Component = components[0];
+  return <Component>Hello</Component>;
 }
 `,
 )
@@ -188,8 +189,6 @@ function fn() {
 inlineTest('jsx with dynamic Component tag #3',
   `
 const Foo = () => {
-  const r = true;
-  const g = false;
   return jsxs("div", {
     children: [
       jsx(r ? "a" : "div", { children: "bar" }, "b"),
@@ -200,17 +199,47 @@ const Foo = () => {
 `,
   `
 const Foo = () => {
-  return <div><a key="b">bar</a><div key={c}>baz</div></div>;
+  const Component = g ? "p" : "div";
+  const Component_1 = r ? "a" : "div";
+  return <div><Component_1 key="b">bar</Component_1><Component key={c}>baz</Component></div>;
 };
 `,
 )
 
-inlineTest('jsx with dynamic Component tag #4',
+inlineTest('jsx with dynamic Component tag - tag name in constant variable',
+  `
+function fn() {
+  const Name = "div";
+  return React.createElement(Name, null);
+}
+`,
+  `
+function fn() {
+  return <div />;
+}
+`,
+)
+
+inlineTest('jsx with dynamic Component tag - tag name in constant variable but the value is not a string',
+  `
+function fn() {
+  const Name = 1;
+  return React.createElement(Name, null);
+}
+`,
+  `
+function fn() {
+  const Name = 1;
+  return <Name />;
+}
+`,
+)
+
+inlineTest('jsx with dynamic Component tag - ternary with constant boolean',
   `
 function fn() {
-  const value = "wakaru"
   return React.createElement(
-    value ? "a" : "div",
+    true ? "a" : "div",
     null,
     "Hello",
   );
@@ -218,17 +247,44 @@ function fn() {
 `,
   `
 function fn() {
-  return <a>Hello</a>;
+  return <div>Hello</div>;
 }
 `,
 )
 
-inlineTest('jsx with dynamic Component tag #5',
+inlineTest('jsx with dynamic Component tag - ternary with constant boolean in a variable',
+  `
+const Foo = () => {
+  const r = true;
+  const g = false;
+  return jsxs("div", {
+    children: [
+      jsx(r ? "a" : "div", { children: "bar" }, "b"),
+      jsx(g ? "p" : "div", { children: "baz" }, c),
+    ]
+  });
+};
+`,
+  `
+const Foo = () => {
+  return <div><a key="b">bar</a><div key={c}>baz</div></div>;
+};
+`,
+)
+
+inlineTest('jsx with dynamic Component tag - ternary with constant value in a variable',
   `
 function fn() {
-  const value = ""
-  return React.createElement(
-    value ? "a" : "div",
+  const truthy = "wakaru"
+  const truthyComp = React.createElement(
+    truthy ? "a" : "div",
+    null,
+    "Hello",
+  );
+
+  const falsy = ""
+  const falsyComp = React.createElement(
+    falsy ? "a" : "div",
     null,
     "Hello",
   );
@@ -236,32 +292,37 @@ function fn() {
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const truthyComp = <a>Hello</a>;
+
+  const falsyComp = <div>Hello</div>;
 }
 `,
 )
 
-inlineTest('jsx with dynamic Component tag #6',
+inlineTest('jsx with dynamic Component tag - tag name in an array',
   `
 function fn() {
-  const Name = "div";
-  const attrs = {id: "x"};
-  return React.createElement(Name, attrs);
+  const components = ["div", "a"]
+  return React.createElement(
+    components[0],
+    null,
+    "Hello",
+  );
 }
 `,
   `
 function fn() {
-  const attrs = {id: "x"};
-  return <div {...attrs} />;
+  return <div>Hello</div>;
 }
 `,
 )
 
-inlineTest('jsx with dynamic Component tag #7',
+inlineTest('jsx with dynamic Component tag - tag name in an array #invalid',
   `
 function fn() {
+  const components = ["div", "a"]
   return React.createElement(
-    true ? "a" : "div",
+    components[3],
     null,
     "Hello",
   );
@@ -269,7 +330,13 @@ function fn() {
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const components = ["div", "a"]
+  const Component = components[3];
+  return React.createElement(
+    Component,
+    null,
+    "Hello",
+  );
 }
 `,
 )