Diagram does not have key "historyList"

[Hans-Georg Haberl]

Hi,

I am trying to do this:
https://ej2.syncfusion.com/angular/documentation/diagram/undo-redo#undo-and-redo
Unfortunately this doesn't work because there is no "historyList"

there is however a historymanager with a push method which does not work as expected...
undo doesn't revert the value as expected... (updated all npm packages to the latest version to make sure)

let node = this.m_diagram.selectedItems.nodes![0];

               

this.m_diagram.historyManager.push!({ undoObject: node });

(node.data as any).processLinkInstanceId = that.m_processSelection.value();

                this.m_diagram.dataBind();

[Balasubramanian Manikandan]

Hans,

Could you please confirm for us? Did you intend to push the diagram elements into the historyList and to perform custom undo/redo action? Alternatively, would you like to perform actions like startGroupAction and endGroupAction to undo the overall actions? Please provide more details to validate your issue further.

[Hans-Georg Haberl]

Yes, i want functioning Undo/Redo with within node.data...
So lets say node.data = "123", the new value will be "456" ==> when press undo it should be 123, pressing redo it should be 456 again

I also tried something like this...
Optimally i would only put the changed data values in there...

this.m_diagram.historyManager.push!({ undoObject: cleanNode, redoObject: cleanNode2 });

Thank you for any help you can give me

