Adding the basic test file for all components

package.json

@@ -3,9 +3,6 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@testing-library/jest-dom": "^4.2.4",
-    "@testing-library/react": "^9.3.2",
-    "@testing-library/user-event": "^7.1.2",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "react-redux": "^7.1.3",
@@ -19,6 +16,7 @@
     "start": "concurrently \"react-scripts start\"  \"npm run mock-api\"",
     "build": "react-scripts build",
     "test": "react-scripts test",
+    "coverage": "CI=true react-scripts test --coverage",
     "eject": "react-scripts eject",
     "mock-api": "json-server server/data.json --port 3001"
   },
@@ -38,9 +36,30 @@
     ]
   },
   "proxy": "http://localhost:3001/",
+  "jest": {
+    "collectCoverageFrom": [
+      "src/**/*.{js,jsx}",
+      "!/node_modules/",
+      "!src/serviceWorker.js",
+      "!src/components/**/index.js"
+    ],
+    "coverageThreshold": {
+      "global": {
+        "branches": 100,
+        "functions": 100,
+        "lines": 100,
+        "statements": 100
+      }
+    },
+    "coverageReporters": [
+      "text"
+    ]
+  },
   "devDependencies": {
     "concurrently": "^5.1.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
     "json-server": "^0.15.1",
     "node-sass": "^4.13.1"
   }
-}
+}
\ No newline at end of file

src/App/App.spec.js

 import React from 'react';
-import { render } from '@testing-library/react';
+import { shallow, mount } from 'enzyme';
 import App from './App';
 
-test('renders learn react link', () => {
-  const { getByText } = render(<App />);
-  const linkElement = getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});
+describe('App Component', () => {
+
+  const defaultProps = {
+    initCategory: () => { }
+  };
+
+  it('renders without crashing', () => {
+    const wrapper = shallow(<App {...defaultProps} />);
+    expect(wrapper.length === 1).toBe(true);
+    wrapper.unmount();
+  });
+
+});
\ No newline at end of file

src/components/Breadcrumb/Breadcrumb.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import Breadcrumb from './Breadcrumb';
+
+describe('Breadcrumb Component', () => {
+    const defaultProps = {};
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<Breadcrumb {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/components/Footer/Footer.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import Footer from './Footer';
+
+describe('Footer Component', () => {
+    const defaultProps = {};
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<Footer {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/components/Header/Header.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import Header from './Header';
+
+describe('Header Component', () => {
+    const defaultProps = {};
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<Header {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/components/ImageCarousel/ImageCarousel.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import ImageCarousel from './ImageCarousel';
+
+describe('ImageCarousel Component', () => {
+
+    const defaultProps = {};
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<ImageCarousel {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/components/LoadingAnimation/LoadingAnimation.spec.js

 import React from 'react';
-import ReactDOM from 'react-dom';
+import { shallow, mount } from 'enzyme';
 import LoadingAnimation from './LoadingAnimation';
 
-it('renders without crashing', () => {
-  const div = document.createElement('div');
-  ReactDOM.render(<LoadingAnimation />, div);
-  ReactDOM.unmountComponentAtNode(div);
+describe('LoadingAnimation Component', () => {
+
+  const defaultProps = {};
+
+  it('renders without crashing', () => {
+    const wrapper = shallow(<LoadingAnimation {...defaultProps} />);
+    expect(wrapper.length === 1).toBe(true);
+    wrapper.unmount();
+  });
+
 });
\ No newline at end of file

src/components/ModalDialog/ModalDialog.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import ModalDialog from './ModalDialog';
+
+describe('ModalDialog Component', () => {
+
+    const defaultProps = {};
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<ModalDialog {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/pages/PDP/PDP.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import PDPPage from './PDP';
+
+describe('PDPPage Component', () => {
+
+    const defaultProps = { match: { params: {} }, getProductDetails: () => { } };
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<PDPPage {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/pages/PLP/PLP.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import PLPPage from './PLP';
+
+describe('PLPPage Component', () => {
+
+    const defaultProps = { items: [] };
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<PLPPage {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file

src/pages/PLP/ProductItem/ProductItem.spec.js

+import React from 'react';
+import { shallow, mount } from 'enzyme';
+import ProductItem from './ProductItem';
+
+describe('ProductItem Component', () => {
+
+    const defaultProps = { data: { image: {} } };
+
+    it('renders without crashing', () => {
+        const wrapper = shallow(<ProductItem {...defaultProps} />);
+        expect(wrapper.length === 1).toBe(true);
+        wrapper.unmount();
+    });
+
+});
\ No newline at end of file