Change in within a transaction error debug mode

debug mode Returns a change in within a transaction error. Is this a problem?
I’ve shared node template below

How do I resolve these alerts?

My Node Template:

makeHelperArrow(name: any, align: any, spot: any, output: any, input: any, imageType: any) {
    let horizontal = align.equals(go.Spot.Top) || align.equals(go.Spot.Bottom);
    let alignmentFocus = align.opposite();
    alignmentFocus.offsetX = 0;
    alignmentFocus.offsetY = 0;
    alignmentFocus.x = alignmentFocus.x === 1 || alignmentFocus.x === 0 ? alignmentFocus.x : 0.5;
    alignmentFocus.y = alignmentFocus.y === 1 || alignmentFocus.y === 0 ? alignmentFocus.y : 0.5;
    return goMake(go.Picture, Tools.LinkHelpers[imageType],
        {
            name: name,
            cursor: "copy",
            desiredSize: new go.Size(8, 8),
            alignment: align,
            portId: name,
            fromSpot: spot,
            toSpot: spot,
            toLinkable: false,
            opacity: 0,
            alignmentFocus: alignmentFocus,
            mouseEnter: (e: any, node: any) => {
                if (node.name == "L_H") {
                    this.diagram.toolManager.linkingTool.temporaryLink.fromSpot = go.Spot.LeftSide;
                } else if (node.name == "R_H") {
                    this.diagram.toolManager.linkingTool.temporaryLink.fromSpot = go.Spot.RightSide;
                } else if (node.name == "T_H") {
                    this.diagram.toolManager.linkingTool.temporaryLink.fromSpot = go.Spot.TopSide;
                } else if (node.name == "B_H") {
                    this.diagram.toolManager.linkingTool.temporaryLink.fromSpot = go.Spot.BottomSide;
                }
                let fromLinkable = this.bindNodeFromLinkable(node.part.data);
                node.cursor = fromLinkable ? "copy" : "default";
                let items = ["T_H", "L_H", "R_H", "B_H"];
                node.opacity = fromLinkable ? .8 : 0;
                for (let i = 0; i <= items.length; i++) {
                    if (node.name !== items[i]) {
                        if (node.part.findObject(items[i])) {
                            node.part.findObject(items[i]).opacity = fromLinkable ? .4 : 0;
                        }
                    }
                }
            }
        },
        new go.Binding("visible", "", this.bindNodeFromLinkable.bind(this)),
        new go.Binding("fromLinkable", "", this.bindNodeFromLinkable.bind(this)),
    );
}


makePort(name: string, align: any, spot: any, output: any, input: any, horizontal: any) {
    return goMake(go.Shape,
        {
            fill: "transparent",  // changed to a color in the mouseEnter event handler
            strokeWidth: 0,  // no stroke
            width: horizontal ? NaN : 8,  // if not stretching horizontally, just 8 wide
            height: !horizontal ? NaN : 8,  // if not stretching vertically, just 8 tall
            alignment: align,  // align the port on the main Shape
            stretch: (horizontal ? go.GraphObject.Horizontal : go.GraphObject.Vertical),
            portId: name,  // declare this object to be a "port"
            fromSpot: spot,  // declare where links may connect at this port
            fromLinkable: false,  // declare whether the user may draw links from here
            toSpot: spot,  // declare where links may connect at this port
            fromLinkableSelfNode: false,
            fromLinkableDuplicates: true,
            toLinkableSelfNode: false,
            toLinkableDuplicates: true
        },
        new go.Binding("toLinkable", "typeCode", this.bindNodeToLinkable.bind(this))
    );
}

this.diagram.nodeTemplateMap.add("", goMake(go.Node, "Spot", {
            zOrder: 5,
            locationObjectName: "Shape",
            locationSpot: go.Spot.Center,
            selectionAdornmentTemplate: nodeSelectionAdornmentTemplate,
            selectionObjectName: "Shape",
            resizeObjectName: "Shape",
            rotateObjectName: "Shape",
            resizeAdornmentTemplate: nodeResizeAdornmentTemplate,
            rotatable: true,
            rotateAdornmentTemplate: nodeRotateAdornmentTemplate,
            background: "transparent",
            shadowOffset: new go.Point(0, 0),
            click: (e: go.InputEvent, obj: go.GraphObject) => {
                if (obj && obj.part && obj.part.data && obj.part.data.isLock) {
                    this.diagram.select(obj.part);
                }
            },
            doubleClick: () => {
                this.openPropertyInspector();
            },
            mouseEnter: (e: go.InputEvent, node: go.Node) => {
                let fromLinkable = this.bindNodeFromLinkable(node.data);
                let items = ["T_H", "L_H", "R_H", "B_H"];
                for (let i = 0; i <= items.length; i++) {
                    if (node.part.findObject(items[i])) {
                        node.part.findObject(items[i]).opacity = fromLinkable ? .4 : 0;
                        node.part.findObject(items[i]).opacity = fromLinkable ? e.diagram.findObjectAt(e.documentPoint).portId === items[i] ? .8 : .4 : 0;
                    }
                }
                this.toggleHighlightLinksAndNodes(node.part.data.key, true);
            },
            mouseLeave: (e: go.InputEvent, node: go.Node) => {
                let items = ["T_H", "L_H", "R_H", "B_H"];
                for (let i = 0; i <= items.length; i++) {
                    if (node.part.findObject(items[i])) {
                        node.part.findObject(items[i]).opacity = 0;
                    }
                }
            }
        },
            new go.Binding("location", "location", this.bindShapeLocation).makeTwoWay(),
            new go.Binding("movable", "isLock", (val: boolean) => !val),
            new go.Binding("deletable", "isLock", this.bindIsLock),
            new go.Binding("rotatable", "isLock", this.bindIsLock),
            new go.Binding("resizable", "isLock", this.bindIsLock),
            goMake(go.Panel, "Vertical",
                goMake(go.Panel, "Spot",
                    goMake(go.Panel, "Spot",
                        {
                            shadowVisible: false,
                            name: "Shape"
                        },
                        new go.Binding("desiredSize", "size", this.bindShapeSize).makeTwoWay(),
                        new go.Binding("angle", "angle"),
                        this.getNodeShape()
                    ),
                    this.makePort("T", new go.Spot(0.5, 0, 0, -6), go.Spot.TopSide, false, true, 1),
                    this.makePort("L", new go.Spot(0, 0.5, -6, 0), go.Spot.LeftSide, false, true, 0),
                    this.makePort("R", new go.Spot(1, 0.5, 6, 0), go.Spot.RightSide, false, true, 0),
                    this.makeHelperArrow("T_H", new go.Spot(0.5, 0, 0, -2), go.Spot.TopSide, false, true, "imageTop"),
                    this.makeHelperArrow("L_H", new go.Spot(0, 0.5, -2, 0), go.Spot.LeftSide, true, true, "imageLeft"),
                    this.makeHelperArrow("R_H", new go.Spot(1, 0.5, 2, 0), go.Spot.RightSide, true, true, "imageRight")
                ),
                goMake(go.Panel, "Spot", { margin: new go.Margin(2.5, 0, 0, 0) },
                    goMake(go.Panel, "Auto",
                        goMake(go.Shape, "RoundedRectangle", { fill: "rgba(0, 0, 0, 0.05)", strokeWidth: 0 },
                            new go.Binding("fill", "textBackgroundColor", this.bindShapeTextBackgroundColor),
                        ),
                        goMake(go.TextBlock,
                            {
                                editable: true,
                                verticalAlignment: go.Spot.Center,
                                alignment: go.Spot.Center,
                                margin: new go.Margin(1, 5, 0, 5),
                                background: "transparent"
                            },
                            this.makeTwoWaySubBinding("text", this.props.currentLanguage.culture),
                            new go.Binding("font", "font", this.bindShapeTextFont),
                            new go.Binding("isUnderline", "font", this.bindShapeTextIsUnderline),
                            new go.Binding("stroke", "font", this.bindShapeTextColor)
                        )
                    ),
                    this.makePort("B", new go.Spot(0.5, 1, 0, 4.5), go.Spot.BottomSide, false, true, 1),
                    this.makeHelperArrow("B_H", new go.Spot(0.5, 1, 0, 0.5), go.Spot.BottomSide, true, false, "imageBottom"),
                ),
                goMake(go.Panel, "Spot", { width: 22, height: 10, name: "anglePanel", visible: false },
                    goMake(go.Shape, "RoundedRectangle", {
                        fill: "#fff",
                        stroke: "rgba(0, 0, 0, 0.25)",
                        strokeWidth: 0.5,
                        parameter1: 1
                    }),
                    goMake(go.TextBlock, {
                        height: 4.5,
                        name: "angleText",
                        textAlign: "center",
                        verticalAlignment: go.Spot.Center,
                        stroke: "black",
                        font: "4pt sans-serif"
                    })
                )
            )
        ));

Those are not “alerts” because they are not the result of calling alert. They are just warning messages output to the console.

Obviously the warning message is saying that some changes are occurring that are not during the execution of a transaction. For more information, please read https://gojs.net/latest/intro/transactions.html

What is the user doing to cause those messages? Or if they are due to your code that is running, what is that code doing?