Merge pull request #60 from codyarose/codyarose

Converted Medications.test.tsx to RTL

src/__tests__/medications/Medications.test.tsx

@@ -1,14 +1,11 @@
-import { act } from '@testing-library/react'
-import { mount, ReactWrapper } from 'enzyme'
+import { render } from '@testing-library/react'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { MemoryRouter } from 'react-router-dom'
 import createMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
 import Medications from '../../medications/Medications'
-import NewMedicationRequest from '../../medications/requests/NewMedicationRequest'
-import ViewMedication from '../../medications/ViewMedication'
 import { TitleProvider } from '../../page-header/title/TitleContext'
 import MedicationRepository from '../../shared/db/MedicationRepository'
 import PatientRepository from '../../shared/db/PatientRepository'
@@ -20,7 +17,7 @@ import { RootState } from '../../shared/store'
 const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Medications', () => {
-  const setup = (route: string, permissions: Array<string>) => {
+  const setup = (route: string, permissions: Permissions[] = []) => {
     jest.resetAllMocks()
     jest.spyOn(MedicationRepository, 'search').mockResolvedValue([])
     jest
@@ -52,7 +49,7 @@ describe('Medications', () => {
       },
     } as any)
 
-    const wrapper = mount(
+    return render(
       <Provider store={store}>
         <MemoryRouter initialEntries={[route]}>
           <TitleProvider>
@@ -61,44 +58,34 @@ describe('Medications', () => {
         </MemoryRouter>
       </Provider>,
     )
-    return wrapper as ReactWrapper
   }
 
   describe('routing', () => {
     describe('/medications/new', () => {
       it('should render the new medication request screen when /medications/new is accessed', () => {
-        const route = '/medications/new'
-        const permissions = [Permissions.RequestMedication]
-        const wrapper = setup(route, permissions)
-        expect(wrapper.find(NewMedicationRequest)).toHaveLength(1)
+        const { container } = setup('/medications/new', [Permissions.RequestMedication])
+
+        expect(container.querySelector('form')).toBeInTheDocument()
       })
 
       it('should not navigate to /medications/new if the user does not have RequestMedication permissions', () => {
-        const route = '/medications/new'
-        const permissions: never[] = []
-        const wrapper = setup(route, permissions)
-        expect(wrapper.find(NewMedicationRequest)).toHaveLength(0)
+        const { container } = setup('/medications/new')
+
+        expect(container.querySelector('form')).not.toBeInTheDocument()
       })
     })
 
     describe('/medications/:id', () => {
       it('should render the view medication screen when /medications/:id is accessed', async () => {
-        const route = '/medications/1234'
-        const permissions = [Permissions.ViewMedication]
-        let wrapper: any
-        await act(async () => {
-          wrapper = setup(route, permissions)
+        const { container } = setup('/medications/1234', [Permissions.ViewMedication])
 
-          expect(wrapper.find(ViewMedication)).toHaveLength(1)
-        })
+        expect(container).toHaveTextContent(/medications.medication.status/i)
       })
 
       it('should not navigate to /medications/:id if the user does not have ViewMedication permissions', async () => {
-        const route = '/medications/1234'
-        const permissions: never[] = []
-        const wrapper = setup(route, permissions)
+        const { container } = setup('/medications/1234')
 
-        expect(wrapper.find(ViewMedication)).toHaveLength(0)
+        expect(container).not.toHaveTextContent(/medications.medication.status/i)
       })
     })
   })