Skip Konva.Transformer in container.getClientRect() calculations

CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+### 8.3.10 (2020-06-20)
+
+- Skip `Konva.Transformer` in `container.getClientRect()` calculations
+
 ### 8.3.9 (2020-05-27)
 
 - Typescript fixes

konva.js

@@ -8,7 +8,7 @@
    * Konva JavaScript Framework v8.3.9
    * http://konvajs.org/
    * Licensed under the MIT
-   * Date: Mon May 30 2022
+   * Date: Mon Jun 20 2022
    *
    * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
    * Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@@ -15494,6 +15494,11 @@
       toObject() {
           return Node.prototype.toObject.call(this);
       }
+      getClientRect() {
+          // return zero size
+          // so it will be skipped in calculations
+          return { x: 0, y: 0, width: 0, height: 0 };
+      }
   }
   function validateAnchors(val) {
       if (!(val instanceof Array)) {

src/shapes/Transformer.ts

@@ -1219,6 +1219,12 @@ export class Transformer extends Group {
     return Node.prototype.toObject.call(this);
   }
 
+  getClientRect() {
+    // return zero size
+    // so it will be skipped in calculations
+    return { x: 0, y: 0, width: 0, height: 0 };
+  }
+
   nodes: GetSet<Node[], this>;
   enabledAnchors: GetSet<string[], this>;
   rotationSnaps: GetSet<number[], this>;

test/unit/Transformer-test.ts

@@ -4690,4 +4690,32 @@ describe('Transformer', function () {
     assert.equal(tr2.width(), rect.width());
     assert.equal(tr2.height(), rect.height());
   });
+  it('detached transformer should not affect client rect', function () {
+    var stage = addStage();
+    var layer = new Konva.Layer();
+    stage.add(layer);
+
+    var rect = new Konva.Rect({
+      x: 100,
+      y: 60,
+      draggable: true,
+      width: 100,
+      height: 100,
+      fill: 'yellow',
+    });
+    layer.add(rect);
+
+    var tr = new Konva.Transformer({
+      nodes: [],
+    });
+    layer.add(tr);
+
+    const box = layer.getClientRect();
+
+    // it should update second transformer
+    assert.equal(box.x, rect.x());
+    assert.equal(box.y, rect.y());
+    assert.equal(box.width, rect.width());
+    assert.equal(box.height, rect.height());
+  });
 });