formio / angular

JSON powered forms for Angular
https://formio.github.io/angular-demo
MIT License
619 stars 464 forks source link

Converting circular structure to JSON #465

Closed merobal closed 4 years ago

merobal commented 4 years ago

Environment

Please provide as many details as you can:

Steps to Reproduce

https://angular-formio-custom-demo.netlify.com/

  1. Add a Table component.
  2. Add any component. The components will disappear.
  3. Add any component again. This error message will appear in console: Infinite loop detected undefined 500

Expected behavior

No error message, no circular reference.

Observed behavior

Circular reference, error message in console.

I cannot reproduce our issue with the demo app (only the infinite loop), but internally we get this error message:

Uncaught TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    --- property 'component' closes the circle
    at JSON.stringify (<anonymous>)
    at fastCloneDeep (utils.js:1350)
    at TableComponent.get (Component.js:2883)
    at get (<anonymous>)
    at TableComponent.get (NestedComponent.js:730)
    at get (<anonymous>)
    at TableComponent.get (Table.js:85)
    at Webform.js:1783
    at NestedComponent.js:198
    at arrayEach (lodash.js:516)

Example

https://angular-formio-custom-demo.netlify.com/

travist commented 4 years ago

We will add this to our developer list to investigate.

merobal commented 4 years ago

@travist do you have any update on this?

jeriah-formio commented 4 years ago

@merobal Could you try using the latest version of formio.js to see if this resolves the issue?

merobal commented 4 years ago

Still, the same issue using "angular-formio": "4.6.7" I updated the version at the demo site, you can try the repro by following the "Steps to Reproduce" mentioned above...

https://angular-formio-custom-demo.netlify.com/

dmenne commented 4 years ago

As suggested by @merobal, we had to revert to 4.3.3 to get around this. Please have a look.

ullas1989 commented 4 years ago

Getting same issue with angular-formio renderer for existing forms. Any form with data grid and components added into it is giving error: Infinite loop detected undefined 500.

This is causing some other problems with the form:

  1. nextPage() not firing intermittently.
  2. Validations getting triggered automatically after this error.
  3. Browser getting crashed
  4. submission data is getting refreshed automatically

@travist Do you know the last stable version of angular-formio that I can use?

travist commented 4 years ago

We are aware of this as a possible high priority bug. We have our planning sessions Monday and I should know more about when we will see resolution to this after that point.

dmenne commented 4 years ago

With 4.3.3 I have not seen the infinite recursion, but it nevertheless is suspicious that the component is created twice on every call redraw. Might be the source of the issue.

merobal commented 4 years ago

Still having the same issue with "angular-formio": "4.6.10"

travist commented 4 years ago

Thanks for the bump... I will ensure this is added to a developer on our teams list this week, or maybe early next week.

Tkachez commented 4 years ago

@merobal, I've tried to use angular-formio "4.6.10"/"4.6.7" and formiojs "4.5.1", but, unfortunately, was not able to reproduce the issue with disappearing components . Maybe you could give us more details on your environment?

merobal commented 4 years ago

@travist FYI I realized the issue, in this case, was I saved the form to a local model and I passed back to the formio component.

So the fix for my demo is: https://github.com/merobal/angular-formio-custom-demo/commit/1a4a96280637b986997388e05aa2662d71e957fd

FYI https://github.com/formio/angular-formio/issues/509 @ullas1989 FYI https://github.com/formio/angular-formio/issues/507 @dmenne