react-final-form-arrays icon indicating copy to clipboard operation
react-final-form-arrays copied to clipboard

Try to move Fields with Conditions not working

Open vyrruss opened this issue 6 years ago • 8 comments

Are you submitting a bug report or a feature request?

Bug report

What is the current behavior?

When I try to Drag and Drop group of Fields with conditions to be displayed or not in a FieldArray, there is an error happening: "Cannot read property 'active' of undefined"

If you try to reproduce it from the sandbox linked below:

  1. Create several customers
  2. Enter on one of them "test" to validate the condition to display the lastName
  3. Try to Drag and Drop a customer with the handler on the left "::"
  4. The error come here 🔴

What is the expected behavior?

The expected behavior is to be able to move Fields that have Conditions Fields inside

Sandbox Link

Edit 🏁 React Final Form - Field Arrays

vyrruss avatar Apr 16 '18 13:04 vyrruss

+1

erickjth avatar May 25 '18 21:05 erickjth

@vyrruss - Did you ever find a solution? I am coming across this same issue in my app, but using ReactDnd.

Somewhere in the docs it mentions Drag and Drop support, however we have two different drag and drop solutions with the same error.

How can I make sure it is safe to call "move" without blowing up my application?

Edit - wrapping the form move in a try {} catch(e) {console.log('Move exploded')} does keep the app from dying, but it feels bad to do that.

311chaos avatar Jul 10 '18 23:07 311chaos

@311chaos Hey I didn't have the time to look for solutions, however I wanted to try an other library for forms and I used on an other project Formik and have no issues with the Drag and Drop to move FieldArray.

vyrruss avatar Jul 11 '18 07:07 vyrruss

I tried to work on it. I found out it's because notifyFieldListeners function doesn't expect field to be undefined. Then publishFieldState is called with an undefined as a second argument and the whole thing crashes.

https://github.com/final-form/final-form/blob/4bf30f058f027db50b4e39e013356f95423bb79b/src/FinalForm.js#L436-L443

Now I need help because I don't know how to write a test that would duplicate the behavior. @erikras any guidance?

maciejmyslinski avatar Sep 16 '18 01:09 maciejmyslinski

just visited the sandbox link of this issue. Updated final-form-arrays from 1.0.4 -> 1.1.0 and react-final-form-arrays 1.0.4 -> 1.1.0 and catch strange bug. link and video below. https://codesandbox.io/s/q30rr3k0m4 screencast 2018-11-15 11-19-12

alex-shatalov avatar Nov 15 '18 08:11 alex-shatalov

@alex-shatalov what is the <Condition /> for ?

HawiCaesar avatar Jan 18 '19 17:01 HawiCaesar

@maciejmyslinski have you come up with something yet ?

HawiCaesar avatar Jan 18 '19 18:01 HawiCaesar

@vyrruss the codesandbox you provided is not working anymore. Could you please fix it?

I'll work on it if I can reproduce it 🙂

maciejmyslinski avatar Jan 28 '19 19:01 maciejmyslinski