T1280020 - DataGrid - The 'row' parameter in the FocusedRowChanged event refers to a non-focused row if the grid height is small (DevExpress#30786)

Author: Raushen

e2e/testcafe-devextreme/tests/dataGrid/common/scrolling.ts

@@ -1825,6 +1825,32 @@ test('DataGrid - Scrolling position is reset to far right on an attempt to scrol
   },
 }));
 
+// T1280020
+test('DataGrid - The "row" parameter in the FocusedRowChanged event refers to a non-focused row if the grid height is small', async (t) => {
+  const dataGrid = new DataGrid('#container');
+  const otherContainer = Selector('#otherContainer');
+
+  await dataGrid.apiOption('focusedRowKey', '2');
+  await t.expect(otherContainer.innerText).eql('2');
+
+  await dataGrid.apiOption('focusedRowKey', '0');
+  await t.expect(otherContainer.innerText).eql('0');
+}).before(async () => createWidget('dxDataGrid', {
+  height: 70,
+  dataSource: [
+    { id: '0' },
+    { id: '1' },
+    { id: '2' },
+  ],
+  scrolling: { mode: 'virtual' },
+  keyExpr: 'id',
+  focusedRowEnabled: true,
+  onFocusedRowChanged(e) {
+    const data = e.row?.data;
+    $('#otherContainer').text(data.id);
+  },
+}));
+
 [true, false].forEach((nativeScroll) => {
   type TestCaseWindow = typeof window & { dataGridScrollableEventValues?: number[] };
 

packages/devextreme/js/__internal/grids/grid_core/focus/m_focus.ts

@@ -1,7 +1,7 @@
 /* eslint-disable max-classes-per-file */
 import $ from '@js/core/renderer';
 import { equalByValue } from '@js/core/utils/common';
-import { Deferred, when } from '@js/core/utils/deferred';
+import { Deferred, type DeferredObj, when } from '@js/core/utils/deferred';
 import { each } from '@js/core/utils/iterator';
 import { isBoolean, isDefined } from '@js/core/utils/type';
 
@@ -53,8 +53,9 @@ export class FocusController extends core.ViewController {
           return;
         }
 
-        this._focusRowByKey(value);
-        this.getKeyboardController()._fireFocusedRowChanged();
+        this._focusRowByKey(value).done(() => {
+          this.getKeyboardController()._fireFocusedRowChanged();
+        });
         args.handled = true;
         break;
 
@@ -166,12 +167,14 @@ export class FocusController extends core.ViewController {
     }
   }
 
-  private _focusRowByKey(key) {
+  private _focusRowByKey(
+    key: any,
+  ): DeferredObj<number | unknown> {
     if (!isDefined(key)) {
       this._resetFocusedRow();
-    } else {
-      this._navigateToRow(key, true);
+      return Deferred().resolve();
     }
+    return this._navigateToRow(key, true);
   }
 
   public _resetFocusedRow() {
@@ -205,10 +208,13 @@ export class FocusController extends core.ViewController {
     if (!this.isAutoNavigateToFocusedRow()) {
       this.option('focusedRowIndex', -1);
     }
-    return this._navigateToRow(key);
+    return this._navigateToRow(key, false);
   }
 
-  public _navigateToRow(key, needFocusRow?) {
+  public _navigateToRow(
+    key: any,
+    needFocusRow: boolean,
+  ): DeferredObj<number> {
     const that = this;
     const isAutoNavigate = that.isAutoNavigateToFocusedRow();
     // @ts-expect-error