import { expect, test, vi } from 'vitest'; import { fireEvent, render, screen } from '@testing-library/react'; import drugs from '../src/constants/mock_data'; import React from 'react'; import routes from '../src/constants/routes'; import DrugFrom from '../src/components/Shared/DrugForm'; import axios from 'axios'; import Drug from '../src/interfaces/Drug'; const mockedUseNavigate = vi.fn(() => { return (path: string) => { return routes[path]; }; }); vi.mock('react-router-dom', async () => { const mod = await vi.importActual( 'react-router-dom' ); return { ...mod, useNavigate: () => mockedUseNavigate }; }); vi.mock('react-redux', async () => { const mod = await vi.importActual( 'react-redux' ); return { ...mod, useDispatch: () => vi.fn() }; }); test('DrugForm renders correctly - Empty', () => { render(); expect(screen.getByTitle('Name')).toBeTruthy(); expect(screen.getByTitle('Stock')).toBeTruthy(); expect(screen.getByTitle('Price')).toBeTruthy(); expect( screen.getByTitle('Name').getElementsByTagName('input')[0].value ).not.toBeTruthy(); expect(screen.getByTitle('Stock').getElementsByTagName('input')[0].value).eq( '0' ); expect(screen.getByTitle('Price').getElementsByTagName('input')[0].value).eq( '0' ); }); test('DrugForm renders correctly - Update', () => { render(); expect(screen.getByTitle('Name')).toBeTruthy(); expect(screen.getByTitle('Stock')).toBeTruthy(); expect(screen.getByTitle('Price')).toBeTruthy(); expect(screen.getByTitle('Name').getElementsByTagName('input')[0].value).eq( drugs[0].name ); expect(screen.getByTitle('Stock').getElementsByTagName('input')[0].value).eq( drugs[0].stock.toString() ); expect(screen.getByTitle('Price').getElementsByTagName('input')[0].value).eq( drugs[0].price.toString() ); }); test('DrugForm renders correctly - Create', () => { render(); expect(drugs.length).eq(16); fireEvent.change(screen.getByTitle('Name').getElementsByTagName('input')[0], { target: { value: 'Test' } }); fireEvent.change( screen.getByTitle('Stock').getElementsByTagName('input')[0], { target: { value: '10' } } ); fireEvent.change( screen.getByTitle('Price').getElementsByTagName('input')[0], { target: { value: '100' } } ); fireEvent.change( screen.getByTitle('Manufacturer').getElementsByTagName('input')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Description').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Side Effects').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Interactions').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Dosage').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Contraindications').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Warnings').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Storage').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Pregnancy').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Breastfeeding').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); fireEvent.change( screen.getByTitle('Overdose').getElementsByTagName('textarea')[0], { target: { value: 'Test' } } ); vi.spyOn(axios, 'post').mockImplementation((url: string, data?: unknown) => { drugs.push(data as Drug); return Promise.resolve({ data: data }); }); fireEvent.click(screen.getByText('Submit')); expect(drugs.length).eq(17); expect(drugs[16].name).eq('Test'); }); test('DrugForm renders correctly - Update', () => { render(); expect(screen.getByTitle('Name')).toBeTruthy(); expect(screen.getByTitle('Stock')).toBeTruthy(); expect(screen.getByTitle('Price')).toBeTruthy(); expect(screen.getByTitle('Name').getElementsByTagName('input')[0].value).eq( drugs[0].name ); fireEvent.change(screen.getByTitle('Name').getElementsByTagName('input')[0], { target: { value: 'cox' } }); vi.spyOn(axios, 'put').mockImplementation((url: string, data?: unknown) => { const index = drugs.findIndex((d) => d.id === (data as Drug).id); drugs[index] = data as Drug; return Promise.resolve({ data: data }); }); fireEvent.click(screen.getByText('Submit')); expect(drugs[0].name).eq('cox'); });