From d386c1355dea549b7082be558747c7eabe45e6be Mon Sep 17 00:00:00 2001
From: Alyar <Alyar666@users.noreply.github.com>
Date: Fri, 13 Dec 2024 18:27:48 +0400
Subject: [PATCH] DataGrid: Fix sorting when it and filtering are changed at
 the same time (T1237863) (#28545)

Co-authored-by: Alyar <>
---
 .../m_columns_controller.ts                   |  12 +++--
 ...237863_datagrid-grouping_and_filtering.png | Bin 0 -> 5248 bytes
 .../tests/dataGrid/grouping/grouping.ts       |  39 ++++++++++++++++
 ...1237863_datagrid-sorting_and_filtering.png | Bin 0 -> 4914 bytes
 .../tests/dataGrid/sorting/sorting.ts         |  43 ++++++++++++++++++
 5 files changed, 90 insertions(+), 4 deletions(-)
 create mode 100644 packages/devextreme/testing/testcafe/tests/dataGrid/grouping/etalons/T1237863_datagrid-grouping_and_filtering.png
 create mode 100644 packages/devextreme/testing/testcafe/tests/dataGrid/sorting/etalons/T1237863_datagrid-sorting_and_filtering.png

diff --git a/packages/devextreme/js/__internal/grids/grid_core/columns_controller/m_columns_controller.ts b/packages/devextreme/js/__internal/grids/grid_core/columns_controller/m_columns_controller.ts
index 8ad5de9dab8d..1c6c0a2bfe46 100644
--- a/packages/devextreme/js/__internal/grids/grid_core/columns_controller/m_columns_controller.ts
+++ b/packages/devextreme/js/__internal/grids/grid_core/columns_controller/m_columns_controller.ts
@@ -1259,7 +1259,6 @@ export class ColumnsController extends modules.Controller {
 
   public updateSortingGrouping(dataSource, fromDataSource?) {
     const that = this;
-    let sortParameters;
     let isColumnsChanged;
     const updateSortGroupParameterIndexes = function (columns, sortParameters, indexParameterName) {
       each(columns, (index, column) => {
@@ -1296,10 +1295,14 @@ export class ColumnsController extends modules.Controller {
       });
     };
     if (dataSource) {
-      sortParameters = gridCoreUtils.normalizeSortingInfo(dataSource.sort());
+      const sortParameters = gridCoreUtils.normalizeSortingInfo(dataSource.sort());
       const groupParameters = gridCoreUtils.normalizeSortingInfo(dataSource.group());
       const columnsGroupParameters = that.getGroupDataSourceParameters();
       const columnsSortParameters = that.getSortDataSourceParameters();
+      const changeTypes = this._columnChanges?.changeTypes;
+      const sortingChanged = !gridCoreUtils.equalSortParameters(sortParameters, columnsSortParameters);
+      const needToApplySortingFromDataSource = fromDataSource && !changeTypes?.sorting;
+      const needToApplyGroupingFromDataSource = fromDataSource && !changeTypes?.grouping;
       const groupingChanged = !gridCoreUtils.equalSortParameters(groupParameters, columnsGroupParameters, true);
       const groupExpandingChanged = !groupingChanged && !gridCoreUtils.equalSortParameters(groupParameters, columnsGroupParameters);
 
@@ -1315,7 +1318,7 @@ export class ColumnsController extends modules.Controller {
         assignColumns(that, createColumnsFromOptions(that, that._columns));
       }
 
-      if ((fromDataSource || (!columnsGroupParameters && !that._hasUserState)) && (groupingChanged || groupExpandingChanged)) {
+      if ((needToApplyGroupingFromDataSource || (!columnsGroupParameters && !that._hasUserState)) && (groupingChanged || groupExpandingChanged)) {
         /// #DEBUG
         that.__groupingUpdated = true;
         /// #ENDDEBUG
@@ -1326,7 +1329,8 @@ export class ColumnsController extends modules.Controller {
           isColumnsChanged = true;
         }
       }
-      if ((fromDataSource || (!columnsSortParameters && !that._hasUserState)) && !gridCoreUtils.equalSortParameters(sortParameters, columnsSortParameters)) {
+
+      if ((needToApplySortingFromDataSource || (!columnsSortParameters && !that._hasUserState)) && sortingChanged) {
         /// #DEBUG
         that.__sortingUpdated = true;
         /// #ENDDEBUG
diff --git a/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/etalons/T1237863_datagrid-grouping_and_filtering.png b/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/etalons/T1237863_datagrid-grouping_and_filtering.png
new file mode 100644
index 0000000000000000000000000000000000000000..e77ff373bc76488238a8c80654f420f9c6be8aa5
GIT binary patch
literal 5248
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
Oeb-deRi&z24*5I5_18H7

literal 0
HcmV?d00001

diff --git a/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/grouping.ts b/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/grouping.ts
index 212975bcfe5b..11227b617c28 100644
--- a/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/grouping.ts
+++ b/packages/devextreme/testing/testcafe/tests/dataGrid/grouping/grouping.ts
@@ -378,3 +378,42 @@ test('DataGrid loses grouping after the expandAll method if a grouped column has
     },
   ],
 }));
+
+test('Grouping and filtering should be applied correctly when they change at runtime (T1237863)', async (t) => {
+  const dataGrid = new DataGrid('#container');
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  await dataGrid.option({
+    'columns[2].groupIndex': 0,
+    filterValue: ['room', '=', '1'],
+  });
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  await takeScreenshot('T1237863_datagrid-grouping_and_filtering.png', dataGrid.element);
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(() => createWidget('dxDataGrid', {
+  dataSource: [
+    {
+      ID: 1,
+      FirstName: 'Bob',
+      room: 1,
+    },
+    {
+      ID: 2,
+      FirstName: 'Alex',
+      room: 2,
+    },
+    {
+      ID: 3,
+      FirstName: 'John',
+      room: 1,
+    },
+  ],
+  keyExpr: 'ID',
+}));
diff --git a/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/etalons/T1237863_datagrid-sorting_and_filtering.png b/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/etalons/T1237863_datagrid-sorting_and_filtering.png
new file mode 100644
index 0000000000000000000000000000000000000000..6c1cd564248e9e4ce51c439fdf7775b0d6f9d072
GIT binary patch
literal 4914
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
Q26~qEX+6zC_47CW30hu_>Hq)$

literal 0
HcmV?d00001

diff --git a/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/sorting.ts b/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/sorting.ts
index 6fde3381a4c1..d4b1fd2c82d6 100644
--- a/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/sorting.ts
+++ b/packages/devextreme/testing/testcafe/tests/dataGrid/sorting/sorting.ts
@@ -87,3 +87,46 @@ test('Multiple sorting alphabetical icons should be correct in Fluent Theme (T12
     });
   },
 ).after(async () => { await changeTheme(Themes.genericLight); });
+
+test('Sorting and filtering should be applied correctly when they change at runtime (T1237863)', async (t) => {
+  const dataGrid = new DataGrid('#container');
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  await dataGrid.option({
+    'columns[1].sortIndex': 0,
+    'columns[1].sortOrder': 'desc',
+    filterValue: ['room', '=', '1'],
+  });
+
+  await t.expect(dataGrid.isReady()).ok();
+
+  await takeScreenshot('T1237863_datagrid-sorting_and_filtering.png', dataGrid.element);
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(() => createWidget('dxDataGrid', {
+  dataSource: [
+    {
+      ID: 1,
+      FirstName: 'Bob',
+      room: 1,
+    },
+    {
+      ID: 2,
+      FirstName: 'Alex',
+      room: 2,
+    },
+    {
+      ID: 3,
+      FirstName: 'John',
+      room: 1,
+    },
+  ],
+  keyExpr: 'ID',
+  sorting: {
+    mode: 'multiple',
+  },
+}));