test: adding tests for useDyanmicInputs return values

src/useDynamicInputs.ts

@@ -8,8 +8,10 @@ export interface DynamicInputsProps<T = Record<string, unknown>> {
 	emptyData: T
 }
 
+type AddInputHandler<T> = (override?: Partial<T> | ((records: T[]) => Partial<T>)) => void
+
 type DynamicInputsReturn<T = Record<string, unknown>> = {
-	addInput: (override?: (records: T[]) => Partial<T> | T) => void
+	addInput: AddInputHandler<T>
 	removeInput: (i: number) => T
 	paths: string[]
 }
@@ -26,8 +28,8 @@ const useDynamicInputs = <T extends Record<string, unknown>>({ model, emptyData
 
 	inputModel = `${inputModel}.${model || ''}`
 
-	const handleAddInputs = useCallback((override?: (records: T[]) => Partial<T>) => {
-		setData((formData: Record<string, unknown>) => {
+	const handleAddInputs: AddInputHandler<T> = useCallback(override => {
+		setData((formData: T) => {
 			const clone = structuredClone(formData)
 			let node = get(clone, inputModel) as T[]
 
@@ -36,9 +38,11 @@ const useDynamicInputs = <T extends Record<string, unknown>>({ model, emptyData
 				node = get(clone, inputModel) as T[]
 			}
 
-			let merge = {}
+			let merge: Partial<T> = {}
 			if(override instanceof Function) {
 				merge = override(node)
+			} else if(override !== undefined) {
+				merge = override
 			}
 
 			node.push(Object.assign(emptyData, merge))

tests/formComponent.test.tsx

@@ -3,9 +3,10 @@ import { fireEvent, render, screen } from '@testing-library/react'
 import '@testing-library/jest-dom'
 import { Form } from '../src/Form'
 import Input from '../src/Inputs/Input'
-import { DynamicInputs, Submit } from '../src'
+import { DynamicInputs, Submit, useDynamicInputs } from '../src'
 import { router } from '@inertiajs/react'
 import { get } from 'lodash'
+import { act, renderHook } from '@testing-library/react-hooks'
 
 const initialData = {
 	user: {
@@ -74,7 +75,7 @@ describe('Form Component', () => {
 			)
 
 			const button = screen.getByRole('button')
-			await fireEvent.click(button)
+			fireEvent.click(button)
 
 			expect(mockRequest).toHaveBeenCalled()
 		})
@@ -139,7 +140,7 @@ describe('Form Component', () => {
 			)
 
 			const button = screen.getByRole('button')
-			await fireEvent.click(button)
+			fireEvent.click(button)
 
 			expect(mockRequest).toHaveBeenCalled()
 		})
@@ -160,6 +161,33 @@ describe('Form Component', () => {
 
 			expect(buttons.length).toBe(4)
 		})
+
+		it('adds inputs', () => {
+			const formProviderWrapper = ({ children }) => (
+				<Form to="/form" data={ initialData } model="contact" remember={ false }>
+					{ children }
+				</Form>
+			)
+			const { result } = renderHook(() => useDynamicInputs({
+				model: 'phones',
+				emptyData: { number: '' },
+			}), { wrapper: formProviderWrapper })
+
+			// phones: [
+			// 	{ number: '1234567890' },
+			// 	{ number: '2234567890' },
+			// 	{ number: '3234567890' },
+			// ],
+			act(() => {
+				result.current.addInput()
+				result.current.addInput({ number: '1' })
+				result.current.addInput(records => ({
+					number: `${Number(records[0]) + 1}`,
+				}))
+			})
+
+			// Need access to the form data context
+		})
 	})
 
 	describe('Filter', () => {

tests/useInertiaForm.test.ts

@@ -37,12 +37,11 @@ const initialData: InitialData = {
 
 describe('useInertiaForm', () => {
 	const { result } = renderHook(() => useInertiaForm(initialData))
-	const { data } = result.current
 
 	it('data value should be equal to initialData, with undefined values converted to empty strings', () => {
 		const expectedValue = structuredClone(initialData)
 		expectedValue.person.middle_name = ''
-		expect(data).toStrictEqual(expectedValue)
+		expect(result.current.data).toStrictEqual(expectedValue)
 	})
 })