errorMap can be undefined when using setFieldMeta updater function after a pushFieldValue

[Ganbin]

Describe the bug

I have an array field that can be populated dynamically based on some code.

I use the helpful form.pushFieldValue followed by a form.setFieldMeta in order to tell the form that those fields are touched and dirty.

Something like that:

form.pushFieldValue('people', { name: 'person1', age: 18 });
form.setFieldMeta('people[0].name', (prev) => ({
  ...prev,
  isDirty: true,
  isTouched: true,
}));
form.pushFieldValue('people', { name: 'person2', age: 20 });
form.setFieldMeta('people[1].name', (prev) => ({
  ...prev,
  isDirty: true,
  isTouched: true,
}));

When doing so, I have an runtime error when I submit my form :

FieldApi.ts:1382 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'onChange') at validateFieldFn (FieldApi.ts:1382:30)

After debuggin i realized that the updater of the setFieldMeta doesn't always have the errorMap property defined.

I have found a workaround by doing something like that:

(prev) => ({
  ...prev,
  errorMap: prev?.errorMap || {},
  isDirty: true,
  isTouched: true,
}),

But of course this gives me some TS errors because it consider that errorMap is defined and that the ? and || are not needed. And it definitely feels more like a "hack-around"

Your minimal, reproducible example

https://stackblitz.com/edit/tanstack-form-xuuktcwd?file=src%2Findex.tsx

Steps to reproduce

1. Go to the given stackblitz.
2. open the console.
3. Click the Add People button.
4. Submit the form.
5. See the console error.

Expected behavior

As a user I expect that I can set the fieldMeta or directly when pushing the data with pushFieldValue or directly after with setFieldMeta.

This is important because the fields are populated by data from the user and it must be set a touched and dirty else other mechanism could override those values.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: MacOS
• Brave Browser
• Version: 1.1.0

TanStack Form adapter

react-form

TanStack Form version

1.1.0

TypeScript version

5.7.0

Additional context

No response

[Ganbin]

I just see #1323 and the #1324 PR that seems to be related and will surely fix this bug too.

[juanvilladev]

@Ganbin confirmed this will be resolved in my PR.

Here you can see it's working now using the preview deployment that has my latest commit:

https://stackblitz.com/edit/tanstack-form-ggbtkafu?file=package.json