New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

PropertyFieldCollectionData: Bug with onCustomRender() #135

Closed
spplante opened this Issue Dec 29, 2018 · 1 comment

Comments

Projects
None yet
2 participants
@spplante
Copy link
Contributor

spplante commented Dec 29, 2018

Category

  • Enhancement
  • Bug
  • Question

Version

1.13.1

Expected / Desired Behavior / Question

onCustomRender should only be called once on initial row creation

Observed Behavior

I tried using the onCustomRender function in order to use an AsyncDropdown I created myself which loads it's options async. Everything works perfect on the initial loading of the modal window. I can see my dropdown load and then the options appear correctly. However, as soon as I create another row, I get this really weird behavior where the loading gif starts playing on previously created row (instead of the new one) and then the newly created row gets the value of the previously created row, for the custom field.

To make sure it wasn't my component, I replaced it with the provided example which uses a simple input, and while I don't get the weird loading behavior (which is normal cause it's a simple input) I do get the newly created row with the same value in the custom field as the previously created row, which isn't normal.

When putting a breakpoint in the onCustomRender method, I didn't figure out the pattern yet but it does get called a whole lot of times. When adding a new row, it gets called for all the previous rows (not sure if normal), then it gets called for the newly created row, then it gets called 2-3 times more which sounds odd.

Steps to Reproduce

Use the provided example and add new rows you will see what happens.

{
  id: "customFieldId",
  title: "Custom Field",
  type: CustomCollectionFieldType.custom,
  onCustomRender: (field, value, onUpdate) => {
    return (
      React.createElement("div", null,
        React.createElement("input", { value: value, onChange: (event: React.FormEvent<HTMLInputElement>) => onUpdate(field.id, event.currentTarget.value) }), " 🎉"
      )
    );
  }
}

Thanks!

@spplante

This comment has been minimized.

Copy link
Contributor Author

spplante commented Dec 29, 2018

So I did some debugging and I fixed this in PR #136. The details of the fix can be found in the PR itself.

@spplante spplante closed this Dec 29, 2018

@estruyf estruyf added this to the 1.14.0 milestone Jan 19, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment