Issue: Group Members Not Staying Within Bounds After Parent Resize and Collapse/Expand

Issue: Group Members Not Staying Within Bounds After Parent Resize and Collapse/Expand

Problem Description

I’m working with GoJS groups that contain multiple member nodes. We have a specific use case where:

  1. A group contains 3-4 child nodes
  2. When the user drags this child node upward (increasing the group’s height), the group size increases
  3. Subsequently, when we collapse and then expand the group, the child nodes remain at their original absolute positions
  4. This causes child nodes to appear outside the group boundaries after expansion
  5. The group only corrects itself when the user hovers over it again

Group Node Template Formation

Current Configuration

We’re using the following group properties:

// Applied via go.Binding
new go.Binding("computesBoundsAfterDrag", "", function(node) {
    return node.isGroup;
});

new go.Binding("computesBoundsIncludingLocation", "", function(node) {
    return node.isGroup;
});

We also have a custom ResizingTool that handles group resizing:

class CustomResizingTool extends go.ResizingTool {
    resize(newr) {
        const part = this.adornedObject.part;
        if (!part) return;
        
        // Custom resize logic with buffer calculations
        super.resize(newr);
    }
    
    computeMinSize() {
        const base = super.computeMinSize();
        const ao = this.adornedObject;
        const part = ao && ao.part;
        
        if (!(part instanceof go.Group)) return base;
        
        // Calculate min size based on placeholder/memberBounds
        const ph = part.placeholder;
        let bounds = ph?.actualBounds || part.memberBounds;
        // ... padding calculations
        
        return new go.Size(minW, minH);
    }
}

Expected Behavior

After collapsing and expanding a resized group, child nodes should:

  • Maintain their relative positions within the group
  • Stay within the group’s visible boundaries
  • Not require a hover event to trigger repositioning

Additional Context

  • We’re using a compositional template system where groups are built from nested templates
  • The group uses a Placeholder for member positioning
  • We have custom dragging tools (GuidedDraggingTool) that may interact with the resize behavior
  • The issue specifically manifests during the expand operation after a resize

Additional Technical Details (if needed)

  • Group template uses a 'Spot' panel type
  • We have a placeholder template for member positioning
  • The resize is triggered by dragging a specific child node (acting as a handle)
  • The computesBoundsAfterDrag property is set to true for groups
  • We’re dispatching custom events during drag operations

Issue:

Screen Recording 2025-12-11 at 12.47.43 PM

First, I should say that those first two bindings don’t make any sense at all. Group.computesBoundsAfterDrag and computesBoundsIncludingLocation are properties that are only defined on the Group class, so it makes completely no sense to declare such bindings. You know where you are adding such a Binding – on a Node you cannot set those properties, and on a Group, you apparently just want to set the property to true. So don’t bother with those bindings and just set those properties to true, if that is what you really want.

Second, I suppose there’s no harm in checking whether ResizingTool.adornedObject is non-null, and that its GraphObject.part is non-null, but there’s no point in overriding ResizingTool.resize to check that and then otherwise do the standard behavior. So that override is pointless.

Third, the override of ResizingTool.computeMinSize is suspicious. What are you really trying to accomplish? If you remove that override, does everything work normally?

By definition, a Placeholder will occupy the union of the areas of its member Parts plus some padding. How is the group being expanded? What custom events are you dispatching, and how?