form icon indicating copy to clipboard operation
form copied to clipboard

field.removeValue does not update child's meta correctly

Open Lukas-Kullmann opened this issue 5 years ago • 0 comments

When a field has an array value and an element is removed from this array, the meta information of the "child" fields is not moved correctly.

I have prepared a small code sandbox with a test to showcase the error: https://codesandbox.io/s/stupefied-banach-rp40r

The scenario is as followed:

There is a field array in my form. There are three elements in it:

form.values.array === [{ name: 'value 0' }, { name: 'value 1' }, { name: 'value 2' }]

Once you press a button, all fields are marked as invalid:

form.getFieldMeta('array.0.name').error === '"value 0" is invalid'
form.getFieldMeta('array.1.name').error === '"value 1" is invalid'
form.getFieldMeta('array.2.name').error === '"value 2" is invalid'

When I remove the second element (index 1) from the array

form.removeFieldValue('array', 1)

I would expect that the now second element has the value of the previous third element

form.values.array === [{ name: 'value 0' }, { name: 'value 2' }]

And indeed, it is. But the error information is still the one of the old second element

form.getFieldMeta('array.0.name').error === '"value 0" is invalid'
form.getFieldMeta('array.1.name').error === '"value 1" is invalid' // <-- should be '"value 2" is invalid'

I think it should show the error message of the old third element. The value is also the one from the old third element.

If this is a bit hard to follow, you could also test it in the code sandbox.

Just hit "generate errors" and delete "Element 1".

What I would expect is that it shows

Element 0 - value 0 - "value 0" is invalid
Element 1 - value 2 - "value 2" is invalid

it actually shows

Element 0 - value 0 - "value 0" is invalid
Element 1 - value 2 - "value 1" is invalid

Lukas-Kullmann avatar Jun 19 '20 13:06 Lukas-Kullmann