From: anders <anders.wahlbergwow@gmail.com>
Date: Wed, 22 Nov 2017 00:04:26 +0000 (-0600)
Subject: add check on overwriting canvas height/width (#4874)
X-Git-Tag: v2.7.2~1^2~44
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=6b824d933451243a4fc57d973da6a8ebe6175b8f;p=thirdparty%2FChart.js.git

add check on overwriting canvas height/width (#4874)

* add check on overwriting canvas height/width

* unit test for this
---

diff --git a/src/core/core.helpers.js b/src/core/core.helpers.js
index 713362cd8..bdce895cf 100644
--- a/src/core/core.helpers.js
+++ b/src/core/core.helpers.js
@@ -512,8 +512,10 @@ module.exports = function(Chart) {
 		// If no style has been set on the canvas, the render size is used as display size,
 		// making the chart visually bigger, so let's enforce it to the "correct" values.
 		// See https://github.com/chartjs/Chart.js/issues/3575
-		canvas.style.height = height + 'px';
-		canvas.style.width = width + 'px';
+		if (!canvas.style.height && !canvas.style.width) {
+			canvas.style.height = height + 'px';
+			canvas.style.width = width + 'px';
+		}
 	};
 	// -- Canvas methods
 	helpers.fontString = function(pixelSize, fontStyle, fontFamily) {
diff --git a/test/specs/core.helpers.tests.js b/test/specs/core.helpers.tests.js
index 419428bf1..44446d38a 100644
--- a/test/specs/core.helpers.tests.js
+++ b/test/specs/core.helpers.tests.js
@@ -725,6 +725,23 @@ describe('Core helper tests', function() {
 		document.body.removeChild(div);
 	});
 
+	it ('should leave styled height and width on canvas if explicitly set', function() {
+		var chart = window.acquireChart({}, {
+			canvas: {
+				height: 200,
+				width: 200,
+				style: 'height: 400px; width: 400px;'
+			}
+		});
+
+		helpers.retinaScale(chart, true);
+
+		var canvas = chart.canvas;
+
+		expect(canvas.style.height).toBe('400px');
+		expect(canvas.style.width).toBe('400px');
+	});
+
 	describe('Color helper', function() {
 		function isColorInstance(obj) {
 			return typeof obj === 'object' && obj.hasOwnProperty('values') && obj.values.hasOwnProperty('rgb');