Use #hasFill() and #hasStroke() more broadly and avoid drawing strokes when strokeWidth is set to 0.

src/item/Item.js

@@ -413,12 +413,11 @@ var Item = Base.extend(Callback, /** @lends Item# */{
 	},
 
 	hasFill: function() {
-		return !!this.getStyle().getFillColor();
+		return this.getStyle().hasFill();
 	},
 
 	hasStroke: function() {
-		var style = this.getStyle();
-		return !!style.getStrokeColor() && style.getStrokeWidth() > 0;
+		return this.getStyle().hasStroke();
 	}
 }, Base.each(['locked', 'visible', 'blendMode', 'opacity', 'guide'],
 	// Produce getter/setters for properties. We need setters because we want to
@@ -3104,29 +3103,28 @@ var Item = Base.extend(Callback, /** @lends Item# */{
 		// items without children, where styles would be merged.
 		var style = this._style,
 			matrix = this._matrix,
-			width = style.getStrokeWidth(),
-			join = style.getStrokeJoin(),
-			cap = style.getStrokeCap(),
-			limit = style.getMiterLimit(),
+			strokeWidth = style.getStrokeWidth(),
 			fillColor = style.getFillColor(),
 			strokeColor = style.getStrokeColor(),
 			shadowColor = style.getShadowColor();
-		if (width != null)
-			ctx.lineWidth = width;
-		if (join)
-			ctx.lineJoin = join;
-		if (cap)
-			ctx.lineCap = cap;
-		if (limit)
-			ctx.miterLimit = limit;
 		// We need to take matrix into account for gradients,
 		// see #toCanvasStyle()
 		if (fillColor)
 			ctx.fillStyle = fillColor.toCanvasStyle(ctx, matrix);
-		if (strokeColor) {
+		if (strokeColor && strokeWidth > 0) {
 			ctx.strokeStyle = strokeColor.toCanvasStyle(ctx, matrix);
-			var dashArray = style.getDashArray(),
+			ctx.lineWidth = strokeWidth;
+			var strokeJoin = style.getStrokeJoin(),
+				strokeCap = style.getStrokeCap(),
+				miterLimit = style.getMiterLimit(),
+				dashArray = style.getDashArray(),
 				dashOffset = style.getDashOffset();
+			if (strokeJoin)
+				ctx.lineJoin = strokeJoin;
+			if (strokeCap)
+				ctx.lineCap = strokeCap;
+			if (miterLimit)
+				ctx.miterLimit = miterLimit;
 			if (paper.support.nativeDash && dashArray && dashArray.length) {
 				if ('setLineDash' in ctx) {
 					ctx.setLineDash(dashArray);

src/item/Shape.js

@@ -152,10 +152,10 @@ var Shape = Item.extend(/** @lends Shape# */{
 
 	_draw: function(ctx, param) {
 		var style = this._style,
-			fillColor = style.getFillColor(),
-			strokeColor = style.getStrokeColor(),
+			hasFill = style.hasFill(),
+			hasStroke = style.hasStroke(),
 			clip = param.clip;
-		if (fillColor || strokeColor || clip) {
+		if (hasFill || hasStroke || clip) {
 			var radius = this._radius,
 				shape = this._shape;
 			ctx.beginPath();
@@ -202,11 +202,11 @@ var Shape = Item.extend(/** @lends Shape# */{
 			}
 			ctx.closePath();
 		}
-		if (!clip && (fillColor || strokeColor)) {
+		if (!clip && (hasFill || hasStroke)) {
 			this._setStyles(ctx);
-			if (fillColor)
+			if (hasFill)
 				ctx.fill(style.getWindingRule());
-			if (strokeColor)
+			if (hasStroke)
 				ctx.stroke();
 		}
 	},

src/path/CompoundPath.js

@@ -225,9 +225,9 @@ var CompoundPath = PathItem.extend(/** @lends CompoundPath# */{
 		if (!param.clip) {
 			this._setStyles(ctx);
 			var style = this._style;
-			if (style.getFillColor())
+			if (style.hasFill())
 				ctx.fill(style.getWindingRule());
-			if (style.getStrokeColor())
+			if (style.hasStroke())
 				ctx.stroke();
 		}
 	}

src/path/Path.js

@@ -1999,11 +1999,11 @@ var Path = PathItem.extend(/** @lends Path# */{
 				ctx.beginPath();
 
 			var style = this.getStyle(),
-				fillColor = style.getFillColor(),
-				strokeColor = style.getStrokeColor(),
+				hasFill = style.hasFill(),
+				hasStroke = style.hasStroke(),
 				dashArray = style.getDashArray(),
 				// dashLength is only set if we can't draw dashes natively
-				dashLength = !paper.support.nativeDash && strokeColor
+				dashLength = !paper.support.nativeDash && hasStroke
 						&& dashArray && dashArray.length;
 
 			function getOffset(i) {
@@ -2014,19 +2014,19 @@ var Path = PathItem.extend(/** @lends Path# */{
 
 			// Prepare the canvas path if we have any situation that requires it
 			// to be defined.
-			if (fillColor || strokeColor && !dashLength || compound || clip)
+			if (hasFill || hasStroke && !dashLength || compound || clip)
 				drawSegments(ctx, this);
 
 			if (this._closed)
 				ctx.closePath();
 
-			if (!clip && !compound && (fillColor || strokeColor)) {
+			if (!clip && !compound && (hasFill || hasStroke)) {
 				// If the path is part of a compound path or doesn't have a fill
 				// or stroke, there is no need to continue.
 				this._setStyles(ctx);
-				if (fillColor)
+				if (hasFill)
 					ctx.fill(style.getWindingRule());
-				if (strokeColor) {
+				if (hasStroke) {
 					if (dashLength) {
 						// We cannot use the path created by drawSegments above
 						// Use CurveFlatteners to draw dashed paths:
@@ -2517,7 +2517,7 @@ statics: {
 		}
 
 		// TODO: Find a way to reuse 'bounds' cache instead?
-		if (!style.getStrokeColor() || !style.getStrokeWidth())
+		if (!style.hasStroke())
 			return Path.getBounds(segments, closed, style, matrix);
 		var length = segments.length - (closed ? 0 : 1),
 			radius = style.getStrokeWidth() / 2,

src/style/Style.js

@@ -242,6 +242,18 @@ var Style = Base.extend(new function() {
 				|| false;
 	},
 
+	// DOCS: Style#hasFill()
+	hasFill: function() {
+		return !!this.getFillColor();
+	},
+
+	// DOCS: Style#hasStroke()
+	hasStroke: function() {
+		return !!this.getStrokeColor() && this.getStrokeWidth() > 0;
+	},
+
+	// Overrides
+
 	getLeading: function getLeading() {
 		// Override leading to return fontSize * 1.2 by default.
 		var leading = getLeading.base.call(this);

src/text/PointText.js

@@ -89,9 +89,9 @@ var PointText = TextItem.extend(/** @lends PointText# */{
 		ctx.textAlign = style.getJustification();
 		for (var i = 0, l = lines.length; i < l; i++) {
 			var line = lines[i];
-			if (style.getFillColor())
+			if (style.hasFill())
 				ctx.fillText(line, 0, 0);
-			if (style.getStrokeColor())
+			if (style.hasStroke())
 				ctx.strokeText(line, 0, 0);
 			ctx.translate(0, leading);
 		}