Merge branch 'image-corner-radius' of https://github.com/iaosee/konva into iaosee-image-corner-radius

src/shapes/Image.ts

@@ -91,20 +91,25 @@ export class Image extends Shape<ImageConfig> {
       }
     }
 
-    context.beginPath();
-    if (!cornerRadius) {
-      context.rect(0, 0, width, height);
-    } else {
-      Util.drawRoundedRectPath(context, width, height, cornerRadius);
+    if (this.hasFill() || this.hasStroke()) {
+      context.beginPath();
+      cornerRadius
+        ? Util.drawRoundedRectPath(context, width, height, cornerRadius)
+        : context.rect(0, 0, width, height);
+      context.closePath();
+      context.fillStrokeShape(this);
     }
+
     if (image) {
-      context.save();
-      cornerRadius && context.clip();
+      // context.save();
+      if (cornerRadius) {
+        // Util.drawRoundedRectPath(context, width, height, cornerRadius);
+        context.clip();
+      }
       context.drawImage.apply(context, params);
-      context.restore();
+      // context.restore();
     }
-    context.closePath();
-    context.fillStrokeShape(this);
+    // If you need to draw later, you need to execute save/restore
   }
   _hitFunc(context) {
     var width = this.width(),

test/unit/Image-test.ts

@@ -26,7 +26,6 @@ describe('Image', function () {
         offset: { x: 50, y: 30 },
         crop: { x: 135, y: 7, width: 167, height: 134 },
         draggable: true,
-        cornerRadius: 15,
       });
 
       layer.add(darth);
@@ -44,7 +43,6 @@ describe('Image', function () {
       assert.equal(darth.getHeight(), 100);
       assert.equal(darth.offset().x, 50);
       assert.equal(darth.offset().y, 30);
-      assert.equal(darth.cornerRadius(), 15);
 
       var crop = darth.crop();
 
@@ -169,6 +167,7 @@ describe('Image', function () {
         crop: { x: 186, y: 211, width: 106, height: 74 },
         draggable: true,
         scale: { x: 0.5, y: 0.5 },
+        cornerRadius: 15,
       });
 
       layer.add(darth);
@@ -210,6 +209,7 @@ describe('Image', function () {
       assert.equal(darth.cropY(), 6);
       assert.equal(darth.cropWidth(), 7);
       assert.equal(darth.cropHeight(), 8);
+      assert.equal(darth.cornerRadius(), 15);
 
       done();
     });