beforeSubmit 'value' is undefined error after removing neighboring text input

[chloelangston]

Are you submitting a bug report or a feature request?

Bug report. Though this error is coming from React Final Form, my application uses React Final Form through React Admin.

What is the current behavior?

I am unable to save a page after removing a text input from an array and seeing the error in the console, Uncaught TypeError: Cannot read properties of undefined (reading 'value') at Object.beforeSubmit react-final-form.cjs.js:555. This seems to happen inconsistently as at times I'm able to remove the element above it successfully. I created a test page with very minimal data to demo the issue in the video below.

What is the expected behavior?

I would expect if I had been able to save the data upon creation, it should not give me an error when I remove a different item in the array.

Sandbox Link

In this CodeSandbox, I was able to recreate a similar error sanitizeEmptyValues.js:18 Uncaught TypeError: Cannot read properties of undefined (reading 'url') Steps to recreate:

• Click into the first post and into the Miscellaneous tab
• Create a few backlinks some with dates and urls, some blank
• Remove one of the items that has a url, not one of the ones that's blank
• You should see this error in the console
• If not, try adding and removing a few more times, it seems inconsistent

What's your environment?

🏁 Final Form version: 4.20.2 Browser: Chrome

Error details in react-final-form.cjs.js

[jadefisher]

I saw the same issue using <FieldArray> also. I fixed/worked-around it by removing the format and formatOnBlur attributes for an Input <Field .../> inside the array.

[metju312]

I had the same problem. Instruction above works.

Any update?

[dimireme]

Faced the same issue and solve it by adding key property while use field.map.