Updated test for topic detail overview.

provectus · Jan 12, 2022 · 4ec121e · 4ec121e
1 parent 97b0710
commit 4ec121e
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 14 deletions.
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/Overview.tsx
@@ -11,7 +11,7 @@ import VerticalElipsisIcon from 'components/common/Icons/VerticalElipsisIcon';
 import * as Metrics from 'components/common/Metrics';
 import TagStyled from 'components/common/Tag/Tag.styled';
 
-interface Props extends Topic, TopicDetails {
+export interface Props extends Topic, TopicDetails {
   clusterName: ClusterName;
   topicName: TopicName;
   clearTopicMessages(

diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Overview/__test__/Overview.spec.tsx
@@ -6,12 +6,8 @@ import Overview from 'components/Topics/Topic/Details/Overview/Overview';
 import { Colors } from 'theme/theme';
 
 describe('Overview', () => {
-  const mockInternal = false;
   const mockClusterName = 'local';
   const mockTopicName = 'topic';
-  const mockUnderReplicatedPartitions = 1;
-  const mockInSyncReplicas = 1;
-  const mockReplicas = 0;
   const mockClearTopicMessages = jest.fn();
   const mockPartitions = [
     {
@@ -28,18 +24,23 @@ describe('Overview', () => {
       offsetMin: 0,
     },
   ];
-  const renderComponent = () =>
+
+  const renderComponent = ({
+    underReplicatedPartitions = 1,
+    inSyncReplicas = 1,
+    replicas = 1,
+  } = {}) =>
     render(
       <Overview
         name={mockTopicName}
         partitions={mockPartitions}
-        internal={mockInternal}
+        internal={false}
         clusterName={mockClusterName}
         topicName={mockTopicName}
         clearTopicMessages={mockClearTopicMessages}
-        underReplicatedPartitions={mockUnderReplicatedPartitions}
-        inSyncReplicas={mockInSyncReplicas}
-        replicas={mockReplicas}
+        underReplicatedPartitions={underReplicatedPartitions}
+        inSyncReplicas={inSyncReplicas}
+        replicas={replicas}
       />
     );
 
@@ -49,7 +50,6 @@ describe('Overview', () => {
         <Overview
           name={mockTopicName}
           partitions={mockPartitions}
-          internal={mockInternal}
           clusterName={mockClusterName}
           topicName={mockTopicName}
           clearTopicMessages={mockClearTopicMessages}
@@ -64,7 +64,7 @@ describe('Overview', () => {
         <Overview
           name={mockTopicName}
           partitions={[]}
-          internal={mockInternal}
+          internal={undefined}
           clusterName={mockClusterName}
           topicName={mockTopicName}
           clearTopicMessages={mockClearTopicMessages}
@@ -85,9 +85,13 @@ describe('Overview', () => {
     });
 
     it('should be the appropriate color', () => {
-      renderComponent();
+      renderComponent({
+        underReplicatedPartitions: 0,
+        inSyncReplicas: 1,
+        replicas: 2,
+      });
       const circles = screen.getAllByRole('circle');
-      expect(circles[0]).toHaveStyle(`fill: ${Colors.green[40]}`);
+      expect(circles[0]).toHaveStyle(`fill: ${Colors.red[50]}`);
       expect(circles[1]).toHaveStyle(`fill: ${Colors.red[50]}`);
     });
   });