chore: updated to handel non-primitives

Author: harry-whorlow

packages/form-core/src/FormApi.ts

@@ -1,5 +1,6 @@
 import { Derived, Store, batch } from '@tanstack/store'
 import {
+  deepEqual,
   deleteBy,
   determineFormLevelErrorSourceAndValue,
   functionalUpdate,
@@ -924,9 +925,10 @@ export class FormApi<
           // As primitives, we don't need to aggressively persist the same referential value for performance reasons
           const isFieldValid = !isNonEmptyArray(fieldErrors ?? [])
           const isFieldPristine = !currBaseMeta.isDirty
-          const isDefaultValue =
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            curFieldVal === this.options.defaultValues?.[fieldName as never]
+          const isDefaultValue = deepEqual(
+            curFieldVal,
+            this.options.defaultValues?.[fieldName as never],
+          )
 
           if (
             prevFieldInfo &&

packages/form-core/src/utils.ts

@@ -5,7 +5,7 @@ import type {
   ValidationSource,
 } from './types'
 import type { FormValidators } from './FormApi'
-import type { AnyFieldMeta, FieldValidators } from './FieldApi'
+import type { FieldValidators } from './FieldApi'
 
 export type UpdaterFn<TInput, TOutput = TInput> = (input: TInput) => TOutput
 
@@ -443,3 +443,37 @@ export const determineFieldLevelErrorSourceAndValue = ({
 
   return { newErrorValue: undefined, newSource: undefined }
 }
+
+export const deepEqual = <T>(a: T, b: T): boolean => {
+  // returns primitive equality
+  if (a === b) {
+    return true
+  }
+
+  // checks that props are object and not null
+  if (
+    typeof a !== 'object' ||
+    a === null ||
+    typeof b !== 'object' ||
+    b === null
+  ) {
+    return false
+  }
+
+  // arrays are treated as objects with numeric keys
+  const keysA = Object.keys(a)
+  const keysB = Object.keys(b)
+
+  if (keysA.length !== keysB.length) {
+    return false
+  }
+
+  // recursively calls deepEqual down the object chain
+  for (const key of keysA) {
+    if (!keysB.includes(key) || !deepEqual((a as any)[key], (b as any)[key])) {
+      return false
+    }
+  }
+
+  return true
+}

packages/form-core/tests/FieldApi.spec.ts

@@ -100,29 +100,74 @@ describe('field api', () => {
   })
 
   it('should update the fields meta isDefaultValue', () => {
-    const form = new FormApi({
+    // primitives
+    const primitiveMetaForm = new FormApi({
       defaultValues: {
         name: 'test',
       },
     })
-    form.mount()
+    primitiveMetaForm.mount()
 
-    const field = new FieldApi({
-      form,
+    const primitiveField = new FieldApi({
+      form: primitiveMetaForm,
       name: 'name',
     })
 
-    field.mount()
-    expect(field.getMeta().isDefaultValue).toBe(true)
+    primitiveField.mount()
+    expect(primitiveField.getMeta().isDefaultValue).toBe(true)
 
-    field.setValue('not-test')
-    expect(field.getMeta().isDefaultValue).toBe(false)
+    primitiveField.setValue('not-test')
+    expect(primitiveField.getMeta().isDefaultValue).toBe(false)
 
-    field.setValue('test')
-    expect(field.getMeta().isDefaultValue).toBe(true)
+    primitiveField.setValue('test')
+    expect(primitiveField.getMeta().isDefaultValue).toBe(true)
+
+    primitiveMetaForm.resetField('name')
+    expect(primitiveField.getMeta().isDefaultValue).toBe(true)
+
+    // arrays
+    const arrayMetaForm = new FormApi({
+      defaultValues: {
+        arr: ['', ''],
+      },
+    })
+    arrayMetaForm.mount()
+
+    const arrayField = new FieldApi({
+      form: arrayMetaForm,
+      name: 'arr',
+    })
+
+    arrayField.mount()
+    expect(arrayField.getMeta().isDefaultValue).toBe(true)
+
+    arrayField.setValue(['hello', 'goodbye'])
+    expect(arrayField.getMeta().isDefaultValue).toBe(false)
+
+    arrayField.setValue(['', ''])
+    expect(arrayField.getMeta().isDefaultValue).toBe(true)
+
+    // objects
+    const objectMetaForm = new FormApi({
+      defaultValues: {
+        obj: { firstName: 'John', lastName: 'Wick' },
+      },
+    })
+    objectMetaForm.mount()
+
+    const objectField = new FieldApi({
+      form: objectMetaForm,
+      name: 'obj',
+    })
+
+    objectField.mount()
+    expect(objectField.getMeta().isDefaultValue).toBe(true)
+
+    objectField.setValue({ firstName: 'John', lastName: 'Travolta' })
+    expect(objectField.getMeta().isDefaultValue).toBe(false)
 
-    form.resetField('name')
-    expect(field.getMeta().isDefaultValue).toBe(true)
+    objectField.setValue({ firstName: 'John', lastName: 'Wick' })
+    expect(objectField.getMeta().isDefaultValue).toBe(true)
   })
 
   it('should set a value correctly', () => {

packages/form-core/tests/utils.spec.ts

@@ -1,5 +1,6 @@
 import { describe, expect, it } from 'vitest'
 import {
+  deepEqual,
   deleteBy,
   determineFieldLevelErrorSourceAndValue,
   determineFormLevelErrorSourceAndValue,
@@ -492,3 +493,53 @@ describe('determineFieldLevelErrorSourceAndValue', () => {
     })
   })
 })
+
+describe('deepEqual', () => {
+  it('should test equality between primitives', () => {
+    const numbersTrue = deepEqual(1, 1)
+    expect(numbersTrue).toEqual(true)
+
+    const stringFalse = deepEqual('uh oh', '')
+    expect(stringFalse).toEqual(false)
+
+    const boolTrue = deepEqual(true, true)
+    expect(boolTrue).toEqual(true)
+
+    const nullFalse = deepEqual(null, {})
+    expect(nullFalse).toEqual(false)
+
+    const undefinedFalse = deepEqual(undefined, null)
+    expect(undefinedFalse).toEqual(false)
+  })
+
+  it('should test equality between arrays', () => {
+    const arrayTrue = deepEqual([], [])
+    expect(arrayTrue).toEqual(true)
+
+    const arrayDeepTrue = deepEqual([[1]], [[1]])
+    expect(arrayDeepTrue).toEqual(true)
+
+    const arrayFalse = deepEqual([], [''])
+    expect(arrayFalse).toEqual(false)
+
+    const arrayDeepFalse = deepEqual([[1]], [])
+    expect(arrayDeepFalse).toEqual(false)
+  })
+
+  it('should test equality between objects', () => {
+    const objTrue = deepEqual({ test: 'same' }, { test: 'same' })
+    expect(objTrue).toEqual(true)
+
+    const objFalse = deepEqual({ test: 'not' }, { test: 'same' })
+    expect(objFalse).toEqual(false)
+
+    const objDeepFalse = deepEqual({ test: 'not' }, { test: { test: 'same' } })
+    expect(objDeepFalse).toEqual(false)
+
+    const objDeepArrFalse = deepEqual({ test: [] }, { test: [[]] })
+    expect(objDeepArrFalse).toEqual(false)
+
+    const objNullFalse = deepEqual({ test: '' }, null)
+    expect(objNullFalse).toEqual(false)
+  })
+})