#20 added more tests

src/test/notificationButton.test.tsx

@@ -0,0 +1,78 @@
+/* eslint-disable no-promise-executor-return */
+/* eslint-disable @typescript-eslint/ban-ts-comment */
+/* eslint-disable global-require */
+import { cleanup, fireEvent, render } from '@testing-library/react';
+import { Timestamp } from 'firebase/firestore';
+import React, { useState } from 'react';
+import { BrowserRouter } from 'react-router-dom';
+import NotificationButton from '../components/layout/NotificationsButton';
+import { UserProvider } from '../context/UserContext';
+
+const mockData = {
+  notifications: [
+    {
+      title: 'notification title',
+      message: 'notification message',
+      date: new Timestamp(1648792293, 0),
+      read: false,
+    },
+  ],
+};
+
+jest.mock('firebase/compat/app', () => {
+  // mock Firestore
+  const Firestore = () => ({
+    collection: () => ({
+      where: () => ({
+        onSnapshot: () => mockData,
+        where: () => ({
+          onSnapshot: () => null,
+        }),
+      }),
+      doc: () => ({
+        get: () => ({
+          then: () => null,
+        }),
+      }),
+      onSnapshot: () => ({
+        data: () => mockData,
+      }),
+    }),
+    // to mock attributes
+    FieldValue: {
+      serverTimestamp: jest.fn(),
+    },
+
+  });
+
+  const firestore = Firestore;
+
+  const app = jest.requireActual('firebase/compat/app');
+
+  const auth = () => ({
+    onAuthStateChanged: () => {
+      jest.fn();
+    },
+  });
+  auth.GoogleAuthProvider = jest.fn();
+  auth.signInWithEmailAndPassword = jest.fn();
+  return {
+    __esModule: true,
+    ...app,
+    default: {
+      auth,
+      initializeApp: jest.fn(),
+      firestore,
+    },
+  };
+});
+
+jest.mock('firebase/firestore');
+
+afterEach(cleanup);
+
+test('Medical View Default User Greeting', () => {
+  const component = render(<BrowserRouter><UserProvider><NotificationButton /></UserProvider></BrowserRouter>);
+  const notificationsButton = component.getAllByRole('button');
+  expect(notificationsButton).toBeTruthy();
+});

src/test/patientInfoList.test.tsx

@@ -0,0 +1,81 @@
+import { cleanup, render } from '@testing-library/react';
+import React from 'react';
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import PateintInfoList from '../components/dashboard/MedicalView/PatientInfo/PatientInfoList';
+
+test('PateintInfoList is rendering title', () => {
+  const component = render(
+    <BrowserRouter>
+      <PateintInfoList listTitle="List Title" listItems={undefined} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('List Title')).toBeTruthy();
+});
+
+test('PateintInfoList is rendering primary element in list', () => {
+  const items = [{
+    primary: 'primary element',
+    secondary: '',
+  }];
+  const component = render(
+    <BrowserRouter>
+      <PateintInfoList listTitle="List Title" listItems={items} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('primary element')).toBeTruthy();
+});
+
+test('PateintInfoList is rendering secondary element in list', () => {
+  const items = [{
+    primary: '',
+    secondary: 'secondary element',
+  }];
+  const component = render(
+    <BrowserRouter>
+      <PateintInfoList listTitle="List Title" listItems={items} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('secondary element')).toBeTruthy();
+});
+
+test('PateintInfoList is rendering primary and secondary element in list', () => {
+  const items = [{
+    primary: 'primary element',
+    secondary: 'secondary element',
+  }];
+  const component = render(
+    <BrowserRouter>
+      <PateintInfoList listTitle="List Title" listItems={items} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('primary element')).toBeTruthy();
+  expect(component.getByText('secondary element')).toBeTruthy();
+});
+
+test('PateintInfoList is rendering multiple elements in list', () => {
+  const items = [
+    {
+      primary: 'primary element1',
+      secondary: 'secondary element1',
+    },
+    {
+      primary: 'primary element2',
+      secondary: 'secondary element2',
+    },
+    {
+      primary: 'primary element3',
+      secondary: 'secondary element3',
+    },
+  ];
+  const component = render(
+    <BrowserRouter>
+      <PateintInfoList listTitle="List Title" listItems={items} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('primary element1')).toBeTruthy();
+  expect(component.getByText('primary element2')).toBeTruthy();
+  expect(component.getByText('primary element3')).toBeTruthy();
+  expect(component.getByText('secondary element1')).toBeTruthy();
+  expect(component.getByText('secondary element2')).toBeTruthy();
+  expect(component.getByText('secondary element3')).toBeTruthy();
+});

src/test/patientTimeline.test.tsx

@@ -0,0 +1,79 @@
+import { cleanup, render } from '@testing-library/react';
+import React from 'react';
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import { Timestamp } from 'firebase/firestore';
+import { format } from 'date-fns';
+import PateintTimeline from '../components/dashboard/MedicalView/PatientInfo/PatientTimeline';
+
+test('PateintTimeLine is rendering date and time', () => {
+  const events = [
+    {
+      date: new Timestamp(1648788807, 0),
+      eventsList: [],
+    },
+  ];
+  const expected = format(events[0].date.toDate(), 'yyyy-LL-dd KK:mm:ss a');
+  const component = render(
+    <BrowserRouter>
+      <PateintTimeline events={events} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText(expected)).toBeTruthy();
+});
+
+test('PateintTimeLine is rendering a single event text', () => {
+  const events = [
+    {
+      date: new Timestamp(1648788807, 0),
+      eventsList: ['some event'],
+    },
+  ];
+  const component = render(
+    <BrowserRouter>
+      <PateintTimeline events={events} />
+    </BrowserRouter>,
+  );
+  expect(component.getByText('some event')).toBeTruthy();
+});
+
+test('PateintTimeLine is rendering a multiple events text', () => {
+  const events = [
+    {
+      date: new Timestamp(1648788807, 0),
+      eventsList: ['some event1', 'another event2', 'a third event3'],
+    },
+  ];
+  const component = render(
+    <BrowserRouter>
+      <PateintTimeline events={events} />
+    </BrowserRouter>,
+  );
+  events[0].eventsList.forEach((item) => expect(component.getByText(item)).toBeTruthy());
+});
+
+test('PateintTimeLine is rendering a multiple events', () => {
+  const events = [
+    {
+      date: new Timestamp(1648788807, 0),
+      eventsList: ['some event1', 'another event1', 'a third event1'],
+    },
+    {
+      date: new Timestamp(486584100, 0),
+      eventsList: ['some event2', 'another event2', 'a third event2'],
+    },
+    {
+      date: new Timestamp(648788807, 0),
+      eventsList: ['some event3', 'another event3', 'a third event3'],
+    },
+  ];
+  const component = render(
+    <BrowserRouter>
+      <PateintTimeline events={events} />
+    </BrowserRouter>,
+  );
+  events.forEach((event) => {
+    const expected = format(event.date.toDate(), 'yyyy-LL-dd KK:mm:ss a');
+    expect(component.getByText(expected)).toBeTruthy();
+    event.eventsList.forEach((item) => expect(component.getByText(item)).toBeTruthy());
+  });
+});