Update test

ClickHouse · Jan 29, 2025 · 4ff77a9 · 4ff77a9
1 parent 66a09e9
commit 4ff77a9
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 3 deletions.
diff --git a/src/components/Badge/Badge.test.tsx b/src/components/Badge/Badge.test.tsx
@@ -2,10 +2,30 @@ import { Badge } from "./Badge";
 import { renderCUI } from "@/utils/test-utils";
 
 describe("Badge", () => {
-  test("given a text, should render it", () => {
+  test("given a text, should render ellipsed badge", () => {
     const text = "text to render";
     const rendered = renderCUI(<Badge text={text} />, "light");
 
     expect(rendered.getByText(text).textContent).toEqual(text);
+    expect(rendered.queryByTestId("ellipsed-badge-content")).not.toBeNull();
+    expect(rendered.queryByTestId("ellipsed-icon-wrapper-text")).not.toBeNull();
+    expect(rendered.queryByTestId("normal-badge-content")).toBeNull();
+    expect(rendered.queryByTestId("normal-icon-wrapper-text")).toBeNull();
+  });
+  test("given a text, should render normal badge when ellipsisContent is false", () => {
+    const text = "text to render";
+    const rendered = renderCUI(
+      <Badge
+        text={text}
+        ellipsisContent={false}
+      />,
+      "light"
+    );
+
+    expect(rendered.getByText(text).textContent).toEqual(text);
+    expect(rendered.queryByTestId("ellipsed-badge-content")).toBeNull();
+    expect(rendered.queryByTestId("ellipsed-icon-wrapper-text")).toBeNull();
+    expect(rendered.queryByTestId("normal-badge-content")).not.toBeNull();
+    expect(rendered.queryByTestId("normal-icon-wrapper-text")).not.toBeNull();
   });
 });
diff --git a/src/components/Badge/Badge.tsx b/src/components/Badge/Badge.tsx
@@ -105,7 +105,7 @@ export const Badge = ({
     $type={type}
     {...props}
   >
-    <Content>
+    <Content data-testid={`${ellipsisContent ? "ellipsed" : "normal"}-badge-content`}>
       <BadgeContent
         as={IconWrapper}
         icon={icon}

diff --git a/src/components/IconWrapper/IconWrapper.tsx b/src/components/IconWrapper/IconWrapper.tsx
@@ -56,7 +56,11 @@ const IconWrapper = ({
           height={height}
         />
       )}
-      <TextWrapper>{children}</TextWrapper>
+      <TextWrapper
+        data-testid={`${ellipsisContent ? "ellipsed" : "normal"}-icon-wrapper-text`}
+      >
+        {children}
+      </TextWrapper>
       {icon && iconDir === "end" && (
         <Icon
           name={icon}