test: improve unit testing

Author: jalik

test/useForm.test.ts

@@ -24,7 +24,7 @@ describe('useForm()', () => {
             await result.current.submit()
           })
 
-          expect(result.current.values.username).toBeUndefined()
+          expect(result.current.values.username).toBe(undefined)
         })
       })
 
@@ -196,7 +196,7 @@ describe('useForm()', () => {
         expect(validate).not.toHaveBeenCalled()
         expect(result.current.submitted).toBe(true)
         expect(result.current.submitting).toBe(false)
-        expect(result.current.submitError).toBeUndefined()
+        expect(result.current.submitError).toBe(undefined)
         expect(result.current.submitResult).toMatchObject(initialValues)
       })
     })
@@ -217,10 +217,10 @@ describe('useForm()', () => {
 
       expect(result.current.initialized).toBe(true)
       expect(result.current.modified).toBe(false)
-      expect(result.current.modifiedFields.username).toBeUndefined()
+      expect(result.current.modifiedFields.username).toBe(undefined)
       expect(result.current.touched).toBe(false)
-      expect(result.current.touchedFields.username).toBeUndefined()
-      expect(result.current.values.username).toBeUndefined()
+      expect(result.current.touchedFields.username).toBe(undefined)
+      expect(result.current.values.username).toBe(undefined)
     })
   })
 
@@ -237,7 +237,7 @@ describe('useForm()', () => {
         result.current.clearErrors()
       })
 
-      expect(result.current.errors.username).toBeUndefined()
+      expect(result.current.errors.username).toBe(undefined)
     })
   })
 
@@ -255,7 +255,7 @@ describe('useForm()', () => {
       })
 
       expect(result.current.touched).toBe(false)
-      expect(result.current.touchedFields.username).toBeUndefined()
+      expect(result.current.touchedFields.username).toBe(undefined)
     })
   })
 
@@ -469,7 +469,7 @@ describe('useForm()', () => {
       expect(result.current.initialized).toBe(true)
       expect(result.current.getInitialValue('username')).toBe(initialValues.username)
       expect(result.current.loading).toBe(false)
-      expect(result.current.loadError).toBeUndefined()
+      expect(result.current.loadError).toBe(undefined)
     })
 
     // todo
@@ -508,10 +508,10 @@ describe('useForm()', () => {
         result.current.removeFields(['username'])
       })
 
-      expect(result.current.values.username).toBeUndefined()
-      expect(result.current.errors.username).toBeUndefined()
-      expect(result.current.modifiedFields.username).toBeUndefined()
-      expect(result.current.touchedFields.username).toBeUndefined()
+      expect(result.current.values.username).toBe(null)
+      expect(result.current.errors.username).toBe(undefined)
+      expect(result.current.modifiedFields.username).toBe(undefined)
+      expect(result.current.touchedFields.username).toBe(undefined)
     })
   })
 
@@ -667,7 +667,7 @@ describe('useForm()', () => {
         })
 
         expect(result.current.values.username).toBe('jalik')
-        expect(result.current.values.password).toBeUndefined()
+        expect(result.current.values.password).toBe(undefined)
       })
     })
 
@@ -736,7 +736,7 @@ describe('useForm()', () => {
       expect(onSubmit).toHaveBeenCalledTimes(1)
       expect(result.current.submitted).toBe(true)
       expect(result.current.submitting).toBe(false)
-      expect(result.current.submitError).toBeUndefined()
+      expect(result.current.submitError).toBe(undefined)
       expect(result.current.submitResult).toBe(true)
     })
 
@@ -778,7 +778,7 @@ describe('useForm()', () => {
           await result.current.submit()
         })
 
-        expect(result.current.submitResult).toBeUndefined()
+        expect(result.current.submitResult).toBe(undefined)
         expect(result.current.submitting).toBe(false)
         expect(result.current.submitted).toBe(false)
         expect(result.current.submitError).toBeDefined()
