test: add test for empty option

dhis2 · Dec 17, 2024 · 0c73ad6 · 0c73ad6
1 parent b850a5d
commit 0c73ad6
Showing 1 changed file with 40 additions and 59 deletions.
diff --git a/src/components/metadataFormControls/ModelSingleSelect/ModelSingleSelect.test.tsx b/src/components/metadataFormControls/ModelSingleSelect/ModelSingleSelect.test.tsx
@@ -2,8 +2,9 @@
 import { render, fireEvent, waitFor } from '@testing-library/react'
 import React from 'react'
 import { ComponentWithProvider } from '../../../testUtils/TestComponentWithRouter'
+import { PlainResourceQuery } from '../../../types'
 import { ModelSingleSelect } from './ModelSingleSelect'
-import { PlainResourceQuery, ResultQuery } from '../../../types'
+
 const categoryCombos = [
     {
         displayName: 'Births',
@@ -152,66 +153,43 @@ describe('<CategoryComboSelect />', () => {
         // expect(noneOption).toBeInTheDocument()
     })
 
-    // it('should add an "empty" option when not required', async () => {
-    //     const onChange = jest.fn()
-    //     const dataResolvers = {
-    //         categoryCombos: categoryCombosResolver,
-    //     }
-
-    //     const result = render(
-    //         <ComponentWithProvider dataForCustomProvider={dataResolvers}>
-    //             <CategoryComboSelect onChange={onChange} />
-    //         </ComponentWithProvider>
-    //     )
-
-    //     const selectInput = result.getByTestId('dhis2-uicore-select-input')
-    //     fireEvent.click(selectInput)
-
-    //     const noneLabel = await result.findByText('None', {
-    //         selector: '[data-test="dhis2-uicore-singleselectoption"]',
-    //     })
-    //     const selectedLabel = await result.findByText(/No value/, {
-    //         selector: '[data-test="dhis2-uicore-singleselectoption"]',
-    //     })
-
-    //     expect(noneLabel).toBeInTheDocument()
-    //     expect(selectedLabel).toBeInTheDocument()
-    //     // We'd find a single option if we didn't wait for this. The test would
-    //     // subsequently fail as there'd be exactly one categoryCombo option
-    //     await waitFor(() => {
-    //         const allOptions = result.getAllByTestId(
-    //             'dhis2-uicore-singleselectoption'
-    //         )
-
-    //         expect(allOptions).toHaveLength(categoryCombos.length + 2)
-    //     })
-    // })
+    it('should add an "empty" option when showNoValueOption is true', async () => {
+        const onChange = jest.fn()
+        const dataResolvers = {
+            categoryCombos: categoryCombosResolver,
+        }
 
-    // it('should not add an "empty" option when not required', async () => {
-    //     const onChange = jest.fn()
-    //     const dataResolvers = {
-    //         categoryCombos: categoryCombosResolver,
-    //     }
+        const result = render(
+            <ComponentWithProvider dataForCustomProvider={dataResolvers}>
+                <ModelSingleSelect
+                    onChange={onChange}
+                    query={{ resource: 'categoryCombos' }}
+                    showNoValueOption
+                    selected={categoryCombos[0]}
+                />
+            </ComponentWithProvider>
+        )
 
-    //     const result = render(
-    //         <ComponentWithProvider dataForCustomProvider={dataResolvers}>
-    //             <CategoryComboSelect required onChange={onChange} />
-    //         </ComponentWithProvider>
-    //     )
+        const selectInput = result.getByTestId('dhis2-uicore-select-input')
+        fireEvent.click(selectInput)
 
-    //     const selectInput = result.getByTestId('dhis2-uicore-select-input')
-    //     fireEvent.click(selectInput)
+        await waitFor(() => {
+            const allOptions = result.getAllByTestId(
+                'dhis2-uicore-singleselectoption'
+            )
+            expect(allOptions[0]).toHaveTextContent('No value')
+        })
 
-    //     // We'd find a single option if we didn't wait for this. The test would
-    //     // subsequently fail as there'd be exactly one categoryCombo option
-    //     await waitFor(() => {
-    //         const allOptions = result.getAllByTestId(
-    //             'dhis2-uicore-singleselectoption'
-    //         )
+        const noValueOption = await result.findByText(/No value/, {
+            selector: '[data-test="dhis2-uicore-singleselectoption"]',
+        })
+        fireEvent.click(noValueOption)
 
-    //         expect(allOptions).toHaveLength(categoryCombos.length + 1)
-    //     })
-    // })
+        await waitFor(() => {
+            expect(onChange).toHaveBeenCalledTimes(1)
+            expect(onChange).toHaveBeenCalledWith(undefined)
+        })
+    })
 
     it('should display the selected option, even when not loaded', async () => {
         const onChange = jest.fn()
@@ -233,9 +211,12 @@ describe('<CategoryComboSelect />', () => {
             </ComponentWithProvider>
         )
 
-        const selectedLabel = await result.findByText(selectedNotInData.displayName, {
-            selector: '.root',
-        })
+        const selectedLabel = await result.findByText(
+            selectedNotInData.displayName,
+            {
+                selector: '.root',
+            }
+        )
         expect(selectedLabel).toBeTruthy()
     })