fix(form-core): 🐛 File input field - Picking a different file does not trigger rerender (deep equality issue with File/Blob objects)

packages/form-core/src/FormApi.ts

@@ -2249,6 +2249,7 @@ export class FormApi<
     const dontUpdateMeta = opts?.dontUpdateMeta ?? false
     const dontRunListeners = opts?.dontRunListeners ?? false
     const dontValidate = opts?.dontValidate ?? false
+    const isFile = updater instanceof File
 
     batch(() => {
       if (!dontUpdateMeta) {
@@ -2267,7 +2268,11 @@ export class FormApi<
       this.baseStore.setState((prev) => {
         return {
           ...prev,
-          values: setBy(prev.values, field, updater),
+          values: setBy(
+            prev.values,
+            field,
+            isFile ? { file: updater, uuid: uuid() } : updater,
+          ),
         }
       })
     })

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

@@ -4096,6 +4096,37 @@ it('should generate a formId if not provided', () => {
   expect(form.formId.length).toBeGreaterThan(1)
 })
 
+it('it should set a file value with uuid when setting a field value with File', () => {
+  const form = new FormApi({
+    defaultValues: {
+      avatar: undefined,
+    } as { avatar: unknown },
+  })
+
+  form.mount()
+
+  const firstFile = new File(['first'], 'first.png', { type: 'image/png' })
+  form.setFieldValue('avatar', firstFile)
+
+  const firstValue = form.state.values.avatar as { file: File; uuid: string }
+
+  expect(firstValue).toBeDefined()
+  expect(firstValue.file instanceof File).toBe(true)
+  expect(firstValue.file.name).toBe('first.png')
+  expect(typeof firstValue.uuid).toBe('string')
+  expect(firstValue.uuid.length > 0).toBe(true)
+
+  const secondFile = new File(['second'], 'second.png', { type: 'image/png' })
+  form.setFieldValue('avatar', secondFile)
+
+  const secondValue = form.state.values.avatar as { file: File; uuid: string }
+
+  expect(secondValue.file.name).toBe('second.png')
+  expect(typeof secondValue.uuid).toBe('string')
+  expect(secondValue.uuid.length > 0).toBe(true)
+  expect(secondValue.uuid).not.toBe(firstValue.uuid)
+})
+
 describe('form api event client', () => {
   it('should have debug disabled', () => {
     const logSpy = vi.spyOn(console, 'log').mockImplementation(() => {})