Fix rounding issues for getClientRect() for some shapes. fix #879

src/Shape.ts

@@ -246,13 +246,13 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
   _hasShadow() {
     return (
       this.shadowEnabled() &&
-      (this.shadowOpacity() !== 0 &&
-        !!(
-          this.shadowColor() ||
-          this.shadowBlur() ||
-          this.shadowOffsetX() ||
-          this.shadowOffsetY()
-        ))
+      this.shadowOpacity() !== 0 &&
+      !!(
+        this.shadowColor() ||
+        this.shadowBlur() ||
+        this.shadowOffsetX() ||
+        this.shadowOffsetY()
+      )
     );
   }
   _getFillPattern() {
@@ -349,11 +349,14 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
    * @returns {Boolean}
    */
   hasFill() {
-    return this.fillEnabled() && !!(
-      this.fill() ||
-      this.fillPatternImage() ||
-      this.fillLinearGradientColorStops() ||
-      this.fillRadialGradientColorStops()
+    return (
+      this.fillEnabled() &&
+      !!(
+        this.fill() ||
+        this.fillPatternImage() ||
+        this.fillLinearGradientColorStops() ||
+        this.fillRadialGradientColorStops()
+      )
     );
   }
   /**
@@ -377,7 +380,7 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
     // and we have some value from width
     return (
       this.strokeEnabled() &&
-      (width || this.strokeWidth() && width === 'auto')
+      (width || (this.strokeWidth() && width === 'auto'))
     );
   }
   /**
@@ -428,6 +431,9 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
     );
   }
   setStrokeHitEnabled(val: number) {
+    Util.warn(
+      'strokeHitEnabled property is deprecated. Please use hitStrokeWidth instead.'
+    );
     if (val) {
       this.hitStrokeWidth('auto');
     } else {
@@ -456,8 +462,8 @@ export class Shape<Config extends ShapeConfig = ShapeConfig> extends Node<
   getSelfRect() {
     var size = this.size();
     return {
-      x: this._centroid ? Math.round(-size.width / 2) : 0,
-      y: this._centroid ? Math.round(-size.height / 2) : 0,
+      x: this._centroid ? -size.width / 2 : 0,
+      y: this._centroid ? -size.height / 2 : 0,
       width: size.width,
       height: size.height
     };
@@ -888,7 +894,7 @@ Factory.addGetterSetter(
 Factory.addGetterSetter(Shape, 'strokeHitEnabled', true, getBooleanValidator());
 
 /**
- * get/set strokeHitEnabled property. Useful for performance optimization.
+ * **deprecated, use hitStrokeWidth instead!** get/set strokeHitEnabled property. Useful for performance optimization.
  * You may set `shape.strokeHitEnabled(false)`. In this case stroke will be no draw on hit canvas, so hit area
  * of shape will be decreased (by lineWidth / 2). Remember that non closed line with `strokeHitEnabled = false`
  * will be not drawn on hit canvas, that is mean line will no trigger pointer events (like mouseover)

src/shapes/Line.ts

@@ -219,10 +219,10 @@ export class Line<Config extends LineConfig = LineConfig> extends Shape<
       maxY = Math.max(maxY, y);
     }
     return {
-      x: Math.round(minX),
-      y: Math.round(minY),
-      width: Math.round(maxX - minX),
-      height: Math.round(maxY - minY)
+      x: minX,
+      y: minY,
+      width: maxX - minX,
+      height: maxY - minY
     };
   }
 

src/shapes/Text.ts

@@ -95,9 +95,11 @@ function checkDefaultFill(config) {
 }
 
 // polyfill for IE11
-const trimRight = String.prototype.trimRight || function polyfill() {
-  return this.replace(/[\s\xa0]+$/, '');
-}
+const trimRight =
+  String.prototype.trimRight ||
+  function polyfill() {
+    return this.replace(/[\s\xa0]+$/, '');
+  };
 
 /**
  * Text constructor
@@ -294,7 +296,11 @@ export class Text extends Shape<TextConfig> {
     context.fillStrokeShape(this);
   }
   setText(text) {
-    var str = Util._isString(text) ? text : (text === null || text === undefined) ? '' : text + '';
+    var str = Util._isString(text)
+      ? text
+      : text === null || text === undefined
+      ? ''
+      : text + '';
     this._setAttr(TEXT, str);
     return this;
   }

src/shapes/TextPath.ts

@@ -531,10 +531,10 @@ export class TextPath extends Shape<TextPathConfig> {
     }
     var fontSize = this.fontSize();
     return {
-      x: Math.round(minX) - fontSize / 2,
-      y: Math.round(minY) - fontSize / 2,
-      width: Math.round(maxX - minX) + fontSize,
-      height: Math.round(maxY - minY) + fontSize
+      x: minX - fontSize / 2,
+      y: minY - fontSize / 2,
+      width: maxX - minX + fontSize,
+      height: maxY - minY + fontSize
     };
   }