FabricJs - update text inside group not updates group width

by almogKashany

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.4.0/fabric.min.js"></script>
<canvas id="c" width="500" height="500" style="border:1px solid #ccc"></canvas>

JavaScript

var canvas = new fabric.StaticCanvas('c', { renderOnAddRemove: false });

var leftBoxIconWidth = 70;
 var placeholderForIcon = new fabric.Text('ICON', {
            fontSize: 20,
            fontWeight: 400,
            fontFamily: 'Roboto-Medium',
            left: 10,
            top: 20,
            originX: 'left',
            lineHeight: '1',
            width:50,
            height: 30,
            backgroundColor: 'brown'
});  

 var title = new fabric.Text('', {
            fontSize: 20,
            fontWeight: 400,
            fontFamily: 'Roboto-Medium',
            left: leftBoxIconWidth,
            top: 5,
            originX: 'left',
            lineHeight: '1',
});  

 var description = new fabric.Text('', {
            fontSize: 20,
            fontWeight: 400,
            fontFamily: 'Roboto-Medium',
            left: leftBoxIconWidth,
            top: 25,
            originX: 'left',
            lineHeight: '1',
}); 

title.set({text: 'init title'});
description.set({text: 'init description'});

var groupRect = new fabric.Rect({
 left: 0,
 top: 0,
 width: Math.max(title.width, description.width) + leftBoxIconWidth, // 70 is placeholder for icon
 height: 70,
 strokeWidth: 3,
 stroke:'#f44336',
 fill:'#999',
  originX: 'left',
  originY: 'top',
  rx: 7,
  ry: 7,
})
let card = new fabric.Group([groupRect, title, description, placeholderForIcon]);

canvas.add(card);
canvas.renderAll();

setTimeout(function(){
	title.set({text: 'change title after first render and more a lot text text text text'});
  console.log(card);
  card.setCoords();
  // here missing how to update group/rect inside group width after title changed
  // to update canvas well
	canvas.renderAll();
}, 2000)