Read XML content along with unsaved changes

I am trying to read the XML content upon a event trigerred under menu:action using saveXML function but it returns only the saved contents, but in my usecase I want to pass unsaved contents of XML as well to the backend service, how to achieve it?

function LayoutAction(eventBus, editorActions, bpmnjs) {
eventBus.on(“menu:action”, function (action) {
if (action === “performBPMNLayout”) {

performBPMNLayout: function () {
// Replace with your backend service call logic
console.log(“Triggering backend service…”);
bpmnjs.saveXML(function (err, xml) {
if (!err) {

LayoutAction.$inject = [“eventBus”, “editorActions”, “bpmnjs”];

module.exports = LayoutAction;

@barmac @Martin @nikku could u help me here?

Technically you could hook up to the saveXML.serialized event.

Hmm after I read your thread again, I am not sure if my answer makes sense. Could you explain your use case?

Okay so usually when I inject bpmnjs and call the savexml function it returns the saved xml content of the bpmn diagram, lets say I have added a shape to the diagram but i haven’t saved it, now when i again make a call to the savexml function content being returned is not getting changed as the shape i added wasn’t saved, I need to figure out a way to pass the entire cotntent of xml along with the unsaved (in this case the shape added) to a function that applies layouting using ELK and returns back the reformatted daigram, so I am looking for a function or hook which does that, will the serialized version of savexml help me here @barmac ?

In short looking for a function to read entire content of xml with unsaved changes of the bpmn diagram being worked on and perform some operations on it and save back the content

Not sure what you’re referring to by unsaved changes. Every time you call saveXML you’ll get the state of the diagram at that point in time including all changes you’ve made. Can you elaborate?

In the above diagram u can see that i have added a node with a label newly added node but when I call the save.xml function using a menu plugin it throws me some xml content as shown but it doesn’t have the node i added recently as the diagram wasn’t saved manually after adding the shape, do u get my point now ?

@philippfromme @barmac please do help me here

but in the xml tab i can spot it, i want this to be returned as part of the savexml function

is there any update here @philippfromme @barmac ?

What is that you want to achieve and what do you have so far? I can’t really tell from the screenshots what your intention is.

Okay let me keep it to basic, I am trying to use bpmnjs.saveXML to get the current XML contents of the bpmn file which is opened, now the xml which is being returned by the function doesn’t include the unsaved changes of my bpmn diagram.

Now let me elaborate what is unsaved here, in the screenshot I shared above u can see that I have added a node with a label “newly added node” (these changes aren’t saved to the disk yet) , this was added on top to the existing diagram (already saved before) . Now after adding the diagram I listen to the shape.added event and try to log the xml contents of the file using bpmnjs.saveXML function, I expected this function to return the entire xml content including the xml code for the node which I added recently (the one with the label “newly added node”). But I see the XML being logged has just the xml code for the existing diagram but not the xml code for the newly added node.

Currently I am using bpmnjs.saveXML in my code as shared above

shape.added might be too early to retrieve updated contents. I’d suggest to trigger saveXML only after elements.changed event was dispatched.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.