No transaction recorded when deleting a node after fresh load

GoJS
1

It has been noticed that there is no transaction history present when a node is deleted right after a diagram is loaded, without making any other interactions. In this case, in the ModelChanged event, the object property on the event object is null. On the other hand, if the diagram is just loaded and the canvas is slightly moved before going to delete a node - everything looks normal, transaction history is present (so the transaction can be undone) and the object property has a value in the ModelChanged event. The node is being deleted by selecting it and clicking on a close button in the selection adornment of the node. Please advise.

2

In the no transaction history case, is the node deleted before the “InitialLayoutCompleted” DiagramEvent? If so, then the deletion is happening as part of the initial load & layout.

3

I’m unable to reproduce this problem. Here’s my code. What’s different in your situation?

<!DOCTYPE html>
<html>
<head>
  <title>Minimal GoJS Sample</title>
  <!-- Copyright 1998-2025 by Northwoods Software Corporation. -->
</head>
<body>
  <div id="myDiagramDiv" style="border: solid 1px black; width:100%; height:400px"></div>
  <textarea id="mySavedModel" style="width:100%;height:250px"></textarea>

  <script src="https://cdn.jsdelivr.net/npm/gojs/release/go-debug.js"></script>
  <script id="code">
const myDiagram =
  new go.Diagram("myDiagramDiv", {
      "undoManager.isEnabled": true,
      "ModelChanged": e => {     // just for demonstration purposes,
        console.log(e.toString(), e.object);
        if (e.isTransactionFinished) {  // show the model data in the page's TextArea
          document.getElementById("mySavedModel").textContent = e.model.toJson();
        }
      }
    });

myDiagram.nodeTemplate =
  new go.Node("Auto")
    .add(
      new go.Shape({ fill: "white" })
        .bind("fill", "color"),
      new go.TextBlock({ margin: 8 })
        .bind("text"),
       go.GraphObject.build("Button", {
          alignment: go.Spot.TopLeft,
          click: (e, button) => e.diagram.commit(d => {
            d.remove(button.part);
          })
         })
         .add(new go.Shape("XLine", { width: 8, height: 8, stroke: 'red' }))
    );

myDiagram.model = new go.GraphLinksModel(
[
  { key: 1, text: "Alpha", color: "lightblue" },
  { key: 2, text: "Beta", color: "orange" },
  { key: 3, text: "Gamma", color: "lightgreen" },
  { key: 4, text: "Delta", color: "pink" }
],
[
  { from: 1, to: 2 },
  { from: 1, to: 3 },
  { from: 2, to: 2 },
  { from: 3, to: 4 },
  { from: 4, to: 1 }
]);
  </script>
</body>
</html>
4

The node is deleted after the InitialLayoutCompleted event. It is not reproducible for me on every occasion. I refresh the browser, wait for a few seconds, select a node and click the delete button.

5

I’m also using the GoJS Angular module. Not sure if that is a variable that could cause this.

6

Does the sample code that I gave you, above, accurately represent the situation? What additional details are needed to reproduce the problem?