DMVP-1066 - Add Tests to Components

src/_components/Loader/Loader.test.js

+import { render, cleanup } from "@testing-library/react";
+// Importing the jest testing library
+import '@testing-library/jest-dom'
+import Loader from "./";
+ 
+// afterEach function runs after each test suite is executed
+afterEach(() => {
+    cleanup(); // Resets the DOM after each test suite
+})
+ 
+describe("Loader Component", () => {
+    const handleOperation = jest.fn();
+
+    test("Modal Rendering", () => {
+        render(
+            <Loader
+                type={'balls'}
+                color={'rgb(44, 121, 206, 0.4)'}
+                className='loader-style'
+                width={'300px'}
+                height={'300px'}
+            />
+        )
+    })
+});

src/_components/controls/modal.jsx

@@ -13,11 +13,10 @@ const ModalForm = ({
 	onClose
 }) => {
 	return (
-		<div className='clinics-form-layout'>
+		<div className='clinics-form-layout' data-testid="modal">
 			<>
 			{
 				isLoading ? (
-					
 						<Spinner
 							thickness='4px'
 							speed='0.65s'
@@ -40,6 +39,7 @@ const ModalForm = ({
 
 							<GridItem rowSpan={1} colSpan={1} textAlign={'center'}>
 								<Button
+									data-testid="no-button"
 									w='180px'
 									h='50px'
 									variant='outline'
@@ -52,6 +52,7 @@ const ModalForm = ({
 							</GridItem>
 							<GridItem rowSpan={1} colSpan={1} textAlign={'center'}>
 								<Button
+									data-testid="yes-button"
 									colorScheme='teal'
 									variant='outline'
 									w='180px'

src/_components/controls/modal.test.js

+
+import { render, screen, cleanup } from "@testing-library/react";
+// Importing the jest testing library
+import '@testing-library/jest-dom'
+import { ModalForm } from "./modal";
+ 
+// afterEach function runs after each test suite is executed
+afterEach(() => {
+    cleanup(); // Resets the DOM after each test suite
+})
+ 
+describe("Modal Component", () => {
+    const handleOperation = jest.fn();
+    const isLoading = false;
+    const onClose = jest.fn();
+    render(
+        <ModalForm
+            handleOperation={handleOperation}
+            onClose={onClose}
+            isLoading={isLoading}
+        />
+    )
+    const modal = screen.getByTestId("modal");
+    const buttonNo = screen.getByTestId("no-button");
+    const buttonYes = screen.getByTestId("yes-button");
+ 
+    test("Modal Rendering", () => {
+        expect(modal).toBeInTheDocument();
+    })
+ 
+    test("Button Text No", () => {
+        expect(buttonNo).toHaveTextContent("No");
+    })
+ 
+    test("Button Text Yes", () => {
+        expect(buttonYes).toHaveTextContent("Yes");
+    })
+})
\ No newline at end of file

src/_components/inputs/InFiniteLoader/InfiniteLoader.test.js

+import { render, cleanup } from "@testing-library/react";
+// Importing the jest testing library
+import '@testing-library/jest-dom'
+import InfiniteLoaderWrapper from "./";
+ 
+// afterEach function runs after each test suite is executed
+afterEach(() => {
+    cleanup(); // Resets the DOM after each test suite
+})
+ 
+describe("InfiniteLoader Component", () => {
+    const handleOperation = jest.fn();
+
+    test("Modal Rendering", () => {
+        render(
+            <InfiniteLoaderWrapper
+                hasNextPage={true}
+                isNextPageLoading={false}
+                items={[]}
+                loadNextPage={handleOperation}
+                wrapperClassName={null}
+                search={''}
+                onChange={handleOperation}
+                onFocus={handleOperation}
+                handleSelect={handleOperation}
+                listOpen={true}
+            />
+        )
+    })
+})

src/_components/inputs/InFiniteLoader/index.jsx

@@ -10,17 +10,16 @@ import {
 } from '@chakra-ui/react';
 
 const InfiniteLoaderWrapper =({
-  hasNextPage,
-  isNextPageLoading,
-  items,
-  loadNextPage,
-  wrapperClassName,
-  fieldname = 'name',
-  search,
-  onChange,
-  onFocus,
-  handleSelect,
-  listOpen
+	hasNextPage,
+	isNextPageLoading,
+	items,
+	loadNextPage,
+	wrapperClassName,
+	search,
+	onChange,
+	onFocus,
+	handleSelect,
+	listOpen
 }) => {
 
 	const itemCount = hasNextPage ? items.length + 1 : items.length;
@@ -29,7 +28,6 @@ const InfiniteLoaderWrapper =({
 	const isItemLoaded = (index) => !hasNextPage || index < items.length;
 
 	const Item = ({ index, style }) => {
-		console.log('index', index);
 		if (!isItemLoaded(index)) {
 			return <li style={style}>Loading...</li>;
 		} else {

src/_components/map/map.test.js

+import { render, cleanup } from "@testing-library/react";
+// Importing the jest testing library
+import '@testing-library/jest-dom'
+import Map from "./map";
+ 
+// afterEach function runs after each test suite is executed
+afterEach(() => {
+	cleanup(); // Resets the DOM after each test suite
+})
+ 
+describe("Loader Component", () => {
+	const handleOperation = jest.fn();
+
+	test("Modal Rendering", () => {
+		render(
+			<Map
+				center={{
+					lat: 55.555,
+					lng: 33.333
+				}}
+				marker={<></>}
+				markers={[]}
+				zoom={11}
+				className={''}
+				onClick={handleOperation}
+				overlay={''}
+				icon={''}
+			/>
+		)
+	})
+});
\ No newline at end of file