fix(Activeselection): Activeselection default initialization (#9940)

.codesandbox/templates/vanilla/src/testcases/clearCache.ts

@@ -1,14 +1,23 @@
 import * as fabric from 'fabric';
 
 export async function testCase(canvas: fabric.Canvas) {
+  const utahCommonDefaults = {
+    originX: 'center' as const,
+    originY: 'center' as const,
+  };
+
+  fabric.ActiveSelection.ownDefaults = {
+    ...fabric.ActiveSelection.ownDefaults,
+    ...utahCommonDefaults,
+  };
+
+  fabric.Rect.ownDefaults = {
+    ...fabric.Rect.ownDefaults,
+    ...utahCommonDefaults,
+  };
+
   const rect = new fabric.Rect({ width: 500, height: 500, fill: 'blue' });
-  rect.on('moving', function (opt) {
-    if (this.fill === 'blue') {
-      this.fill = 'red';
-    } else {
-      this.fill = 'blue';
-    }
-    this.dirty = true;
-  });
-  canvas.add(rect);
+  const rect2 = new fabric.Rect({ width: 500, height: 500, fill: 'blue' });
+
+  canvas.add(rect, rect2);
 }

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## [next]
 
+- fix(Activeselection): Activeselection default initialization [#9940](https://github.com/fabricjs/fabric.js/pull/9940)
+
 ## [6.0.0-rc3]
 
 - fix(StaticCanvas): fully clean the cache canvas to avoid leaving trailing pixels [#9779](https://github.com/fabricjs/fabric.js/pull/9779)

src/shapes/ActiveSelection.ts

@@ -59,13 +59,17 @@ export class ActiveSelection extends Group {
 
   constructor(
     objects: FabricObject[] = [],
-    { layoutManager, ...options }: Partial<ActiveSelectionOptions> = {}
+    options: Partial<ActiveSelectionOptions> = {}
   ) {
-    super(objects, {
-      layoutManager: layoutManager ?? new ActiveSelectionLayoutManager(),
-    });
+    super();
     Object.assign(this, ActiveSelection.ownDefaults);
     this.setOptions(options);
+    const { left, top, layoutManager } = options;
+    this.groupInit(objects, {
+      left,
+      top,
+      layoutManager: layoutManager ?? new ActiveSelectionLayoutManager(),
+    });
   }
 
   /**

src/shapes/Group.ts

@@ -140,6 +140,21 @@ export class Group
     super();
     Object.assign(this, Group.ownDefaults);
     this.setOptions(options);
+    this.groupInit(objects, options);
+  }
+
+  /**
+   * Shared code between group and active selection
+   * Meant to be used by the constructor.
+   */
+  protected groupInit(
+    objects: FabricObject[],
+    options: {
+      layoutManager?: LayoutManager;
+      top?: number;
+      left?: number;
+    }
+  ) {
     this._objects = [...objects]; // Avoid unwanted mutations of Collection to affect the caller
 
     this.__objectSelectionTracker = this.__objectSelectionMonitor.bind(
@@ -156,7 +171,7 @@ export class Group
     });
 
     // perform initial layout
-    this.layoutManager = options.layoutManager || new LayoutManager();
+    this.layoutManager = options.layoutManager ?? new LayoutManager();
     this.layoutManager.performLayout({
       type: LAYOUT_TYPE_INITIALIZATION,
       target: this,