types and tests fixes

konva.js

@@ -8,7 +8,7 @@
    * Konva JavaScript Framework v8.4.2
    * http://konvajs.org/
    * Licensed under the MIT
-   * Date: Mon Feb 20 2023
+   * Date: Thu Mar 23 2023
    *
    * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
    * Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
@@ -1652,7 +1652,7 @@
           }
       }
       _applyLineCap(shape) {
-          var lineCap = shape.getLineCap();
+          const lineCap = shape.attrs.lineCap;
           if (lineCap) {
               this.setAttr('lineCap', lineCap);
           }
@@ -1664,7 +1664,7 @@
           }
       }
       _applyLineJoin(shape) {
-          var lineJoin = shape.attrs.lineJoin;
+          const lineJoin = shape.attrs.lineJoin;
           if (lineJoin) {
               this.setAttr('lineJoin', lineJoin);
           }
@@ -2081,30 +2081,30 @@
           }
       }
       _fillRadialGradient(shape) {
-          var grd = shape._getRadialGradient();
+          const grd = shape._getRadialGradient();
           if (grd) {
               this.setAttr('fillStyle', grd);
               shape._fillFunc(this);
           }
       }
       _fill(shape) {
-          var hasColor = shape.fill(), fillPriority = shape.getFillPriority();
+          const hasColor = shape.fill(), fillPriority = shape.getFillPriority();
           // priority fills
           if (hasColor && fillPriority === 'color') {
               this._fillColor(shape);
               return;
           }
-          var hasPattern = shape.getFillPatternImage();
+          const hasPattern = shape.getFillPatternImage();
           if (hasPattern && fillPriority === 'pattern') {
               this._fillPattern(shape);
               return;
           }
-          var hasLinearGradient = shape.getFillLinearGradientColorStops();
+          const hasLinearGradient = shape.getFillLinearGradientColorStops();
           if (hasLinearGradient && fillPriority === 'linear-gradient') {
               this._fillLinearGradient(shape);
               return;
           }
-          var hasRadialGradient = shape.getFillRadialGradientColorStops();
+          const hasRadialGradient = shape.getFillRadialGradientColorStops();
           if (hasRadialGradient && fillPriority === 'radial-gradient') {
               this._fillRadialGradient(shape);
               return;
@@ -2124,7 +2124,7 @@
           }
       }
       _strokeLinearGradient(shape) {
-          var start = shape.getStrokeLinearGradientStartPoint(), end = shape.getStrokeLinearGradientEndPoint(), colorStops = shape.getStrokeLinearGradientColorStops(), grd = this.createLinearGradient(start.x, start.y, end.x, end.y);
+          const start = shape.getStrokeLinearGradientStartPoint(), end = shape.getStrokeLinearGradientEndPoint(), colorStops = shape.getStrokeLinearGradientColorStops(), grd = this.createLinearGradient(start.x, start.y, end.x, end.y);
           if (colorStops) {
               // build color stops
               for (var n = 0; n < colorStops.length; n += 2) {
@@ -2198,7 +2198,7 @@
       _stroke(shape) {
           if (shape.hasHitStroke()) {
               // ignore strokeScaleEnabled for Text
-              var strokeScaleEnabled = shape.getStrokeScaleEnabled();
+              const strokeScaleEnabled = shape.getStrokeScaleEnabled();
               if (!strokeScaleEnabled) {
                   this.save();
                   var pixelRatio = this.getCanvas().getPixelRatio();
@@ -14893,7 +14893,15 @@
           if (this._nodes && this._nodes.length) {
               this.detach();
           }
-          this._nodes = nodes;
+          const filteredNodes = nodes.filter((node) => {
+              // check if ancestor of the transformer
+              if (node.isAncestorOf(this)) {
+                  Util.error('Konva.Transformer cannot be an a child of the node you are trying to attach');
+                  return false;
+              }
+              return true;
+          });
+          this._nodes = nodes = filteredNodes;
           if (nodes.length === 1 && this.useSingleNodeRotation()) {
               this.rotation(nodes[0].getAbsoluteRotation());
           }

src/Context.ts

@@ -3,6 +3,7 @@ import { Konva } from './Global';
 import { Canvas } from './Canvas';
 import { Shape } from './Shape';
 import { IRect } from './types';
+import type { Node } from './Node';
 
 function simplifyArray(arr: Array<any>) {
   var retArr = [],
@@ -285,7 +286,7 @@ export class Context {
       this.setAttr('lineCap', lineCap);
     }
   }
-  _applyOpacity(shape: Shape) {
+  _applyOpacity(shape: Node) {
     var absOpacity = shape.getAbsoluteOpacity();
     if (absOpacity !== 1) {
       this.setAttr('globalAlpha', absOpacity);
@@ -796,7 +797,7 @@ export class SceneContext extends Context {
   }
   _fill(shape) {
     const hasColor = shape.fill(),
-    fillPriority = shape.getFillPriority();
+      fillPriority = shape.getFillPriority();
 
     // priority fills
     if (hasColor && fillPriority === 'color') {

test/unit/MouseEvents-test.ts

@@ -1750,7 +1750,7 @@ describe('MouseEvents', function () {
     assert.equal(shape, circle);
   });
 
-  it('double click after click should trigger event', function (done) {
+  it('double click after click should trigger event', function () {
     var stage = addStage();
     var layer = new Konva.Layer();
     stage.add(layer);
@@ -1802,37 +1802,31 @@ describe('MouseEvents', function () {
     assert.equal(smallClicks, 0, 'no  click on small rect');
     assert.equal(smallDblClicks, 0, 'no dblclick on small rect');
 
-    setTimeout(function () {
+    simulateMouseDown(stage, {
-      simulateMouseDown(stage, {
+      x: 100,
-        x: 100,
+      y: 100,
-        y: 100,
-      });
-      simulateMouseUp(stage, {
-        x: 100,
-        y: 100,
-      });
-
-      assert.equal(bigClicks, 1, 'single click on big rect');
-      assert.equal(smallClicks, 1, 'single click on small rect');
-      assert.equal(smallDblClicks, 0, 'no dblclick on small rect');
-
-      setTimeout(function () {
-        simulateMouseDown(stage, {
-          x: 100,
-          y: 100,
-        });
-        simulateMouseUp(stage, {
-          x: 100,
-          y: 100,
-        });
-
-        assert.equal(bigClicks, 1, 'single click on big rect');
-        assert.equal(smallClicks, 2, 'second click on small rect');
-        assert.equal(smallDblClicks, 1, 'single dblclick on small rect');
-
-        done();
-      });
     });
+    simulateMouseUp(stage, {
+      x: 100,
+      y: 100,
+    });
+
+    assert.equal(bigClicks, 1, 'single click on big rect');
+    assert.equal(smallClicks, 1, 'single click on small rect');
+    assert.equal(smallDblClicks, 0, 'no dblclick on small rect');
+
+    simulateMouseDown(stage, {
+      x: 100,
+      y: 100,
+    });
+    simulateMouseUp(stage, {
+      x: 100,
+      y: 100,
+    });
+
+    assert.equal(bigClicks, 1, 'single click on big rect');
+    assert.equal(smallClicks, 2, 'second click on small rect');
+    assert.equal(smallDblClicks, 1, 'single dblclick on small rect');
   });
 
   it('click on stage and second click on shape should not trigger double click (check after dblclick)', function (done) {

test/unit/Text-test.ts

@@ -667,10 +667,12 @@ describe('Text', function () {
 
     stage.add(layer);
 
-    var trace =
+    if (Konva.isBrowser) {
-      'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);font=normal normal 30px Arial;textBaseline=middle;textAlign=left;translate(0,0);save();fillStyle=black;fillText(Y,0,15);fillStyle=black;fillText(O,20.01,15);fillStyle=black;fillText(U,43.345,15);fillStyle=black;fillText( ,65.01,15);fillStyle=black;fillText(A,73.345,15);fillStyle=black;fillText(R,93.354,15);fillStyle=black;fillText(E,115.02,15);fillStyle=black;fillText( ,135.029,15);fillStyle=black;fillText(I,143.364,15);fillStyle=black;fillText(N,151.699,15);fillStyle=black;fillText(V,173.364,15);fillStyle=black;fillText(I,193.374,15);fillStyle=black;fillText(T,201.709,15);fillStyle=black;fillText(E,220.034,15);fillStyle=black;fillText(D,240.044,15);fillStyle=black;fillText(!,261.709,15);restore();restore();';
+      var trace =
+        'clearRect(0,0,578,200);save();transform(1,0,0,1,10,10);font=normal normal 30px Arial;textBaseline=middle;textAlign=left;translate(0,0);save();fillStyle=black;fillText(Y,0,15);fillStyle=black;fillText(O,20,15);fillStyle=black;fillText(U,43,15);fillStyle=black;fillText( ,65,15);fillStyle=black;fillText(A,73,15);fillStyle=black;fillText(R,93,15);fillStyle=black;fillText(E,115,15);fillStyle=black;fillText( ,135,15);fillStyle=black;fillText(I,143,15);fillStyle=black;fillText(N,151,15);fillStyle=black;fillText(V,173,15);fillStyle=black;fillText(I,193,15);fillStyle=black;fillText(T,201,15);fillStyle=black;fillText(E,220,15);fillStyle=black;fillText(D,240,15);fillStyle=black;fillText(!,261,15);restore();restore();';
 
-    assert.equal(layer.getContext().getTrace(), trace);
+      assert.equal(layer.getContext().getTrace(false, true), trace);
+    }
   });
 
   it('text multi line with justify align and several paragraphs', function () {