@@ -842,7 +842,7 @@ describe('useForm()', () => {
       expect(result.current.errors.username).toBeDefined()
       expect(result.current.validating).toBe(false)
       expect(result.current.validated).toBe(false)
-      expect(result.current.validateError).toBeUndefined()
+      expect(result.current.validateError).toBe(undefined)
     })
 
     it('should catch error during validation and set form.validateError', async () => {
@@ -881,10 +881,10 @@ describe('useForm()', () => {
       })
 
       expect(validate).toHaveBeenCalledTimes(1)
-      expect(result.current.errors.username).toBeUndefined()
+      expect(result.current.errors.username).toBe(undefined)
       expect(result.current.validating).toBe(false)
       expect(result.current.validated).toBe(true)
-      expect(result.current.validateError).toBeUndefined()
+      expect(result.current.validateError).toBe(undefined)
     })
   })
 

test/useForm/clear.test.ts

@@ -8,16 +8,45 @@ import { act, renderHook } from '@testing-library/react'
 import useForm, { FormMode } from '../../src/useForm'
 
 function tests (mode: FormMode) {
-  it('should clear all values', () => {
-    const hook = renderHook(() => useForm({
-      mode,
-      initialModified: { a: true }
-    }))
-    expect(hook.result.current.isModified()).toBe(true)
+  describe('without arguments', () => {
+    it('should clear all values', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialValues: {
+          a: 1,
+          b: 2
+        }
+      }))
+      expect(hook.result.current.getValue('a')).toBe(1)
+      expect(hook.result.current.getValue('b')).toBe(2)
+      act(() => hook.result.current.clear())
+      expect(hook.result.current.getValues()).toStrictEqual({})
+    })
+  })
 
-    act(() => hook.result.current.clear())
-    expect(hook.result.current.isModified()).toBe(false)
+  describe('with paths', () => {
+    it('should clear values of given paths', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialValues: {
+          a: 1,
+          b: 2,
+          c: 3
+        }
+      }))
+      expect(hook.result.current.getValue('a')).toBe(1)
+      expect(hook.result.current.getValue('b')).toBe(2)
+      expect(hook.result.current.getValue('c')).toBe(3)
+      act(() => hook.result.current.clear(['a', 'c']))
+      expect(hook.result.current.getValue('a')).toBe(null)
+      expect(hook.result.current.getValue('b')).toBe(2)
+      expect(hook.result.current.getValue('c')).toBe(null)
+    })
   })
+
+  // todo check that errors are cleared
+  // todo check that modified states are cleared
+  // todo check that touched states are cleared
 }
 
 describe('useForm({ mode: "controlled" }).clear()', () => {

test/useForm/clearErrors.test.ts

@@ -8,19 +8,34 @@ import { describe, expect, it } from '@jest/globals'
 import { act, renderHook } from '@testing-library/react'
 
 function test (mode: FormMode) {
-  it('should clear errors', () => {
-    const hook = renderHook(() => useForm({
-      mode,
-      initialErrors: {
-        a: 'invalid',
-        b: 'invalid'
-      },
-      onSubmit () {
-        return Promise.resolve(true)
-      }
-    }))
-    act(() => hook.result.current.clearErrors())
-    expect(hook.result.current.errors).toStrictEqual({})
+  describe('without arguments', () => {
+    it('should clear all errors', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialErrors: {
+          a: 'invalid',
+          b: 'invalid'
+        }
+      }))
+      expect(hook.result.current.getError('a')).toBe('invalid')
+      expect(hook.result.current.getError('b')).toBe('invalid')
+      act(() => hook.result.current.clearErrors())
+      expect(hook.result.current.errors).toStrictEqual({})
+    })
+  })
+
+  describe('with paths', () => {
+    it('should clear given errors', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialErrors: {
+          a: 'invalid',
+          b: 'invalid'
+        }
+      }))
+      act(() => hook.result.current.clearErrors())
+      expect(hook.result.current.errors).toStrictEqual({})
+    })
   })
 }
 

