DataGrid - Fix incorrect onFocusedCellChanged parameters when focusing the first cell (T1282664) (#32814)

Author: markallenramirez

e2e/testcafe-devextreme/tests/dataGrid/common/keyboardNavigation/keyboardNavigation.functional.ts

@@ -4149,6 +4149,52 @@ test('DataGrid - focusedRowIndex is -1 when the first data cell is focused with
   },
 }));
 
+test('DataGrid - onFocusedCellChanged parameters should be correct when focusing the first cell (T1282664)', async (t) => {
+  const dataGrid = new DataGrid('#container');
+
+  // act
+  await t
+    .click(dataGrid.getSearchBox().input)
+    .pressKey('tab tab tab');
+
+  // assert
+  const firstDataCell = dataGrid.getDataCell(0, 0).element;
+  await t
+    .expect(firstDataCell.focused)
+    .ok();
+
+  const expectedFocusedCellChangedEventArgs = {
+    cellElement: firstDataCell,
+    columnIndex: 0,
+    row: {
+      data: {
+        field_0: 'val_0_0',
+        field_1: 'val_0_1',
+      },
+    },
+    rowIndex: 0,
+  };
+  await checkFocusedCellChangedEventArgs(t, expectedFocusedCellChangedEventArgs);
+}).before(async () => {
+  await resetFocusedEventsTestData();
+
+  await createWidget('dxDataGrid', {
+    dataSource: getData(1, 2),
+    keyExpr: 'field_0',
+    showBorders: true,
+    searchPanel: {
+      visible: true,
+    },
+    onFocusedCellChanged(e) {
+      (window as any).focusedEventsTestData.push({ name: 'onFocusedCellChanged', args: e });
+    },
+  });
+}).after(async () => {
+  await ClientFunction(() => {
+    delete (window as any).focusedEventsTestData;
+  })();
+});
+
 test('DataGrid - Cell focus in edit mode does not work correctly if a cell has a disabled editor (T1177434)', async (t) => {
   const dataGrid = new DataGrid('#container');
 

e2e/testcafe-devextreme/tests/dataGrid/helpers/eventUtils.ts

@@ -35,7 +35,11 @@ const getFocusedCellChangedEventArgs = ClientFunction(
       .args;
 
     return {
+      cellElementText: eventArgs.cellElement.get(0).textContent,
       columnIndex: eventArgs.columnIndex,
+      row: {
+        data: eventArgs.row.data,
+      },
       rowIndex: eventArgs.rowIndex,
     };
   },
@@ -102,7 +106,11 @@ export const checkFocusedRowChangingEventArgs = async (
 export const checkFocusedCellChangedEventArgs = async (
   t: TestController,
   expectedArgs: {
+    cellElement?: Selector;
     columnIndex: number;
+    row?: {
+      data: any;
+    };
     rowIndex: number;
   },
 ): Promise<void> => {
@@ -113,6 +121,19 @@ export const checkFocusedCellChangedEventArgs = async (
     .eql(expectedArgs.columnIndex)
     .expect(args.rowIndex)
     .eql(expectedArgs.rowIndex);
+
+  if (expectedArgs.row?.data) {
+    await t
+      .expect(args.row.data)
+      .eql(expectedArgs.row.data);
+  }
+
+  if (expectedArgs.cellElement) {
+    const expectedCellElementText = await expectedArgs.cellElement.textContent;
+    await t
+      .expect(args.cellElementText)
+      .eql(expectedCellElementText);
+  }
 };
 
 export const checkFocusedRowChangedEventArgs = async (

packages/devextreme/js/__internal/grids/grid_core/keyboard_navigation/m_keyboard_navigation.ts

@@ -239,6 +239,7 @@ export class KeyboardNavigationController extends KeyboardNavigationControllerCo
     const isCell = $element.is('td');
     const needSetFocusPosition = (this.option('focusedRowIndex') ?? -1) < 0;
     if (isCell && needSetFocusPosition) {
+      this._focusView();
       this._updateFocusedCellPosition($element);
     }
   }