update test list item tests

inferno-framework · Jun 26, 2023 · b92fe9a · b92fe9a
1 parent 8ededbd
commit b92fe9a
Show file tree

Hide file tree

Showing 11 changed files with 109 additions and 26 deletions.
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/src/components/TestSuite/TestSuiteDetails/TestGroupCard.tsx b/client/src/components/TestSuite/TestSuiteDetails/TestGroupCard.tsx
@@ -3,7 +3,7 @@ import { Box, Card, Divider, Typography } from '@mui/material';
 import useStyles from './styles';
 import ReactMarkdown from 'react-markdown';
 import { TestGroup, RunnableType, TestSuite } from '~/models/testSuiteModels';
-import InputOutputsList from './TestListItem/InputOutputsList';
+import InputOutputList from './TestListItem/InputOutputList';
 import ResultIcon from './ResultIcon';
 import TestRunButton from '~/components/TestSuite/TestRunButton/TestRunButton';
 import { shouldShowDescription } from '~/components/TestSuite/TestSuiteUtilities';
@@ -68,7 +68,7 @@ const TestGroupCard: FC<TestGroupCardProps> = ({ children, runnable, runTests, v
 
   const renderInputOutputs = () => {
     if ((runnable as TestGroup).user_runnable && runnable.result && runnable.run_as_group) {
-      return <InputOutputsList headerName="Input" inputOutputs={runnable.result?.inputs || []} />;
+      return <InputOutputList headerName="Input" inputOutputs={runnable.result?.inputs || []} />;
     }
   };
 

diff --git a/client/src/components/TestSuite/TestSuiteDetails/TestGroupListItem/TestGroupListItem.tsx b/client/src/components/TestSuite/TestSuiteDetails/TestGroupListItem/TestGroupListItem.tsx
@@ -12,7 +12,7 @@ import {
 } from '@mui/material';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import { Error, Warning } from '@mui/icons-material';
-import InputOutputsList from '../TestListItem/InputOutputsList';
+import InputOutputList from '../TestListItem/InputOutputList';
 import { Request, RunnableType, Test, TestGroup, ViewType } from '~/models/testSuiteModels';
 import ResultIcon from '../ResultIcon';
 import TestRunButton from '../../TestRunButton/TestRunButton';
@@ -187,7 +187,7 @@ const TestGroupListItem: FC<TestGroupListItemProps> = ({
         testGroup.run_as_group &&
         testGroup.user_runnable &&
         testGroup.result && (
-          <InputOutputsList headerName="Input" inputOutputs={testGroup.result?.inputs || []} />
+          <InputOutputList headerName="Input" inputOutputs={testGroup.result?.inputs || []} />
         )}
       <AccordionDetails
         title={groupMouseHover ? '' : `${testGroup.id}-detail`}

diff --git a/...Details/TestListItem/InputOutputsList.tsx → ...eDetails/TestListItem/InputOutputList.tsx b/...Details/TestListItem/InputOutputsList.tsx → ...eDetails/TestListItem/InputOutputList.tsx
@@ -4,13 +4,13 @@ import { Table, TableBody, TableRow, TableCell, Typography, TableHead, Box } fro
 import { TestInput, TestOutput } from '~/models/testSuiteModels';
 import ReactMarkdown from 'react-markdown';
 
-interface InputOutputsListProps {
+interface InputOutputListProps {
   inputOutputs: TestInput[] | TestOutput[];
   noValuesMessage?: string;
   headerName: string;
 }
 
-const InputsOutputsList: FC<InputOutputsListProps> = ({
+const InputOutputList: FC<InputOutputListProps> = ({
   inputOutputs,
   noValuesMessage,
   headerName,
@@ -71,4 +71,4 @@ const InputsOutputsList: FC<InputOutputsListProps> = ({
   return output || <></>;
 };
 
-export default InputsOutputsList;
+export default InputOutputList;
diff --git a/...uiteDetails/TestListItem/MessagesList.tsx → ...SuiteDetails/TestListItem/MessageList.tsx b/...uiteDetails/TestListItem/MessagesList.tsx → ...SuiteDetails/TestListItem/MessageList.tsx
@@ -7,11 +7,11 @@ import ReactMarkdown from 'react-markdown';
 import MessageType from './MessageType';
 import { sortByMessageType } from './helper';
 
-interface MessagesListProps {
+interface MessageListProps {
   messages: Message[];
 }
 
-const MessagesList: FC<MessagesListProps> = ({ messages }) => {
+const MessageList: FC<MessageListProps> = ({ messages }) => {
   const { classes } = useStyles();
 
   const headerTitles = ['Type', 'Message'];
@@ -54,4 +54,4 @@ const MessagesList: FC<MessagesListProps> = ({ messages }) => {
   );
 };
 
-export default MessagesList;
+export default MessageList;
diff --git a/...uiteDetails/TestListItem/RequestsList.tsx → ...SuiteDetails/TestListItem/RequestList.tsx b/...uiteDetails/TestListItem/RequestsList.tsx → ...SuiteDetails/TestListItem/RequestList.tsx
@@ -20,14 +20,14 @@ import useStyles from './styles';
 import { ContentCopy, SaveAlt } from '@mui/icons-material';
 import { useSnackbar } from 'notistack';
 
-interface RequestsListProps {
+interface RequestListProps {
   resultId: string;
   requests: Request[];
   updateRequest: (requestId: string, resultId: string, request: Request) => void;
   view: 'report' | 'run';
 }
 
-const RequestsList: FC<RequestsListProps> = ({ requests, resultId, updateRequest, view }) => {
+const RequestList: FC<RequestListProps> = ({ requests, resultId, updateRequest, view }) => {
   const { classes } = useStyles();
   const { enqueueSnackbar } = useSnackbar();
   const [showDetails, setShowDetails] = React.useState(false);
@@ -217,4 +217,4 @@ const RequestsList: FC<RequestsListProps> = ({ requests, resultId, updateRequest
   );
 };
 
-export default RequestsList;
+export default RequestList;
diff --git a/client/src/components/TestSuite/TestSuiteDetails/TestListItem/TestListItem.tsx b/client/src/components/TestSuite/TestSuiteDetails/TestListItem/TestListItem.tsx
@@ -18,8 +18,8 @@ import Info from '@mui/icons-material/Info';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import ReactMarkdown from 'react-markdown';
 import TestRunButton from '~/components/TestSuite/TestRunButton/TestRunButton';
-import MessagesList from './MessagesList';
-import RequestsList from './RequestsList';
+import MessageList from './MessageList';
+import RequestList from './RequestList';
 import ResultIcon from '../ResultIcon';
 import ProblemBadge from './ProblemBadge';
 import TestRunDetail from './TestRunDetail';
@@ -173,12 +173,12 @@ const TestListItem: FC<TestListItemProps> = ({
     <>
       {messagesExist && (
         <Card sx={requestsExist ? { mb: 2 } : {}}>
-          <MessagesList messages={test.result?.messages || []} />
+          <MessageList messages={test.result?.messages || []} />
         </Card>
       )}
       {updateRequest && requestsExist && (
         <Card>
-          <RequestsList
+          <RequestList
             requests={test.result?.requests || []}
             resultId={test.result?.id || ''}
             updateRequest={updateRequest}

diff --git a/client/src/components/TestSuite/TestSuiteDetails/TestListItem/TestRunDetail.tsx b/client/src/components/TestSuite/TestSuiteDetails/TestListItem/TestRunDetail.tsx
@@ -3,9 +3,9 @@ import { Box, Card, Divider, Tab, Tabs, Tooltip, Typography } from '@mui/materia
 import { Message, Request, Test, TestInput, TestOutput } from '~/models/testSuiteModels';
 import { shouldShowDescription } from '~/components/TestSuite/TestSuiteUtilities';
 import TabPanel from '~/components/TestSuite/TestSuiteDetails/TestListItem/TabPanel';
-import MessagesList from '~/components/TestSuite/TestSuiteDetails/TestListItem/MessagesList';
-import RequestsList from '~/components/TestSuite/TestSuiteDetails/TestListItem/RequestsList';
-import InputOutputsList from '~/components/TestSuite/TestSuiteDetails/TestListItem/InputOutputsList';
+import MessageList from '~/components/TestSuite/TestSuiteDetails/TestListItem/MessageList';
+import RequestList from '~/components/TestSuite/TestSuiteDetails/TestListItem/RequestList';
+import InputOutputList from '~/components/TestSuite/TestSuiteDetails/TestListItem/InputOutputList';
 import lightTheme from '~/styles/theme';
 import useStyles from './styles';
 import ReactMarkdown from 'react-markdown';
@@ -98,11 +98,11 @@ const TestRunDetail: FC<TestRunDetailProps> = ({
       </Tabs>
       <Divider />
       <TabPanel id={test.id} currentTabIndex={currentTabIndex} index={0}>
-        <MessagesList messages={test.result?.messages || []} />
+        <MessageList messages={test.result?.messages || []} />
       </TabPanel>
       <TabPanel id={test.id} currentTabIndex={currentTabIndex} index={1}>
         {updateRequest && (
-          <RequestsList
+          <RequestList
             requests={test.result?.requests || []}
             resultId={test.result?.id || ''}
             updateRequest={updateRequest}
@@ -111,14 +111,14 @@ const TestRunDetail: FC<TestRunDetailProps> = ({
         )}
       </TabPanel>
       <TabPanel id={test.id} currentTabIndex={currentTabIndex} index={2}>
-        <InputOutputsList
+        <InputOutputList
           inputOutputs={test.result?.inputs || []}
           noValuesMessage="No Inputs"
           headerName="Input"
         />
       </TabPanel>
       <TabPanel id={test.id} currentTabIndex={currentTabIndex} index={3}>
-        <InputOutputsList
+        <InputOutputList
           inputOutputs={test.result?.outputs || []}
           noValuesMessage="No Outputs"
           headerName="Output"

diff --git a/...src/components/TestSuite/TestSuiteDetails/TestListItem/__tests__/InputOutputList.test.tsx b/...src/components/TestSuite/TestSuiteDetails/TestListItem/__tests__/InputOutputList.test.tsx
@@ -0,0 +1,49 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { SnackbarProvider } from 'notistack';
+import ThemeProvider from 'components/ThemeProvider';
+
+import { TestInput, TestOutput } from '~/models/testSuiteModels';
+import InputOutputList from '../InputOutputList';
+
+describe('The InputOutputsList component', () => {
+  test('it renders all inputs', () => {
+    const inputs: TestInput[] = [
+      { name: 'one', value: 1 },
+      { name: 'two', value: 2 },
+    ];
+
+    render(
+      <ThemeProvider>
+        <SnackbarProvider>
+          <InputOutputList inputOutputs={inputs} noValuesMessage="No Inputs" headerName="Input" />
+        </SnackbarProvider>
+      </ThemeProvider>
+    );
+
+    const renderedMessages = document.querySelectorAll('tbody > tr');
+    expect(renderedMessages.length).toEqual(inputs.length);
+  });
+
+  test('it renders all outputs', () => {
+    const outputs: TestOutput[] = [
+      { name: 'one', value: '1' },
+      { name: 'two', value: '2' },
+    ];
+
+    render(
+      <ThemeProvider>
+        <SnackbarProvider>
+          <InputOutputList
+            inputOutputs={outputs}
+            noValuesMessage="No Outputs"
+            headerName="Output"
+          />
+        </SnackbarProvider>
+      </ThemeProvider>
+    );
+
+    const renderedMessages = document.querySelectorAll('tbody > tr');
+    expect(renderedMessages.length).toEqual(outputs.length);
+  });
+});
diff --git a/client/src/components/TestSuite/TestSuiteDetails/TestListItem/__tests__/MessageList.test.tsx b/client/src/components/TestSuite/TestSuiteDetails/TestListItem/__tests__/MessageList.test.tsx
@@ -0,0 +1,28 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { SnackbarProvider } from 'notistack';
+import ThemeProvider from 'components/ThemeProvider';
+
+import MessageList from '../MessageList';
+import { Message } from '~/models/testSuiteModels';
+
+describe('The MessagesList component', () => {
+  test('it renders all messages', () => {
+    const messages: Message[] = [
+      { message: 'info', type: 'info' },
+      { message: 'warning', type: 'warning' },
+      { message: 'error', type: 'error' },
+    ];
+
+    render(
+      <ThemeProvider>
+        <SnackbarProvider>
+          <MessageList messages={messages} />
+        </SnackbarProvider>
+      </ThemeProvider>
+    );
+
+    const renderedMessages = document.querySelectorAll('tbody > tr');
+    expect(renderedMessages.length).toEqual(messages.length);
+  });
+});
diff --git a/...tListItem/__tests__/RequestsList.test.tsx → ...stListItem/__tests__/RequestList.test.tsx b/...tListItem/__tests__/RequestsList.test.tsx → ...stListItem/__tests__/RequestList.test.tsx
@@ -3,7 +3,7 @@ import { render } from '@testing-library/react';
 import { SnackbarProvider } from 'notistack';
 import ThemeProvider from 'components/ThemeProvider';
 
-import RequestsList from '../RequestsList';
+import RequestList from '../RequestList';
 import {
   mockedRequest,
   codeResponseWithHTML,
@@ -16,7 +16,7 @@ describe('The RequestsList component', () => {
     render(
       <ThemeProvider>
         <SnackbarProvider>
-          <RequestsList requests={requests} resultId="abc" updateRequest={() => {}} view="run" />
+          <RequestList requests={requests} resultId="abc" updateRequest={() => {}} view="run" />
         </SnackbarProvider>
       </ThemeProvider>
     );