Skip to content

Commit 07bbb35

Browse files
nobraynernobrayner
authored
Merge pull request HospitalRun#266 from codyarose/codyarose_UseInputTestids
Refactoring queries to use testids for inputs where appropriate
2 parents 8d27975 + acafa59 commit 07bbb35

File tree

13 files changed

+161
-159
lines changed

13 files changed

+161
-159
lines changed

‎src/__tests__/imagings/requests/NewImagingRequest.test.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { render, screen } from '@testing-library/react'
1+
import { render, screen, within } from '@testing-library/react'
22
import userEvent from '@testing-library/user-event'
33
import { createMemoryHistory } from 'history'
44
import React from 'react'
@@ -59,7 +59,7 @@ describe('New Imaging Request', () => {
5959

6060
it('Renders a dropdown list of visits', async () => {
6161
setup()
62-
const dropdownVisits = screen.getAllByPlaceholderText('-- Choose --')[0]
62+
const dropdownVisits = within(screen.getByTestId('visitSelect')).getByRole('combobox')
6363
expect(screen.getByText(/patient\.visits\.label/i)).toBeInTheDocument()
6464
expect(dropdownVisits.getAttribute('aria-expanded')).toBe('false')
6565

@@ -70,16 +70,16 @@ describe('New Imaging Request', () => {
7070

7171
it('Renders an image type input box', async () => {
7272
setup()
73-
const imgTypeInput = screen.getByPlaceholderText(/imagings\.imaging\.type/i)
74-
expect(screen.getByLabelText(/imagings\.imaging\.type/i)).toBeInTheDocument()
73+
const imgTypeInput = screen.getByLabelText(/imagings\.imaging\.type/i)
74+
expect(screen.getByText(/imagings\.imaging\.type/i)).toBeInTheDocument()
7575

7676
userEvent.type(imgTypeInput, 'tricorder imaging')
7777
expect(imgTypeInput).toHaveDisplayValue('tricorder imaging')
7878
})
7979

8080
it('Renders a status types select input field', async () => {
8181
setup()
82-
const dropdownStatusTypes = screen.getAllByPlaceholderText('-- Choose --')[1]
82+
const dropdownStatusTypes = within(screen.getByTestId('statusSelect')).getByRole('combobox')
8383
expect(screen.getByText(/patient\.visits\.label/i)).toBeInTheDocument()
8484

8585
expect(dropdownStatusTypes.getAttribute('aria-expanded')).toBe('false')
@@ -127,12 +127,12 @@ describe('New Imaging Request', () => {
127127
expectOneConsoleError({ patient: 'imagings.requests.error.patientRequired' })
128128
setup()
129129
const patient = screen.getByPlaceholderText(/imagings\.imaging\.patient/i)
130-
const imgTypeInput = screen.getByPlaceholderText(/imagings.imaging.type/i)
130+
const imgTypeInput = screen.getByLabelText(/imagings\.imaging\.type/i)
131131
const notesInputField = screen.getByRole('textbox', {
132132
name: /imagings\.imaging\.notes/i,
133133
})
134-
const dropdownStatusTypes = screen.getAllByPlaceholderText('-- Choose --')[1]
135-
const dropdownVisits = screen.getAllByPlaceholderText('-- Choose --')[0]
134+
const dropdownStatusTypes = within(screen.getByTestId('statusSelect')).getByRole('combobox')
135+
const dropdownVisits = within(screen.getByTestId('visitSelect')).getByRole('combobox')
136136
userEvent.type(patient, 'Worf')
137137
userEvent.type(imgTypeInput, 'Medical Tricorder')
138138
userEvent.type(notesInputField, 'Batliff')

‎src/__tests__/incidents/report/ReportIncident.test.tsx

Lines changed: 34 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { render, screen } from '@testing-library/react'
1+
import { render, screen, within } from '@testing-library/react'
22
import userEvent from '@testing-library/user-event'
33
import { createMemoryHistory } from 'history'
44
import React from 'react'
@@ -58,7 +58,7 @@ describe('Report Incident', () => {
5858
}
5959
it('renders a department form element that allows user input', async () => {
6060
setup([Permissions.ViewIncident, Permissions.ResolveIncident])
61-
const departmentInput = await screen.findByPlaceholderText(/incidents\.reports\.department/i)
61+
const departmentInput = screen.getByLabelText(/incidents\.reports\.department/i)
6262

6363
expect(departmentInput).toBeEnabled()
6464
expect(departmentInput).toBeInTheDocument()
@@ -67,9 +67,9 @@ describe('Report Incident', () => {
6767
expect(departmentInput).toHaveDisplayValue('Engineering Bay')
6868
})
6969

70-
test('renders a category form element that allows user input', async () => {
70+
it('renders a category form element that allows user input', async () => {
7171
setup([Permissions.ViewIncident, Permissions.ResolveIncident])
72-
const categoryInput = await screen.findByPlaceholderText(/incidents\.reports\.category\b/i)
72+
const categoryInput = screen.getByLabelText(/incidents\.reports\.category\b/i)
7373

7474
expect(categoryInput).toBeEnabled()
7575
expect(categoryInput).toBeInTheDocument()
@@ -78,11 +78,9 @@ describe('Report Incident', () => {
7878
expect(categoryInput).toHaveDisplayValue('Warp Engine')
7979
})
8080

81-
test('renders a category item form element that allows user input', async () => {
81+
it('renders a category item form element that allows user input', async () => {
8282
setup([Permissions.ViewIncident, Permissions.ResolveIncident])
83-
const categoryItemInput = await screen.findByPlaceholderText(
84-
/incidents\.reports\.categoryitem/i,
85-
)
83+
const categoryItemInput = screen.getByLabelText(/incidents\.reports\.categoryitem/i)
8684

8785
expect(categoryItemInput).toBeInTheDocument()
8886
expect(categoryItemInput).toBeEnabled()
@@ -91,38 +89,38 @@ describe('Report Incident', () => {
9189
expect(categoryItemInput).toHaveDisplayValue('Warp Coil')
9290
})
9391

94-
test('renders a description formField element that allows user input', async () => {
92+
it('renders a description formField element that allows user input', async () => {
9593
setup([Permissions.ViewIncident, Permissions.ResolveIncident])
96-
const inputArr = await screen.findAllByRole('textbox', { name: /required/i })
97-
const descriptionInput = inputArr[inputArr.length - 1]
94+
const descriptionInput = screen.getByLabelText(/incidents\.reports\.description/i)
9895

9996
expect(descriptionInput).toBeInTheDocument()
10097
expect(descriptionInput).toBeEnabled()
10198

10299
userEvent.type(descriptionInput, 'Geordi requested analysis')
103100
expect(descriptionInput).toHaveDisplayValue('Geordi requested analysis')
104101
})
105-
test(' renders action save button after all the input fields are filled out', async () => {
106-
setup([Permissions.ViewIncident, Permissions.ResolveIncident])
107-
const departmentInput = await screen.findByPlaceholderText(/incidents\.reports\.department/i)
108-
const categoryInput = await screen.findByPlaceholderText(/incidents\.reports\.category\b/i)
109-
const categoryItemInput = await screen.findByPlaceholderText(
110-
/incidents\.reports\.categoryitem/i,
111-
)
112-
const inputArr = await screen.findAllByRole('textbox', { name: /required/i })
113-
const descriptionInput = inputArr[inputArr.length - 1]
114102

115-
userEvent.type(departmentInput, 'Engineering Bay')
116-
userEvent.type(categoryInput, 'Warp Engine')
117-
userEvent.type(categoryItemInput, 'Warp Coil')
118-
userEvent.type(descriptionInput, 'Geordi requested analysis')
103+
// ! Remove test? Save button is always rendered regardless of input values
104+
// it(' renders action save button after all the input fields are filled out', async () => {
105+
// setup([Permissions.ViewIncident, Permissions.ResolveIncident])
119106

120-
userEvent.click(
121-
screen.getByRole('button', {
122-
name: /incidents\.reports\.new/i,
123-
}),
124-
)
125-
})
107+
// expect(screen.queryByRole('button', { name: /incidents\.reports\.new/i })).not.toBeInTheDocument()
108+
// const departmentInput = screen.getByLabelText(/incidents\.reports\.department/i)
109+
// const categoryInput = screen.getByLabelText(/incidents\.reports\.category\b/i)
110+
// const categoryItemInput = screen.getByLabelText(/incidents\.reports\.categoryitem/i)
111+
// const descriptionInput = screen.getByLabelText(/incidents\.reports\.description/i)
112+
113+
// userEvent.type(departmentInput, 'Engineering Bay')
114+
// userEvent.type(categoryInput, 'Warp Engine')
115+
// userEvent.type(categoryItemInput, 'Warp Coil')
116+
// userEvent.type(descriptionInput, 'Geordi requested analysis')
117+
118+
// userEvent.click(
119+
// screen.getByRole('button', {
120+
// name: /incidents\.reports\.new/i,
121+
// }),
122+
// )
123+
// })
126124

127125
it('should display errors if validation fails', async () => {
128126
const error = {
@@ -144,14 +142,13 @@ describe('Report Incident', () => {
144142
}),
145143
)
146144

147-
const departmentInput = await screen.findByPlaceholderText(/incidents\.reports\.department/i)
148-
const categoryInput = await screen.findByPlaceholderText(/incidents\.reports\.category\b/i)
149-
const categoryItemInput = await screen.findByPlaceholderText(
150-
/incidents\.reports\.categoryitem/i,
145+
const departmentInput = screen.getByLabelText(/incidents\.reports\.department/i)
146+
const categoryInput = screen.getByLabelText(/incidents\.reports\.category\b/i)
147+
const categoryItemInput = screen.getByLabelText(/incidents\.reports\.categoryitem/i)
148+
const descriptionInput = screen.getByLabelText(/incidents\.reports\.description/i)
149+
const dateInput = within(await screen.findByTestId('dateOfIncidentDateTimePicker')).getByRole(
150+
'textbox',
151151
)
152-
const inputArr = await screen.findAllByRole('textbox')
153-
const descriptionInput = inputArr[inputArr.length - 2]
154-
const dateInput = inputArr[0]
155152

156153
const invalidInputs = container.querySelectorAll('.is-invalid')
157154
expect(invalidInputs).toHaveLength(5)

‎src/__tests__/labs/requests/NewLabRequest.test.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ describe('New Lab Request', () => {
117117
setup()
118118

119119
const selectLabel = screen.getByText(/patient\.visit/i)
120-
const selectInput = screen.getByPlaceholderText('-- Choose --')
120+
const selectInput = within(screen.getByTestId('visitSelect')).getByRole('combobox')
121121

122122
expect(selectInput).toBeInTheDocument()
123123
expect(selectInput).toHaveDisplayValue([''])
@@ -141,7 +141,7 @@ describe('New Lab Request', () => {
141141
const { expectedVisits } = setup()
142142

143143
const patientTypeahead = screen.getByPlaceholderText(/labs.lab.patient/i)
144-
const visitsInput = within(screen.getByTestId('visit-field')).getByRole('combobox')
144+
const visitsInput = within(screen.getByTestId('visitSelect')).getByRole('combobox')
145145
userEvent.type(patientTypeahead, 'Jim Bob')
146146
userEvent.click(await screen.findByText(/Jim Bob/i))
147147
expect(patientTypeahead).toHaveDisplayValue(/Jim Bob/i)
@@ -196,7 +196,7 @@ describe('New Lab Request', () => {
196196

197197
const alert = await screen.findByRole('alert')
198198
const patientInput = screen.getByPlaceholderText(/labs\.lab\.patient/i)
199-
const typeInput = screen.getByPlaceholderText(/labs\.lab\.type/i)
199+
const typeInput = screen.getByLabelText(/labs\.lab\.type/i)
200200

201201
expect(within(alert).getByText(error.message)).toBeInTheDocument()
202202
expect(within(alert).getByText(/states\.error/i)).toBeInTheDocument()
@@ -224,7 +224,7 @@ describe('New Lab Request', () => {
224224
userEvent.type(screen.getByPlaceholderText(/labs.lab.patient/i), 'Jim Bob')
225225
expect(await screen.findByText(/jim bob/i)).toBeVisible()
226226
userEvent.click(screen.getByText(/jim bob/i))
227-
userEvent.type(screen.getByPlaceholderText(/labs\.lab\.type/i), expectedLab.type)
227+
userEvent.type(screen.getByLabelText(/labs\.lab\.type/i), expectedLab.type)
228228
userEvent.type(screen.getByLabelText(/labs\.lab\.notes/i), (expectedLab.notes as string[])[0])
229229
userEvent.click(screen.getByRole('button', { name: /labs\.requests\.new/i }))
230230

‎src/__tests__/medications/requests/NewMedicationRequest.test.tsx

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -48,23 +48,21 @@ describe('New Medication Request', () => {
4848
setup()
4949

5050
expect(screen.getByText(/medications\.medication\.medication/i)).toBeInTheDocument()
51-
expect(
52-
screen.getByPlaceholderText(/medications\.medication\.medication/i),
53-
).toBeInTheDocument()
51+
expect(screen.getByLabelText(/medications\.medication\.medication/i)).toBeInTheDocument()
5452
})
5553

5654
it('render medication request status options', async () => {
5755
setup()
5856

59-
const medStatus = within(screen.getByTestId('status-field')).getByRole('combobox')
57+
const medStatus = within(screen.getByTestId('statusSelect')).getByRole('combobox')
6058

6159
expect(screen.getByText(/medications\.medication\.status/i)).toBeInTheDocument()
6260
expect(medStatus.getAttribute('aria-expanded')).toBe('false')
6361
selectEvent.openMenu(medStatus)
6462
expect(medStatus.getAttribute('aria-expanded')).toBe('true')
6563
expect(medStatus).toHaveDisplayValue(/medications\.status\.draft/i)
6664

67-
const statusOptions = within(screen.getByTestId('status-field'))
65+
const statusOptions = within(screen.getByTestId('statusSelect'))
6866
.getAllByRole('option')
6967
.map((option) => option.lastElementChild?.innerHTML)
7068

@@ -76,15 +74,15 @@ describe('New Medication Request', () => {
7674
it('render medication intent options', async () => {
7775
setup()
7876

79-
const medicationIntent = within(screen.getByTestId('intent-field')).getByRole('combobox')
77+
const medicationIntent = within(screen.getByTestId('intentSelect')).getByRole('combobox')
8078

8179
expect(screen.getByText(/medications\.medication\.intent/i)).toBeInTheDocument()
8280
expect(medicationIntent.getAttribute('aria-expanded')).toBe('false')
8381
selectEvent.openMenu(medicationIntent)
8482
expect(medicationIntent.getAttribute('aria-expanded')).toBe('true')
8583
expect(medicationIntent).toHaveDisplayValue(/medications\.intent\.proposal/i)
8684

87-
const intentOptions = within(screen.getByTestId('intent-field'))
85+
const intentOptions = within(screen.getByTestId('intentSelect'))
8886
.getAllByRole('option')
8987
.map((option) => option.lastElementChild?.innerHTML)
9088

@@ -105,15 +103,15 @@ describe('New Medication Request', () => {
105103
it('render medication priorty select options', async () => {
106104
setup()
107105

108-
const medicationPriority = within(screen.getByTestId('priority-field')).getByRole('combobox')
106+
const medicationPriority = within(screen.getByTestId('prioritySelect')).getByRole('combobox')
109107

110108
expect(screen.getByText(/medications\.medication\.status/i)).toBeInTheDocument()
111109
expect(medicationPriority.getAttribute('aria-expanded')).toBe('false')
112110
selectEvent.openMenu(medicationPriority)
113111
expect(medicationPriority.getAttribute('aria-expanded')).toBe('true')
114112
expect(medicationPriority).toHaveDisplayValue('medications.priority.routine')
115113

116-
const priorityOptions = within(screen.getByTestId('priority-field'))
114+
const priorityOptions = within(screen.getByTestId('prioritySelect'))
117115
.getAllByRole('option')
118116
.map((option) => option.lastElementChild?.innerHTML)
119117

@@ -179,13 +177,13 @@ describe('New Medication Request', () => {
179177
it('should save the medication request and navigate to "/medications/:id"', async () => {
180178
const { history } = setup()
181179
const patient = screen.getByPlaceholderText(/medications\.medication\.patient/i)
182-
const medication = screen.getByPlaceholderText(/medications\.medication\.medication/i)
180+
const medication = screen.getByLabelText(/medications\.medication\.medication/i)
183181
const medicationNotes = screen.getByRole('textbox', {
184182
name: /medications\.medication\.notes/i,
185183
})
186-
const medStatus = screen.getAllByPlaceholderText('-- Choose --')[0]
187-
const medicationIntent = screen.getAllByPlaceholderText('-- Choose --')[1]
188-
const medicationPriority = screen.getAllByPlaceholderText('-- Choose --')[2]
184+
const medStatus = within(screen.getByTestId('statusSelect')).getByRole('combobox')
185+
const medicationIntent = within(screen.getByTestId('intentSelect')).getByRole('combobox')
186+
const medicationPriority = within(screen.getByTestId('prioritySelect')).getByRole('combobox')
189187

190188
userEvent.type(patient, 'Bruce Wayne')
191189
userEvent.type(medication, 'Ibuprofen')

‎src/__tests__/patients/ContactInfo.test.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { screen, render } from '@testing-library/react'
1+
import { screen, render, within } from '@testing-library/react'
22
import userEvent from '@testing-library/user-event'
33
import { createMemoryHistory } from 'history'
44
import React from 'react'
@@ -64,7 +64,7 @@ describe('Contact Info in its Editable mode', () => {
6464

6565
expect(screen.getAllByRole('textbox')[1]).toHaveValue(`${data[0].value}`)
6666

67-
const selectInput = screen.getAllByPlaceholderText('-- Choose --')[0]
67+
const selectInput = within(screen.getByTestId('NumberType0Select')).getByRole('combobox')
6868

6969
expect(selectInput).toHaveValue('patient.contactInfoType.options.home')
7070
})
@@ -157,7 +157,11 @@ describe('Contact Info in its non-Editable mode', () => {
157157
it('should render an empty element if no data is present', () => {
158158
const { container } = setup()
159159

160-
expect(container.querySelectorAll('div').length).toBe(1)
160+
expect(container).toMatchInlineSnapshot(`
161+
<div>
162+
<div />
163+
</div>
164+
`)
161165
})
162166

163167
it('should render the labels if data is provided', () => {
@@ -170,15 +174,15 @@ describe('Contact Info in its non-Editable mode', () => {
170174
setup(data)
171175

172176
const inputElement = screen.getAllByRole('textbox')[1]
173-
const selectInput = screen.getAllByPlaceholderText('-- Choose --')[0]
177+
const selectInput = within(screen.getByTestId('NumberType0Select')).getByRole('combobox')
174178
expect(selectInput).toHaveDisplayValue('patient.contactInfoType.options.home')
175179
expect(inputElement).toHaveDisplayValue(`${data[0].value}`)
176180
})
177181

178182
it('should show inputs that are not editable', () => {
179183
setup(data)
180-
const selectInput = screen.getAllByPlaceholderText('-- Choose --')[0]
181184
const inputElement = screen.getAllByRole('textbox')[1]
185+
const selectInput = within(screen.getByTestId('NumberType0Select')).getByRole('combobox')
182186

183187
expect(selectInput).not.toHaveFocus()
184188
expect(inputElement).not.toHaveFocus()

0 commit comments

Comments
 (0)