Fix: Avoid negative layout dimensions (#9027)

diff --git a/src/core/core.layouts.js b/src/core/core.layouts.js
index dfd0dd31b986e59436864998714a72dd469d1a2b..e0069fe2e98ff8de2f64d375334ee1c4a1fb83d7 100644 (file)
--- a/src/core/core.layouts.js
+++ b/src/core/core.layouts.js
@@ -309,8 +309,8 @@ export default {
     }
 
     const padding = toPadding(chart.options.layout.padding);
-    const availableWidth = width - padding.width;
-    const availableHeight = height - padding.height;
+    const availableWidth = Math.max(width - padding.width, 0);
+    const availableHeight = Math.max(height - padding.height, 0);
     const boxes = buildLayoutBoxes(chart.boxes);
     const verticalBoxes = boxes.vertical;
     const horizontalBoxes = boxes.horizontal;

diff --git a/test/specs/scale.linear.tests.js b/test/specs/scale.linear.tests.js
index 9ff00e7240f91330d143aea4f0432d9f03493ecf..c523afea9db63062a1bef771196b8917f8b24c82 100644 (file)
--- a/test/specs/scale.linear.tests.js
+++ b/test/specs/scale.linear.tests.js
@@ -1220,4 +1220,31 @@ describe('Linear Scale', function() {
     expect(scale.getValueForPixel(end)).toBeCloseTo(min, 4);
     expect(scale.getValueForPixel(start)).toBeCloseTo(max, 4);
   });
+
+  it('should not throw errors when chart size is negative', function() {
+    function createChart() {
+      return window.acquireChart({
+        type: 'bar',
+        data: {
+          labels: [0, 1, 2, 3, 4, 5, 6, 7, '7+'],
+          datasets: [{
+            data: [29.05, 4, 15.69, 11.69, 2.84, 4, 0, 3.84, 4],
+          }],
+        },
+        options: {
+          plugins: false,
+          layout: {
+            padding: {top: 30, left: 1, right: 1, bottom: 1}
+          }
+        }
+      }, {
+        canvas: {
+          height: 0,
+          width: 0
+        }
+      });
+    }
+
+    expect(createChart).not.toThrow();
+  });
 });