Merge branch 'liulinboyi-feat/rotateLinkLineVisiable'

src/Node.ts

@@ -2091,7 +2091,7 @@ export abstract class Node<Config extends NodeConfig = NodeConfig> {
         this.toCanvas(config).toBlob((blob) => {
           resolve(blob);
           callback?.(blob);
-        });
+        }, config?.mimeType, config?.quality);
       } catch (err) {
         reject(err);
       }

src/shapes/Transformer.ts

@@ -18,6 +18,7 @@ export interface Box extends IRect {
 export interface TransformerConfig extends ContainerConfig {
   resizeEnabled?: boolean;
   rotateEnabled?: boolean;
+  rotateLineVisible?: boolean;
   rotationSnaps?: Array<number>;
   rotationSnapTolerance?: number;
   rotateAnchorOffset?: number;
@@ -205,6 +206,7 @@ function getSnap(snaps: Array<number>, newRotationRad: number, tol: number) {
  * @param {Object} config
  * @param {Boolean} [config.resizeEnabled] Default is true
  * @param {Boolean} [config.rotateEnabled] Default is true
+ * @param {Boolean} [config.rotateLineVisible] Default is true
  * @param {Array} [config.rotationSnaps] Array of angles for rotation snaps. Default is []
  * @param {Number} [config.rotationSnapTolerance] Snapping tolerance. If closer than this it will snap. Default is 5
  * @param {Number} [config.rotateAnchorOffset] Default is 50
@@ -614,7 +616,7 @@ export class Transformer extends Group {
           shape.height() + padding * 2
         );
         ctx.moveTo(shape.width() / 2, -padding);
-        if (tr.rotateEnabled()) {
+        if (tr.rotateEnabled() && tr.rotateLineVisible()) {
           ctx.lineTo(
             shape.width() / 2,
             -tr.rotateAnchorOffset() * Util._sign(shape.height()) - padding
@@ -1289,6 +1291,7 @@ export class Transformer extends Group {
   anchorSize: GetSet<number, this>;
   resizeEnabled: GetSet<boolean, this>;
   rotateEnabled: GetSet<boolean, this>;
+  rotateLineVisible: GetSet<boolean, this>;
   rotateAnchorOffset: GetSet<number, this>;
   rotationSnapTolerance: GetSet<number, this>;
   rotateAnchorCursor: GetSet<string, this>;
@@ -1422,6 +1425,21 @@ Factory.addGetterSetter(Transformer, 'anchorSize', 10, getNumberValidator());
  */
 Factory.addGetterSetter(Transformer, 'rotateEnabled', true);
 
+/**
+ * get/set visibility of a little line that connects transformer and rotate anchor.
+ * @name Konva.Transformer#rotateLineVisible
+ * @method
+ * @param {Boolean} enabled
+ * @returns {Boolean}
+ * @example
+ * // get
+ * var rotateLineVisible = transformer.rotateLineVisible();
+ *
+ * // set
+ * transformer.rotateLineVisible(false);
+ */
+Factory.addGetterSetter(Transformer, 'rotateLineVisible', true);
+
 /**
  * get/set rotation snaps angles.
  * @name Konva.Transformer#rotationSnaps

test/unit/Stage-test.ts

@@ -1368,6 +1368,26 @@ describe('Stage', function () {
     }
   });
 
+  it('toBlob with mimeType option using', async function () {
+    const stage = addStage();
+    const layer = new Konva.Layer();
+
+    stage.add(layer);
+
+    if (isBrowser) {
+      try {
+        const blob = await stage.toBlob({
+          mimeType: 'image/jpeg',
+          quality: 0.5,
+        });
+        assert.isTrue(blob instanceof Blob && blob.type === 'image/jpeg', "can't change type of blob");
+      } catch (e) {
+        console.error(e);
+        assert.fail('error creating blob');
+      }
+    }
+  });
+
   it('check hit graph with stage listening property', function () {
     var stage = addStage();
     var layer = new Konva.Layer();