Fixing circular references Issue & Some Enhancement

[Jatin24062005]

Fixes #3178

Changes:
Created a function safeStringify() that traverses the message before printing it.

It checks each key-value pair and replaces circular references with a "[Circular Reference]" message in JSON.

Added try-catch blocks for better error handling.
I have verified that this pull request:

• has no linting errors (npm run lint)
• has no test errors (npm run test)
• is from a uniquely-named feature branch and is up to date with the develop branch.
• is descriptively named and links to an issue number, i.e. Fixes #123

[dipamsen]

I think this issue requires more discussion. In particular, is the only way forward is to not render logs having circular objects? I think this is rather limiting for the console, which is often used for debugging objects. All of p5 objects are also circular in nature.

I am pretty sure that earlier it was possible to log such objects. Don't know if at that time redux was being used or not.

I think we should first explore the feasibility of bringing back the old behaviour (being able to log circular objects).

[Jatin24062005]

I've gone through the Immer documentation, and there's no issue related to Redux here. The problem was that the console feed was consoling the holding messages of redux directly which causing recurrence and stack overflow instead passing refernce of the same object. For your concern about logging circular objects, I used JSON.parse and JSON.stringify for serialization, and everything is working well. The PR is good to go

[dipamsen]

The problem was that the console feed was consoling the holding messages of redux directly which causing recurrence and stack overflow instead passing refernce of the same object.

The issue which caused the Maximum call stack exceeded error, was that Immer (used internally by Redux) does not support serializing such recursive structures. See Immer.js documentation on the same ("Immer only supports unidirectional trees").

For your concern about logging circular objects, I used JSON.parse and JSON.stringify for serialization, and everything is working well.

Sorry, I somewhat misunderstood what the code was doing. According to my re-reading of the code, it seems to take any nested objects which is a reference to one of the parents, and replaces with a string message.

However, what I meant was that ideally on logging an infinitely recursive object, one could expect a (virtually) infinite object rendered on the console which can be navigated throughout (the data staying intact, without anything being replaced). See this comment for an example for how that may work.

So, I maintain my position that more discussion/exploration is needed for this issue.

[Jatin24062005]

@dipamsen hey i found a solution in which i will try to pass the same object recursively without causing maximum stack error rather than replacing with string 'Circular reference '. I was pretty busy in some other issue i will fix it by tomorrow.

[Jatin24062005]

Hey @dipamsen Thank you so much for you Review's and your suggestion it helps me very much i fixed all the required fixes as you can see


Now the i passed the object recursively as you want rather than a string '[Circular Reference]' also without causing maximum stack overflow error. it is a good experience to tackle problem challenges. is there is anything you would like tell me and thank you again. : )

[dipamsen]

This is a good solution. While not actually infinite, having a maximum depth of 10 should work for practical purposes. I am not sure if there are any other considerations to be taken into account (eg. Performance).

I will let the maintainers continue this discussion.