Skip to content

Commit 441a3ce

Browse files
rahu1rameshrahu1ramesh
committed
BN-71 | Fix. Empty SelectedItem
1 parent eae7df1 commit 441a3ce

File tree

3 files changed

+67
-38
lines changed

3 files changed

+67
-38
lines changed

‎src/components/clinical/diagnosesForm/DiagnosesForm.tsx‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,14 @@ const DiagnosesForm: React.FC<DiagnosesFormProps> = React.memo(
5656
};
5757

5858
const handleOnChange = (selectedItem: ConceptSearch) => {
59+
if (
60+
!selectedItem ||
61+
!selectedItem.conceptUuid ||
62+
!selectedItem.conceptName
63+
) {
64+
return;
65+
}
66+
5967
const isDuplicate = selectedDiagnoses.some(
6068
(diagnosis) => diagnosis.id === selectedItem?.conceptUuid,
6169
);
@@ -93,11 +101,7 @@ const DiagnosesForm: React.FC<DiagnosesFormProps> = React.memo(
93101
]
94102
: searchResults
95103
}
96-
itemToString={(item) =>
97-
item?.conceptName
98-
? item.conceptName
99-
: t('DIAGNOSES_SEARCH_PLACEHOLDER')
100-
}
104+
itemToString={(item) => (item?.conceptName ? item.conceptName : '')}
101105
onChange={(data) => handleOnChange(data.selectedItem!)}
102106
onInputChange={(searchQuery: string) => handleSearch(searchQuery)}
103107
size="lg"

‎src/components/clinical/diagnosesForm/__tests__/DiagnosesForm.test.tsx‎

