Skip to content
This repository has been archived by the owner on Jan 9, 2023. It is now read-only.

Commit

Permalink
Merge pull request #89 from kcdraidgroup/jacobmgevans
Browse files Browse the repository at this point in the history 
newImagingRequest
  • Loading branch information
@JacobMGEvans
JacobMGEvans committed Dec 25, 2020
2 parents a92fc57 + 01628d3 commit 10b1d48
Show file tree
Hide file tree
Showing 2 changed files with 98 additions and 156 deletions.
3 changes: 2 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,6 +109,7 @@
"lint-staged": "~10.5.0",
"memdown": "~5.1.0",
"prettier": "~2.2.0",
"react-select-event": "~5.1.0",
"redux-mock-store": "~1.5.4",
"rimraf": "~3.0.2",
"source-map-explorer": "^2.2.2",
Expand Down Expand Up @@ -163,4 +164,4 @@
"git add ."
]
}
}
}
251 changes: 96 additions & 155 deletions src/__tests__/imagings/requests/NewImagingRequest.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,17 @@
import { Button, Typeahead, Label } from '@hospitalrun/components'
import { mount, ReactWrapper } from 'enzyme'
import { render, screen } from '@testing-library/react'
import userEvent from '@testing-library/user-event'
import { createMemoryHistory } from 'history'
import React from 'react'
import { act } from 'react-dom/test-utils'
import { Provider } from 'react-redux'
import { Router, Route } from 'react-router-dom'
import selectEvent from 'react-select-event'
import createMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'

import NewImagingRequest from '../../../imagings/requests/NewImagingRequest'
import * as breadcrumbUtil from '../../../page-header/breadcrumbs/useAddBreadcrumbs'
import * as ButtonBarProvider from '../../../page-header/button-toolbar/ButtonBarProvider'
import * as titleUtil from '../../../page-header/title/TitleContext'
import SelectWithLabelFormGroup from '../../../shared/components/input/SelectWithLabelFormGroup'
import TextFieldWithLabelFormGroup from '../../../shared/components/input/TextFieldWithLabelFormGroup'
import TextInputWithLabelFormGroup from '../../../shared/components/input/TextInputWithLabelFormGroup'
import ImagingRepository from '../../../shared/db/ImagingRepository'
import Imaging from '../../../shared/model/Imaging'
import Patient from '../../../shared/model/Patient'
import { RootState } from '../../../shared/store'

