From 5fc934eae1237e78f6db3ab065c71ee9412b9047 Mon Sep 17 00:00:00 2001
From: Jukka Kurkela <jukka.kurkela@gmail.com>
Date: Wed, 13 Feb 2019 18:08:38 +0200
Subject: [PATCH] Fix responsive resize on rtl page (#6063)

---
 src/platforms/platform.dom.css      |  1 +
 test/specs/core.controller.tests.js | 40 +++++++++++++++++++++++++++++
 2 files changed, 41 insertions(+)

diff --git a/src/platforms/platform.dom.css b/src/platforms/platform.dom.css
index e0b99a4aad4..5e749593eeb 100644
--- a/src/platforms/platform.dom.css
+++ b/src/platforms/platform.dom.css
@@ -19,6 +19,7 @@
 .chartjs-size-monitor-expand,
 .chartjs-size-monitor-shrink {
 	position: absolute;
+	direction: ltr;
 	left: 0;
 	top: 0;
 	right: 0;
diff --git a/test/specs/core.controller.tests.js b/test/specs/core.controller.tests.js
index 819074393b1..ef41f5942b4 100644
--- a/test/specs/core.controller.tests.js
+++ b/test/specs/core.controller.tests.js
@@ -379,6 +379,46 @@ describe('Chart', function() {
 			});
 		});
 
+		it('should resize the canvas when parent is RTL and width changes', function(done) {
+			var chart = acquireChart({
+				options: {
+					responsive: true,
+					maintainAspectRatio: false
+				}
+			}, {
+				canvas: {
+					style: ''
+				},
+				wrapper: {
+					style: 'width: 300px; height: 350px; position: relative; direction: rtl'
+				}
+			});
+
+			expect(chart).toBeChartOfSize({
+				dw: 300, dh: 350,
+				rw: 300, rh: 350,
+			});
+
+			var wrapper = chart.canvas.parentNode;
+			wrapper.style.width = '455px';
+			waitForResize(chart, function() {
+				expect(chart).toBeChartOfSize({
+					dw: 455, dh: 350,
+					rw: 455, rh: 350,
+				});
+
+				wrapper.style.width = '150px';
+				waitForResize(chart, function() {
+					expect(chart).toBeChartOfSize({
+						dw: 150, dh: 350,
+						rw: 150, rh: 350,
+					});
+
+					done();
+				});
+			});
+		});
+
 		it('should resize the canvas when parent height changes', function(done) {
 			var chart = acquireChart({
 				options: {