test/useForm/clearTouchedFields.test.ts

@@ -8,15 +8,35 @@ import { act, renderHook } from '@testing-library/react'
 import useForm, { FormMode } from '../../src/useForm'
 
 function tests (mode: FormMode) {
-  it('should clear touched fields', () => {
-    const hook = renderHook(() => useForm({
-      mode,
-      initialTouched: { a: true }
-    }))
-    expect(hook.result.current.isTouched()).toBe(true)
+  describe('without arguments', () => {
+    it('should clear all touched fields', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialTouched: { a: true }
+      }))
+      expect(hook.result.current.isTouched('a')).toBe(true)
+      act(() => hook.result.current.clearTouchedFields())
+      expect(hook.result.current.isTouched('a')).toBe(false)
+    })
+  })
 
-    act(() => hook.result.current.clearTouchedFields())
-    expect(hook.result.current.isTouched()).toBe(false)
+  describe('with paths', () => {
+    it('should clear touched fields', () => {
+      const hook = renderHook(() => useForm({
+        mode,
+        initialTouched: {
+          a: true,
+          b: true,
+          c: true
+        }
+      }))
+      expect(hook.result.current.isTouched('a')).toBe(true)
+      expect(hook.result.current.isTouched('b')).toBe(true)
+      act(() => hook.result.current.clearTouchedFields(['a', 'c']))
+      expect(hook.result.current.isTouched('a')).toBe(false)
+      expect(hook.result.current.isTouched('b')).toBe(true)
+      expect(hook.result.current.isTouched('c')).toBe(false)
+    })
   })
 }
 

test/useForm/disabled.test.ts

@@ -0,0 +1,46 @@
+/*
+ * This file is licensed under the MIT License (MIT)
+ * Copyright (c) 2025 Karl STEIN
+ */
+
+import { describe, expect, it } from '@jest/globals'
+import { renderHook } from '@testing-library/react'
+import useForm, { FormMode } from '../../src/useForm'
+
+function test (mode: FormMode) {
+  const initialValues = { a: 1 }
+  it('should return true if options.disabled = true', () => {
+    const hook = renderHook(() => useForm({
+      mode,
+      initialValues,
+      disabled: true
+    }))
+    expect(hook.result.current.disabled).toBe(true)
+  })
+
+  it('should return true if options.disabled = false', () => {
+    const hook = renderHook(() => useForm({
+      mode,
+      initialValues,
+      disabled: false
+    }))
+    expect(hook.result.current.disabled).toBe(false)
+  })
+
+  it('should return true if form is not initialized', () => {
+    const hook = renderHook(() => useForm({
+      mode
+    }))
+    expect(hook.result.current.disabled).toBe(true)
+  })
+
+  // todo test disabled when submitting
+}
+
+describe('useForm({ mode : "controlled" }).disabled', () => {
+  test('controlled')
+})
+
+describe('useForm({ mode: "uncontrolled" }).disabled', () => {
+  test('experimental_uncontrolled')
+})

test/useForm/errors.test.ts

@@ -0,0 +1,30 @@
+/*
+ * This file is licensed under the MIT License (MIT)
+ * Copyright (c) 2025 Karl STEIN
+ */
+
+import { describe, expect, it } from '@jest/globals'
+import { renderHook } from '@testing-library/react'
+import useForm, { FormMode } from '../../src/useForm'
+
+function test (mode: FormMode) {
+  it('should return all errors', () => {
+    const initialErrors = {
+      a: 'invalid',
+      b: 'required'
+    }
+    const hook = renderHook(() => useForm({
+      mode,
+      initialErrors
+    }))
+    expect(hook.result.current.errors).toStrictEqual(initialErrors)
+  })
+}
+
+describe('useForm({ mode : "controlled" }).errors', () => {
+  test('controlled')
+})
+
+describe('useForm({ mode: "uncontrolled" }).errors', () => {
+  test('experimental_uncontrolled')
+})