Lines changed: 33 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
11
import React from 'react';
2-
import {
3-
render,
4-
screen,
5-
waitFor,
6-
fireEvent,
7-
act,
8-
} from '@testing-library/react';
2+
import { render, screen, waitFor, fireEvent } from '@testing-library/react';
93
import userEvent from '@testing-library/user-event';
104
import { useTranslation, I18nextProvider } from 'react-i18next';
115
import DiagnosesForm from '../DiagnosesForm';
@@ -292,7 +286,7 @@ describe('DiagnosesForm', () => {
292286
await userEvent.type(searchInput, 'hyper');
293287

294288
// Attempt to select the same diagnosis
295-
await act(async () => {
289+
await waitFor(async () => {
296290
fireEvent.change(searchInput, {
297291
target: { value: mockConcepts[0].conceptName },
298292
});
@@ -341,6 +335,37 @@ describe('DiagnosesForm', () => {
341335
expect(defaultProps.handleResultSelection).not.toHaveBeenCalled();
342336
});
343337
});
338+
339+
it('should handle invalid item selection without errors', async () => {
340+
render(<DiagnosesForm {...defaultProps} />);
341+
342+
const searchInput = screen.getByPlaceholderText(
343+
'DIAGNOSES_SEARCH_PLACEHOLDER',
344+
);
345+
await userEvent.type(searchInput, 'hyper');
346+
347+
// Simulate selecting an item
348+
fireEvent.change(searchInput, {
349+
target: { value: mockConcepts[0].conceptName },
350+
});
351+
// Get the combobox and dropdown button
352+
const comboBox = screen.getByRole('combobox');
353+
const clearButton = screen.getByRole('button', {
354+
name: 'Clear selected item',
355+
});
356+
const dropdownButton = screen.getByRole('button', { name: 'Close' });
357+
358+
// Simulate selection of invalid item
359+
await waitFor(async () => {
360+
await userEvent.click(clearButton);
361+
await userEvent.click(dropdownButton);
362+
});
363+
364+
// Assertions
365+
expect(comboBox).toHaveValue('');
366+
expect(screen.queryByRole('alert')).not.toBeInTheDocument();
367+
expect(defaultProps.handleResultSelection).not.toHaveBeenCalled();
368+
});
344369
});
345370

346371
describe('Error Handling', () => {

‎src/components/clinical/diagnosesForm/__tests__/__snapshots__/DiagnosesForm.test.tsx.snap‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ exports[`DiagnosesForm Snapshot Tests empty form matches snapshot 1`] = `
2020
<input
2121
aria-activedescendant=""
2222
aria-autocomplete="list"
23-
aria-controls="downshift-«r3r»-menu"
23+
aria-controls="downshift-«r3u»-menu"
2424
aria-expanded="false"
2525
aria-haspopup="listbox"
2626
aria-label="DIAGNOSES_SEARCH_ARIA_LABEL"
@@ -35,11 +35,11 @@ exports[`DiagnosesForm Snapshot Tests empty form matches snapshot 1`] = `
3535
value=""
3636
/>
3737
<button
38-
aria-controls="downshift-«r3r»-menu"
38+
aria-controls="downshift-«r3u»-menu"
3939
aria-expanded="false"
4040
aria-label="Open"
4141
class="cds--list-box__menu-icon"
42-
id="downshift-«r3r»-toggle-button"
42+
id="downshift-«r3u»-toggle-button"
4343
tabindex="-1"
4444
title="Open"
4545
type="button"
@@ -61,9 +61,9 @@ exports[`DiagnosesForm Snapshot Tests empty form matches snapshot 1`] = `
6161
</button>
6262
</div>
6363
<ul
64-
aria-labelledby="downshift-«r3r»-label"
64+
aria-labelledby="downshift-«r3u»-label"
6565
class="cds--list-box__menu"
66-
id="downshift-«r3r»-menu"
66+
id="downshift-«r3u»-menu"
6767
role="listbox"
6868
style="position: fixed; left: 0px; top: 0px; visibility: visible; transform: translate(0px, 0px);"
6969
/>
@@ -93,7 +93,7 @@ exports[`DiagnosesForm Snapshot Tests form with errors matches snapshot 1`] = `
9393
<input
9494
aria-activedescendant=""
9595
aria-autocomplete="list"
96-
aria-controls="downshift-«r4b»-menu"
96+
aria-controls="downshift-«r4e»-menu"
9797
aria-expanded="false"
9898
aria-haspopup="listbox"
9999
aria-label="DIAGNOSES_SEARCH_ARIA_LABEL"
@@ -108,11 +108,11 @@ exports[`DiagnosesForm Snapshot Tests form with errors matches snapshot 1`] = `
108108
value=""
109109
/>
110110
<button
111-
aria-controls="downshift-«r4b»-menu"
111+
aria-controls="downshift-«r4e»-menu"
112112
aria-expanded="false"
113113
aria-label="Open"
114114
class="cds--list-box__menu-icon"
115-
id="downshift-«r4b»-toggle-button"
115+
id="downshift-«r4e»-toggle-button"
116116
tabindex="-1"
117117
title="Open"
118118
type="button"
@@ -134,9 +134,9 @@ exports[`DiagnosesForm Snapshot Tests form with errors matches snapshot 1`] = `
134134
</button>
135135
</div>
136136
<ul
137-
aria-labelledby="downshift-«r4b»-label"
137+
aria-labelledby="downshift-«r4e»-label"
138138
class="cds--list-box__menu"
139-
id="downshift-«r4b»-menu"
139+
id="downshift-«r4e»-menu"
140140
role="listbox"
141141
style="position: fixed; left: 0px; top: 0px; visibility: visible; transform: translate(0px, 0px);"
142142
/>
@@ -230,7 +230,7 @@ exports[`DiagnosesForm Snapshot Tests form with search results matches snapshot
230230
<input
231231
aria-activedescendant=""
232232
aria-autocomplete="list"
233-
aria-controls="downshift-«r3u»-menu"
233+
aria-controls="downshift-«r41»-menu"
234234
aria-expanded="false"
235235
aria-haspopup="listbox"
236236
aria-label="DIAGNOSES_SEARCH_ARIA_LABEL"
@@ -245,11 +245,11 @@ exports[`DiagnosesForm Snapshot Tests form with search results matches snapshot
245245
value=""
246246
/>
247247
<button
248-
aria-controls="downshift-«r3u»-menu"
248+
aria-controls="downshift-«r41»-menu"
249249
aria-expanded="false"
250250
aria-label="Open"
251251
class="cds--list-box__menu-icon"
252-
id="downshift-«r3u»-toggle-button"
252+
id="downshift-«r41»-toggle-button"
253253
tabindex="-1"
254254
title="Open"
255255
type="button"
@@ -271,9 +271,9 @@ exports[`DiagnosesForm Snapshot Tests form with search results matches snapshot
271271
</button>
272272
</div>
273273
<ul
274-
aria-labelledby="downshift-«r3u»-label"
274+
aria-labelledby="downshift-«r41»-label"
275275
class="cds--list-box__menu"
276-
id="downshift-«r3u»-menu"
276+
id="downshift-«r41»-menu"
277277
role="listbox"
278278
style="position: fixed; left: 0px; top: 0px; visibility: visible; transform: translate(0px, 0px);"
279279
/>
@@ -303,7 +303,7 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
303303
<input
304304
aria-activedescendant=""
305305
aria-autocomplete="list"
306-
aria-controls="downshift-«r41»-menu"
306+
aria-controls="downshift-«r44»-menu"
307307
aria-expanded="false"
308308
aria-haspopup="listbox"
309309
aria-label="DIAGNOSES_SEARCH_ARIA_LABEL"
@@ -318,11 +318,11 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
318318
value=""
319319
/>
320320
<button
321-
aria-controls="downshift-«r41»-menu"
321+
aria-controls="downshift-«r44»-menu"
322322
aria-expanded="false"
323323
aria-label="Open"
324324
class="cds--list-box__menu-icon"
325-
id="downshift-«r41»-toggle-button"
325+
id="downshift-«r44»-toggle-button"
326326
tabindex="-1"
327327
title="Open"
328328
type="button"
@@ -344,9 +344,9 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
344344
</button>
345345
</div>
346346
<ul
347-
aria-labelledby="downshift-«r41»-label"
347+
aria-labelledby="downshift-«r44»-label"
348348
class="cds--list-box__menu"
349-
id="downshift-«r41»-menu"
349+
id="downshift-«r44»-menu"
350350
role="listbox"
351351
style="position: fixed; left: 0px; top: 0px; visibility: visible; transform: translate(0px, 0px);"
352352
/>
@@ -394,12 +394,12 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
394394
>
395395
<button
396396
aria-activedescendant=""
397-
aria-controls="downshift-«r44»-menu"
397+
aria-controls="downshift-«r47»-menu"
398398
aria-expanded="false"
399399
aria-haspopup="listbox"
400400
aria-label="DIAGNOSES_CERTAINTY_ARIA_LABEL"
401401
class="cds--list-box__field"
402-
id="downshift-«r44»-toggle-button"
402+
id="downshift-«r47»-toggle-button"
403403
role="combobox"
404404
tabindex="0"
405405
title="Confirmed"
@@ -435,9 +435,9 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
435435
</div>
436436
</button>
437437
<ul
438-
aria-labelledby="downshift-«r44»-label"
438+
aria-labelledby="downshift-«r47»-label"
439439
class="cds--list-box__menu"
440-
id="downshift-«r44»-menu"
440+
id="downshift-«r47»-menu"
441441
role="listbox"
442442
style="position: fixed; left: 0px; top: 0px; visibility: visible; transform: translate(0px, 0px);"
443443
/>
@@ -481,7 +481,7 @@ exports[`DiagnosesForm Snapshot Tests form with selected diagnoses matches snaps
481481
<span
482482
aria-hidden="true"
483483
class="cds--popover"
484-
id="tooltip-«r46»"
484+
id="tooltip-«r49»"
485485
role="tooltip"
486486
>
487487
<span

0 commit comments

Comments
 (0)