title: FabricJS - Group selection brings objects to front while selected
body: <p>When I select a group of objects all them are automatically rendered on top of everything. This is a annoying behaviour that makes hard to select other elements that were on top of the selected elements.</p>
  
  <p>There is an example of that happening <a href="https://jsfiddle.net/fbgu7697/2/" rel="nofollow">here</a>.</p>
  
  <pre><code>function newRect(index) {
      return new fabric.Rect({
      width: 100,
      height: 100,
      top: index * 30,
      left: index * 30,
      fill: '#' + (0x1000000 + (Math.random()) * 0xffffff).toString(16).substr(1, 6),
    });
  }
  
  var canvas = new fabric.Canvas('canvas');
  
  var rect0 = newRect(0);
  canvas.add(rect0);
  
  var rect1 = newRect(1);
  canvas.add(rect1);
  
  var rect2 = newRect(2);
  canvas.add(rect2);
  
  var group = new fabric.Group([rect0, rect1]);
  
  canvas.setActiveGroup(group).renderAll();
  
  setTimeout(function() {
    canvas.discardActiveGroup().renderAll();
  }, 5000);
  </code></pre>
  
  <p>When the two elements that are behind another are selected, they are rendered on top of the third one. But when they are deselected, (wait 5 seconds until the group is discarded) they are rendered properly behind the element on top.</p>
  
  <p>Is there anyway to disable this behaviour? I would that the selected elements maintain there z order while selected and do not be on top of everything.</p>