const mockStore = createMockStore<RootState, any>([thunk])
Expand All @@ -26,7 +20,7 @@ describe('New Imaging Request', () => {
let history: any
let setButtonToolBarSpy: any

const setup = async () => {
const setup = () => {
jest.resetAllMocks()
jest.spyOn(breadcrumbUtil, 'default')
setButtonToolBarSpy = jest.fn()
Expand All @@ -37,178 +31,125 @@ describe('New Imaging Request', () => {
history.push(`/imaging/new`)
const store = mockStore({} as any)

let wrapper: any
await act(async () => {
wrapper = await mount(
<ButtonBarProvider.ButtonBarProvider>
<Provider store={store}>
<Router history={history}>
<Route path="/imaging/new">
<titleUtil.TitleProvider>
<NewImagingRequest />
</titleUtil.TitleProvider>
</Route>
</Router>
</Provider>
</ButtonBarProvider.ButtonBarProvider>,
)
})
wrapper.find(NewImagingRequest).props().updateTitle = jest.fn()
wrapper.update()
return wrapper as ReactWrapper
return render(
<ButtonBarProvider.ButtonBarProvider>
<Provider store={store}>
<Router history={history}>
<Route path="/imaging/new">
<titleUtil.TitleProvider>
<NewImagingRequest />
</titleUtil.TitleProvider>
</Route>
</Router>
</Provider>
</ButtonBarProvider.ButtonBarProvider>,
)
}

describe('title and breadcrumbs', () => {
it('should have called the useUpdateTitle hook', async () => {
await setup()
expect(titleUtil.useUpdateTitle).toHaveBeenCalledTimes(1)
})
})
// ? Does the TitleComponent/Provider and Breadcrumb have its own tests
// describe('title and breadcrumbs', () => {
// it(' have called the useUpdateTitle hook', async () => {
// await setup()
// expect(titleUtil.useUpdateTitle).toHaveBeenCalledTimes(1)
// })
// })

describe('form layout', () => {
it('should render a patient typeahead', async () => {
const wrapper = await setup()
const typeaheadDiv = wrapper.find('.patient-typeahead')

expect(typeaheadDiv).toBeDefined()

const label = typeaheadDiv.find(Label)
const typeahead = typeaheadDiv.find(Typeahead)
it('Patient input field w/ label', () => {
setup()
const imgPatientInput = screen.getByPlaceholderText(/imagings\.imaging\.patient/i)

expect(label).toBeDefined()
expect(label.prop('text')).toEqual('imagings.imaging.patient')
expect(typeahead).toBeDefined()
expect(typeahead.prop('placeholder')).toEqual('imagings.imaging.patient')
expect(typeahead.prop('searchAccessor')).toEqual('fullName')
})
expect(screen.getAllByText(/imagings\.imaging\.patient/i)[0]).toBeInTheDocument()

it('should render a dropdown list of visits', async () => {
const wrapper = await setup()
const visitsTypeSelect = wrapper.find('.visits').find(SelectWithLabelFormGroup)
expect(visitsTypeSelect).toBeDefined()
expect(visitsTypeSelect.prop('label')).toEqual('patient.visits.label')
expect(visitsTypeSelect.prop('isRequired')).toBeTruthy()
userEvent.type(imgPatientInput, 'Cmdr. Data')
expect(imgPatientInput).toHaveDisplayValue('Cmdr. Data')
})

it('should render a type input box', async () => {
const wrapper = await setup()
const typeInputBox = wrapper.find(TextInputWithLabelFormGroup)

expect(typeInputBox).toBeDefined()
expect(typeInputBox.prop('label')).toEqual('imagings.imaging.type')
expect(typeInputBox.prop('isRequired')).toBeTruthy()
expect(typeInputBox.prop('isEditable')).toBeTruthy()
})
it('Render a dropdown list of visits', async () => {
setup()
const dropdownVisits = screen.getAllByPlaceholderText('-- Choose --')[0]
expect(screen.getByText(/patient\.visits\.label/i)).toBeInTheDocument()
expect(dropdownVisits.getAttribute('aria-expanded')).toBe('false')

it('should render a status types select', async () => {
const wrapper = await setup()
const statusTypesSelect = wrapper.find('.imaging-status').find(SelectWithLabelFormGroup)

expect(statusTypesSelect).toBeDefined()
expect(statusTypesSelect.prop('label')).toEqual('imagings.imaging.status')
expect(statusTypesSelect.prop('isRequired')).toBeTruthy()
expect(statusTypesSelect.prop('isEditable')).toBeTruthy()
expect(statusTypesSelect.prop('options')).toHaveLength(3)
expect(statusTypesSelect.prop('options')[0].label).toEqual('imagings.status.requested')
expect(statusTypesSelect.prop('options')[0].value).toEqual('requested')
expect(statusTypesSelect.prop('options')[1].label).toEqual('imagings.status.completed')
expect(statusTypesSelect.prop('options')[1].value).toEqual('completed')
expect(statusTypesSelect.prop('options')[2].label).toEqual('imagings.status.canceled')
expect(statusTypesSelect.prop('options')[2].value).toEqual('canceled')
selectEvent.openMenu(dropdownVisits)
expect(dropdownVisits).toHaveDisplayValue([''])
expect(dropdownVisits.getAttribute('aria-expanded')).toBe('true')
})

it('should render a notes text field', async () => {
const wrapper = await setup()
const notesTextField = wrapper.find(TextFieldWithLabelFormGroup)
it('Render a image type input box', async () => {
setup()
const imgTypeInput = screen.getByPlaceholderText(/imagings\.imaging\.type/i)
expect(screen.getByLabelText(/imagings\.imaging\.type/i)).toBeInTheDocument()

expect(notesTextField).toBeDefined()
expect(notesTextField.prop('label')).toEqual('imagings.imaging.notes')
expect(notesTextField.prop('isRequired')).toBeFalsy()
expect(notesTextField.prop('isEditable')).toBeTruthy()
userEvent.type(imgTypeInput, 'tricorder imaging')
expect(imgTypeInput).toHaveDisplayValue('tricorder imaging')
})

it('should render a save button', async () => {
const wrapper = await setup()
const saveButton = wrapper.find(Button).at(0)
expect(saveButton).toBeDefined()
expect(saveButton.text().trim()).toEqual('imagings.requests.create')
it('Render a status types select', async () => {
setup()
const dropdownStatusTypes = screen.getAllByPlaceholderText('-- Choose --')[1]
expect(screen.getByText(/patient\.visits\.label/i)).toBeInTheDocument()

expect(dropdownStatusTypes.getAttribute('aria-expanded')).toBe('false')
selectEvent.openMenu(dropdownStatusTypes)
expect(dropdownStatusTypes.getAttribute('aria-expanded')).toBe('true')
expect(dropdownStatusTypes).toHaveDisplayValue(['imagings.status.requested'])

const optionsContent = screen
.getAllByRole('option')
.map((option) => option.lastElementChild?.innerHTML)
expect(
optionsContent.includes(
'imagings.status.requested' && 'imagings.status.completed' && 'imagings.status.canceled',
),
).toBe(true)
})

it('should render a cancel button', async () => {
const wrapper = await setup()
const cancelButton = wrapper.find(Button).at(1)
expect(cancelButton).toBeDefined()
expect(cancelButton.text().trim()).toEqual('actions.cancel')
it('Render a notes text field', async () => {
setup()
const notesInputField = screen.getByRole('textbox', {
name: /imagings\.imaging\.notes/i,
})
expect(screen.getByLabelText(/imagings\.imaging\.notes/i)).toBeInTheDocument()
expect(notesInputField).toBeInTheDocument()
userEvent.type(notesInputField, 'Spot likes nutritional formula 221')
})
})

describe('on cancel', () => {
it('should navigate back to /imaging', async () => {
const wrapper = await setup()
const cancelButton = wrapper.find(Button).at(1)

act(() => {
const onClick = cancelButton.prop('onClick') as any
onClick({} as React.MouseEvent<HTMLButtonElement>)
})
it('Navigate back to /imaging', async () => {
setup()
expect(history.location.pathname).toEqual('/imaging/new')
userEvent.click(
screen.getByRole('button', {
name: /actions\.cancel/i,
}),
)

expect(history.location.pathname).toEqual('/imaging')
})
})

describe('on save', () => {
it('should save the imaging request and navigate to "/imaging"', async () => {
const expectedDate = new Date()
const expectedImaging = {
patient: 'patient',
type: 'expected type',
status: 'requested',
visitId: 'expected visitId',
notes: 'expected notes',
id: '1234',
requestedOn: expectedDate.toISOString(),
} as Imaging

const wrapper = await setup()
jest.spyOn(ImagingRepository, 'save').mockResolvedValue({ ...expectedImaging })

const patientTypeahead = wrapper.find(Typeahead)
await act(async () => {
const onChange = patientTypeahead.prop('onChange')
await onChange([{ fullName: expectedImaging.patient }] as Patient[])
})

const typeInput = wrapper.find(TextInputWithLabelFormGroup)
act(() => {
const onChange = typeInput.prop('onChange') as any
onChange({ currentTarget: { value: expectedImaging.type } })
})

const statusSelect = wrapper.find('.imaging-status').find(SelectWithLabelFormGroup)
act(() => {
const onChange = statusSelect.prop('onChange') as any
onChange({ currentTarget: { value: expectedImaging.status } })
})

const visitsSelect = wrapper.find('.visits').find(SelectWithLabelFormGroup)
act(() => {
const onChange = visitsSelect.prop('onChange') as any
onChange({ currentTarget: { value: expectedImaging.visitId } })
})

const notesTextField = wrapper.find(TextFieldWithLabelFormGroup)
act(() => {
const onChange = notesTextField.prop('onChange') as any
onChange({ currentTarget: { value: expectedImaging.notes } })
})
wrapper.update()

const saveButton = wrapper.find(Button).at(0)
const onClick = saveButton.prop('onClick') as any
expect(saveButton.text().trim()).toEqual('imagings.requests.create')
await act(async () => {
await onClick()
it('Save the imaging request and navigate to "/imaging"', async () => {
setup()
const patient = screen.getByPlaceholderText(/imagings\.imaging\.patient/i)
const imgTypeInput = screen.getByPlaceholderText(/imagings.imaging.type/i)
const notesInputField = screen.getByRole('textbox', {
name: /imagings\.imaging\.notes/i,
})
const dropdownStatusTypes = screen.getAllByPlaceholderText('-- Choose --')[1]
const dropdownVisits = screen.getAllByPlaceholderText('-- Choose --')[0]
userEvent.type(patient, 'Worf')
userEvent.type(imgTypeInput, 'Medical Tricorder')
userEvent.type(notesInputField, 'Batliff')
selectEvent.create(dropdownVisits, 'Med Bay')
selectEvent.select(dropdownStatusTypes, 'imagings.status.requested')
userEvent.click(
screen.getByRole('button', {
name: /imagings\.requests\.create/i,
}),
)

expect(history.location.pathname).toEqual(`/imaging/new`)
})
Expand Down

0 comments on commit 10b1d48

Please sign in to comment.