This should also work with startGroupAction (if it doesn't work without it would not be a problem since i can always add start/endGroupAction), in my tests start/endGroupAction doesn't change anything though

[Balasubramanian Manikandan]

We will validate the issue and update with more details on 27^th, July 2023.

[Balasubramanian Manikandan]

We need some more to validate your requirement, we will validate and update with more details on 31st, July 2023.

[Balasubramanian Manikandan]

Hans,

The historyManager feature allows you to store your custom data effectively. We have replaced the property "historyList" with "historyManager." Our documentation will be updated to reflect this change in the future. We have provided a sample that demonstrates how to use the history manager to handle "addInfo," "fill," and "strokeColor" properties. These data can be stored and removed using the history manager, enabling you to perform undo and redo operations for custom data. For more details and a visual demonstration, please refer to the sample and video recording below. 

Sample

https://stackblitz.com/edit/duuspv-2k1bmd?file=index.js

Regards,

Balasubramanian M

Attachment: HistoryManager_ee61881.zip

[Hans-Georg Haberl]

Ok so I updated the stackblitz for what i need, the data field is not working with objects, only with values it seems
https://stackblitz.com/edit/duuspv-syob8c?file=index.js

So Undo still works, but Redo is broken --> seems to be a bug to me

[Gobinath Dhamotharan]

Hi,  

The issue is replicated at our end. We will validate and update you with more details on Aug 10, 2023. 

Regards,  

Gobinath   

[Gobinath Dhamotharan]

Hi,

We analyzed your code and noticed that the addInfo property is currently assigned as a string. In the diagram, it should be represented as an object. Refer the code-snippet and sample below. 

Code-snippet

diagram.nodes[0].addInfo = { customvalue: 'customvalue' };

Sample

https://stackblitz.com/edit/duuspv-8rbquo?file=index.js

Regards, 

Gobinath 

[Hans-Georg Haberl]

https://stackblitz.com/edit/duuspv-syob8c?file=index.js

In this case the addinfo will be set to: { testvalue: 0, testvalue2: 1 }
With every subsequent click we do testvalue+1 and testvalue2+2

So what i expect:
AddEntry ==> {"testvalue":0,"testvalue2":1}

AddEntry ==> {"testvalue":1,"testvalue2":3}

AddEntry ==> {"testvalue":2,"testvalue2":5}

Undo ==> {"testvalue":1,"testvalue2":3}

Undo ==>  {"testvalue":0,"testvalue2":1}

Undo ==> undefined

Redo ==> {"testvalue":0,"testvalue2":1}

Redo  ==> {"testvalue":1,"testvalue2":3}

Redo  ==> {"testvalue":2,"testvalue2":5}

[Gobinath Dhamotharan]

Hi,

We will validate and update you with more details on August 16, 2023. 

Regards,  

Gobinath

[Gobinath Dhamotharan]

Hi,

We need some more time to validate your issue and update you with more details on August 18,2023.

Regards,

Gobinath

[Gobinath Dhamotharan]

Hi,

Reported Issue : Custom Undo Redo entry not working properly in diagram

We can reproduce the issue and confirmed this as a defect. We have logged a defect report for this issue. We will fix this issue and provide the patch on September 05th 2023 weekly patch release.  

https://www.syncfusion.com/feedback/46233/custom-undo-redo-entry-not-working-properly-in-diagram

Disclaimer: Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.

Regards,  

Gobinath  

[Gobinath Dhamotharan]

Hi,

After further analysis about reported issue in diagram, we have determined that implementing undo and redo functionality for custom entries is not feasible with diagram and its element built-in properties. You can perform the undo and redo of the custom properties changes by adding
custom entry to the historyManager and set the custom undo/redo entries to the original element in the historyManager’s undo and redo method. For your scenario, you can establish a new property for the node and subsequently incorporate custom entries. Refer the sample below.

Sample

https://stackblitz.com/edit/duuspv-dvmqvu?file=index.js

Regards,  

Gobinath

[Hans-Georg Haberl]

Will try asap, would be nice if the documentation would reflect this as well... 
I hope it is possible to group external (custom) entries and built in elements so it will work for us.
Too bad this BUG will not be fixed...

[Balasubramanian Manikandan]

Query	Solution
Will try asap, would be nice if the documentation would reflect this as well...	We will update documentation on custom undo/redo functionality in the Volume 3 Service Pack 1 (SP1) release
I hope it is possible to group external (custom) entries and built in elements so it will work for us.	Could you please provide more detailed information about your requirements? Your mention of 'built-in elements' is not entirely clear to us. Once we have a better understanding of your needs, we can proceed with further validation.
Too bad this BUG will not be fixed...	After further validation, we determined that custom external entries should be managed at the application level. Therefore, we have implemented a solution at the application level to address this.

[Hans-Georg Haberl]

I am trying to apply this to our project... 
Problem ist the diagram implementation is already quite complex.
For some reason it seams that the historyManager gets replaced at some point so if i set the undo method, this implementation will vanish...
Any hints on why this could happen, what methods/events could do this?

[Gobinath Dhamotharan]

Hi,

Every external entry is indeed retained within the history manager without impacting or modifying the internal entries. During an undo operation, the diagram's undo method is triggered, and within this method, it verifies the existence of external entries. For external entries, it is necessary to manage the undo logic at the application level. Importantly, the external undo method does not overwrite or replace entries within the history manager. Furthermore, we store undo values in the redo stack at the application level, and similar steps are applied when handling the redo method. Refer the video below.

Code-snippet

//After clicking the undo it cheks for external entries and return back to the below custom undo code

document.getElementById('undo').onclick = function () {

  diagram.undo();

  alert(JSON.stringify(diagram.nodes[0].customName));

};

 

//Custom undo

diagram.historyManager.undo = function (args) {

  args.redoObject = args.undoObject;

  if (args.previous && args.previous.undoObject) {

    diagram.nodes[0].customName = args.previous.undoObject;

  } else {

    diagram.nodes[0].customName = undefined;

  }

};

 

 

Sample

https://stackblitz.com/edit/duuspv-dvmqvu?file=index.js

Note: We will include this sample in ej2 documentation ASAP.

Regards,  

Gobinath

Attachment: History_list_video_5d83b16f.zip

[Hans-Georg Haberl]

To use the "External" Entries, startGroupAction and endGroupAction must also be compatible.

Right now grouping action only works for non external entries.

Please fix this, it would be truly a horror to have to implement the history completely from scratch because of this
Also the fix should not be to complicated, I looked at your code and it seems it just needs another "case" inside the gorup action

Edit: I temporarily upgraded to 22.2.12 to make sure this has not been fixed since we updated last time...

[Gobinath Dhamotharan]

Hi,

We will validate and update you with more details on September 19, 2023.

Regards,

Gobinath

[Gobinath Dhamotharan]

Hi,  

Reported Issue : Need to consider custom entries in start and end group action

We can reproduce the issue and confirmed this as a defect. We have logged a defect report for this issue. We will fix this issue and provide the patch on October 10, 2023 weekly patch release.  

https://www.syncfusion.com/feedback/46996/need-to-consider-custom-entries-in-start-and-end-group-action

Disclaimer: Inclusion of this solution in the weekly release may change due to other factors including but not limited to QA checks and works reprioritization.

Regards,  

Gobinath

[Sivaranjith Jeyabalan]

Hi,

We have fixed the reported issue and included it in our latest patch release which is rolled out successfully.

Please upgrade to the latest version packages of the diagram to resolve this issue.  

https://www.npmjs.com/package/@syncfusion/ej2-diagrams 

Regards,

Sivaranjith.

[Hans-Georg Haberl]

I actually sent the link to the wrong documentation, we are not using angular but the normal ej2 javascript implementation, where the documentation is still broken

https://ej2.syncfusion.com/javascript/documentation/diagram/undo-redo

[Hans-Georg Haberl]

Second problem is that the historyManager.undo and redo callbacks are never called...
maybe because they are part of a group? how do i apply my external changes during undo/redo when they are within startGroupAction/endGroupAction?

[Gobinath Dhamotharan]

Hi,

We have provided a reference sample for your convenience. This sample encompasses both external and non-external entries in the startgroup and endgroup actions. The startgroup action notifies the diagram to commence grouping changes, while the endgroup action signifies the conclusion of the grouping process. Refer the sample and video for your reference.

Documentation

https://ej2.syncfusion.com/javascript/documentation/diagram/undo-redo#group-multiple-changes

Sample

Vrb2t7 (forked) - StackBlitz

Attachment: Undo_redo_11b55220.zip