test: update test cases

pionxzh · May 7, 2024 · bd0d74f · bd0d74f
1 parent c2cd589
commit bd0d74f
Showing 1 changed file with 92 additions and 25 deletions.
diff --git a/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts b/packages/unminify/src/transformations/__tests__/un-jsx.spec.ts
@@ -154,23 +154,23 @@ inlineTest('jsx with dynamic Component tag',
   `
 function fn() {
   return React.createElement(
-    "div",
+    r ? "a" : "div",
     null,
     "Hello",
   );
 }
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const Component = r ? "a" : "div";
+  return <Component>Hello</Component>;
 }
 `,
 )
 
 inlineTest('jsx with dynamic Component tag #2',
   `
 function fn() {
-  const components = ["div", "a"]
   return React.createElement(
     components[0],
     null,
@@ -180,16 +180,15 @@ function fn() {
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const Component = components[0];
+  return <Component>Hello</Component>;
 }
 `,
 )
 
 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,76 +199,144 @@ 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",
   );
 }
 `,
   `
 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",
   );
 }
 `,
   `
 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",
   );
 }
 `,
   `
 function fn() {
-  return <div>Hello</div>;
+  const components = ["div", "a"]
+  const Component = components[3];
+  return React.createElement(
+    Component,
+    null,
+    "Hello",
+  );
 }
 `,
 )