From 46603d4b984784819f1e990ba35db25b050da15a Mon Sep 17 00:00:00 2001
From: "kotov.alexander" <alexander.kotov@devexpress.com>
Date: Thu, 13 Feb 2020 18:25:51 +0300
Subject: [PATCH] Update TileView content position in RTL mode if the content
 size is less than the widget (T860587) (#12000)

---
 js/ui/tile_view.js                            | 11 +++++++-
 .../DevExpress.ui.widgets/tileView.tests.js   | 25 +++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/js/ui/tile_view.js b/js/ui/tile_view.js
index d21f152d95ea..a43aa1edd4ff 100644
--- a/js/ui/tile_view.js
+++ b/js/ui/tile_view.js
@@ -217,8 +217,17 @@ const TileView = CollectionWidget.inherit({
         this._cells.push(new Array(this._cellsPerDimension));
 
         this._arrangeItems(items);
+        this._renderContentSize(config, itemMargin);
+    },
+
+    _renderContentSize: function(config, itemMargin) {
         if(windowUtils.hasWindow()) {
-            this._$container[config.mainDimension](this._cells.length * this.option(config.baseItemMainDimension) + (this._cells.length + 1) * itemMargin);
+            const actualContentSize = this._cells.length * this.option(config.baseItemMainDimension) + (this._cells.length + 1) * itemMargin;
+            const containerSize = this._$container[config.mainDimension]();
+
+            if(actualContentSize > containerSize) {
+                this._$container[config.mainDimension](actualContentSize);
+            }
         }
     },
 
diff --git a/testing/tests/DevExpress.ui.widgets/tileView.tests.js b/testing/tests/DevExpress.ui.widgets/tileView.tests.js
index badb0056f849..531ff978c84c 100644
--- a/testing/tests/DevExpress.ui.widgets/tileView.tests.js
+++ b/testing/tests/DevExpress.ui.widgets/tileView.tests.js
@@ -20,6 +20,8 @@ const TILEVIEW_CONTAINER_CLASS = 'dx-tileview-wrapper';
 const TILEVIEW_ITEM_CLASS = 'dx-tile';
 const TILEVIEW_ITEM_SELECTOR = '.' + TILEVIEW_ITEM_CLASS;
 
+const SCROLLVIEW_CONTENT_CLASS = 'dx-scrollview-content';
+
 const DEFAULT_ITEMSIZE = 100;
 const DEFAULT_ITEMMARGIN = 20;
 const DEFAULT_ITEMOFFSET = DEFAULT_ITEMSIZE + DEFAULT_ITEMMARGIN;
@@ -333,6 +335,29 @@ QUnit.module('widget sizing render', () => {
 
         assert.strictEqual($element.outerWidth(), customWidth, 'outer width of the element must be equal to custom width');
     });
+
+    QUnit.test('scrollable content has the correct width if it is larger than the widget', function(assert) {
+        const customWidth = 500;
+        const $element = $('#widget').dxTileView({
+            items: prepareItems(items, configs.horizontal),
+            height: 300,
+            width: customWidth
+        });
+
+        assert.ok($element.find(`.${SCROLLVIEW_CONTENT_CLASS}`).width() > customWidth + 1);
+    });
+
+    QUnit.test('scrollable content has the correct width if it is less than the widget (T860587)', function(assert) {
+        const customWidth = 1500;
+        const $element = $('#widget').dxTileView({
+            items: prepareItems(items, configs.horizontal),
+            height: 600,
+            width: customWidth,
+            rtlEnabled: true
+        });
+
+        assert.roughEqual($element.find(`.${SCROLLVIEW_CONTENT_CLASS}`).width(), customWidth, 1);
+    });
 });
 
 QUnit.module('integration with dataSource', {