TreeList: Fix row alternation when repaintChangesOnly is enabled (T1291705) (DevExpress#30386)

Co-authored-by: Alyar <>

Author: Alyar666

e2e/testcafe-devextreme/tests/treeList/etalons/T1291705-row-alternation-after-expanding-node-when-repaintChangesOnly=true.png

@@ -159,3 +159,62 @@ const tasksT1223168 = [{
     await changeTheme(Themes.genericLight);
   });
 });
+
+// T1291705
+test('The shading should alternate correctly after expanding the node when repaintChangesOnly is enabled', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const treeList = new TreeList('#container');
+
+  await treeList.apiExpandRow(4);
+  await treeList.apiExpandRow(2);
+
+  await takeScreenshot('T1291705-row-alternation-after-expanding-node-when-repaintChangesOnly=true', treeList.element);
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => createWidget('dxTreeList', {
+  dataSource: [
+    { id: 1, parentId: 0, text: 'item 1' },
+    { id: 2, parentId: 0, text: 'item 2' },
+    { id: 3, parentId: 2, text: 'item 3' },
+    { id: 4, parentId: 0, text: 'item 4' },
+    { id: 5, parentId: 4, text: 'item 5' },
+    { id: 6, parentId: 0, text: 'item 6' },
+  ],
+  keyExpr: 'id',
+  parentIdExpr: 'parentId',
+  rowAlternationEnabled: true,
+  repaintChangesOnly: true,
+}));
+
+test('The shading should alternate correctly after expanding the node when repaintChangesOnly and old fixed columns are enabled', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+  const treeList = new TreeList('#container');
+
+  await treeList.apiExpandRow(4);
+  await treeList.apiExpandRow(2);
+
+  await takeScreenshot('T1291705-row-alternation-after-expanding-node-when-there-is-fixed-column-and-repaintChangesOnly=true', treeList.element);
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => createWidget('dxTreeList', {
+  dataSource: [
+    { id: 1, parentId: 0, text: 'item 1' },
+    { id: 2, parentId: 0, text: 'item 2' },
+    { id: 3, parentId: 2, text: 'item 3' },
+    { id: 4, parentId: 0, text: 'item 4' },
+    { id: 5, parentId: 4, text: 'item 5' },
+    { id: 6, parentId: 0, text: 'item 6' },
+  ],
+  keyExpr: 'id',
+  parentIdExpr: 'parentId',
+  rowAlternationEnabled: true,
+  repaintChangesOnly: true,
+  columnFixing: {
+    legacyMode: true,
+  },
+  columns: [{ dataField: 'id', fixed: true }, 'text'],
+}));

e2e/testcafe-devextreme/tests/treeList/etalons/T1291705-row-alternation-after-expanding-node-when-there-is-fixed-column-and-repaintChangesOnly=true.png

@@ -1548,6 +1548,10 @@ export class DataController extends DataHelperMixin(modules.Controller) {
     return gridCoreUtils.getIndexByKey(key, this.items(byLoaded));
   }
 
+  public getRowByKey(key: unknown): Item | undefined {
+    return this.items()?.[this.getRowIndexByKey(key)];
+  }
+
   public keyOf(data) {
     const store = this.store();
     if (store) {

e2e/testcafe-devextreme/tests/treeList/markup.ts

@@ -279,7 +279,10 @@ export class RowsView extends ColumnsView {
         setWatcher({
           element: $row.get(0),
           watch: rowOptions.watch,
-          getter: () => this._isAltRow(row),
+          getter: () => this._isAltRow(
+            // The row needs to be obtained again because the current row is out of date.
+            this._dataController.getRowByKey(row.key),
+          ),
           callBack: (value) => {
             $row.toggleClass(ROW_ALTERNATION_CLASS, value);
           },