Fabric.js - How to set values for Multiple Active Object?

Question

I want to clone some objects.

1- How can I clone multiple active objects? (The way I use: I am creating a group from selected objects first. Clone this Group and Ungroup back to their original state. Is there any better way that I couldn't find yet ?? )

2- After Ungrouping the objects, They lose their values (e.g lockMovementY:true ) which were set before.( How can I set values for multiple active objects ?? )

3- Cloning Group doesn't have this problem.

I am adding [jsfiddle] so you can check better.

Thank you.

var canvas = new fabric.Canvas('theCanvas', {
  width: 500,
  height: 200,
});

//Add Rect
let rect = new fabric.Rect({
  left: 50,
  top: 50,
  originX: 'center',
  originY: 'center',
  fill: '#ffffff',
  width: 30,
  height: 30,
  fill: 'blue',
  lockMovementY: true,
  centeredScaling: true,
})
canvas.add(rect);
//Rect Ends

//Add Circle
let circle = new fabric.Circle({
  top: 50,
  left: 90,
  originX: 'center',
  originY: 'center',
  fill: 'red',
  opacity: 0.8,
  lockMovementY: true,
  centeredScaling: true,
  radius: 15,
})
canvas.add(circle);
canvas.setActiveObject(circle);
//Circle Ends

//Group
this.group = function() {
  if (!canvas.getActiveObject()) {
    return;
  }
  if (canvas.getActiveObject().type !== 'activeSelection') {
    return;
  }

  canvas.getActiveObject().toGroup(); 
  let activeGroup = canvas.getActiveObject();
  activeGroup.set({
    lockMovementY: true,
    centeredScaling: true,
  });
  canvas.requestRenderAll();
  console.info('Group Created from Objects')
}
//Group Ends

//Ungroup
this.ungroup = function() {
  if (!canvas.getActiveObject()) {
    return;
  }
  if (canvas.getActiveObject().type !== 'group') {
    return;
  }
  canvas.getActiveObject().toActiveSelection();
  canvas.requestRenderAll();
  console.info('Group Disbanded')
}
//Ungroup Ends

//Remove Selected Object
function removeSelected() {
  var activeObjects = canvas.getActiveObjects();
  canvas.discardActiveObject()
  if (activeObjects.length) {
    canvas.remove.apply(canvas, activeObjects);
  }
}
//Remove Object Ends

//Clone-works
this.clone = function() {
  if (!canvas.getActiveObject()) {
    console.warn('None Active Objects');
    return;
  }
  if (canvas.getActiveObject().type !== 'group') {
    this.group();
    var object = canvas.getActiveObject();
    object.clone(function(clone) {
      canvas.add(clone.set({
        top:50,
        left: 200,
        lockMovementY: true,
        centeredScaling: true
      }));
      this.ungroup();
      canvas.setActiveObject(clone);
    })
    this.ungroup();
    
    /*
    SET VALUE FOR EACH ACTİVE OBJECT ???
    forEachObject.set('lockMovementY','true') ??
    */
    
  }
  else{
  var object = canvas.getActiveObject();
    object.clone(function(clone) {
      canvas.add(clone.set({
        top:50,
        left: 200,
        lockMovementY: true,
        centeredScaling: true
      }));
      
      canvas.setActiveObject(clone);
    });
  }

}
//Clone Ends

#theCanvas{
  border: 1px blue solid;
}
button{
  margin: 10px;
  padding: 10px 20px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/4.2.0/fabric.min.js"></script>
<div>
<button onclick="clone()">Clone</button>
<button onclick="group()">Group</button>
<button onclick="ungroup()">Ungroup</button>
<button onclick="removeSelected()">Delete</button>
 </div>
 
 <div class="container">
  <div class="fabric-canvas-wrapper" id="fabric-canvas-wrapper">
    <canvas id="theCanvas"></canvas>
  </div>
</div>