DataGrid - Pager - Show correct pageIndex when virtualScrolling is enabled on pageSize change

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

@@ -238,6 +238,41 @@ test('Page index should not reset when scrolling while the grid is being refresh
   height: 440,
 }));
 
+test('Pager info should show page 1 of 1 after changing pageSize to \'all\' with virtual scrolling', async (t) => {
+  const dataGrid = new DataGrid('#container');
+  const pager = dataGrid.getPager();
+
+  await t
+    .click(pager.getNavPage('5').element)
+    .expect(pager.getNavPage('5').selected)
+    .ok()
+    .expect(pager.getInfoText().textContent)
+    .eql('Page 5 of 10 (50 items)');
+
+  await t
+    .click(pager.getPageSize(1).element)
+    .expect(pager.getInfoText().textContent)
+    .eql('Page 1 of 1 (50 items)');
+}).before(async () => createWidget('dxDataGrid', {
+  dataSource: [...new Array(50).keys()].map((i) => ({ id: i })),
+  keyExpr: 'id',
+  showBorders: true,
+  scrolling: {
+    mode: 'virtual',
+  },
+  paging: {
+    pageSize: 5,
+  },
+  pager: {
+    visible: true,
+    allowedPageSizes: [5, 'all'],
+    showPageSizeSelector: true,
+    showInfo: true,
+    showNavigationButtons: true,
+  },
+  height: 400,
+}));
+
 test('No error should occur if dataSource is not defined and pageIndex is promise chained (T1256070)', async (t) => {
   const dataGrid = new DataGrid('#container');
 

packages/devextreme/js/__internal/grids/grid_core/data_controller/m_data_controller.ts

@@ -213,11 +213,7 @@ export class DataController extends DataHelperMixin(modules.Controller) {
 
     this._isPaging = false;
     this._currentOperationTypes = null;
-    this._dataChangedHandler = (e) => {
-      this._currentOperationTypes = this._dataSource.operationTypes();
-      this._handleDataChanged(e);
-      this._currentOperationTypes = null;
-    };
+    this._dataChangedHandler = this._handleDataChanged.bind(this);
     this._columnsChangedHandler = this._handleColumnsChanged.bind(this);
     this._loadingChangedHandler = this._handleLoadingChanged.bind(this);
     this._loadErrorHandler = this._handleLoadError.bind(this);
@@ -561,6 +557,7 @@ export class DataController extends DataHelperMixin(modules.Controller) {
     let isAsyncDataSourceApplying = false;
 
     this._useSortingGroupingFromColumns = false;
+    this._currentOperationTypes = this.dataSource().operationTypes();
 
     if (dataSource && !that._isDataSourceApplying) {
       that._isDataSourceApplying = true;
@@ -1170,6 +1167,7 @@ export class DataController extends DataHelperMixin(modules.Controller) {
     const changeType = change.changeType || 'refresh';
 
     change.changeType = changeType;
+    change.operationTypes = this._currentOperationTypes;
 
     if (dataSource) {
       const cachedProcessedItems = this._cachedProcessedItems;
@@ -1231,36 +1229,32 @@ export class DataController extends DataHelperMixin(modules.Controller) {
     }
   }
 
-  public updateItems(change?, isDataChanged?) {
-    change = change || {};
-    const that = this;
-    change.isFirstRender = !that.changed.fired();
+  public updateItems(change: any = {}, isDataChanged?: boolean) {
+    change.isFirstRender = !this.changed.fired();
 
-    if (that._repaintChangesOnly !== undefined) {
-      change.repaintChangesOnly = change.repaintChangesOnly ?? that._repaintChangesOnly;
-      change.needUpdateDimensions = change.needUpdateDimensions || that._needUpdateDimensions;
+    if (this._repaintChangesOnly !== undefined) {
+      change.repaintChangesOnly ??= this._repaintChangesOnly;
+      change.needUpdateDimensions ??= this._needUpdateDimensions;
     } else if (change.changes) {
-      change.repaintChangesOnly = that.option('repaintChangesOnly');
+      change.repaintChangesOnly = this.option('repaintChangesOnly');
     } else if (isDataChanged) {
-      const operationTypes = that.dataSource().operationTypes();
+      const operationTypes = this.dataSource().operationTypes();
 
-      change.repaintChangesOnly = operationTypes && !operationTypes.grouping && !operationTypes.filtering && that.option('repaintChangesOnly');
       change.isDataChanged = true;
-      if (operationTypes && (operationTypes.reload || operationTypes.paging || operationTypes.groupExpanding)) {
-        change.needUpdateDimensions = true;
-      }
+      change.repaintChangesOnly = operationTypes && !operationTypes.grouping && !operationTypes.filtering && this.option('repaintChangesOnly');
+      change.needUpdateDimensions = operationTypes && (operationTypes.reload || operationTypes.paging || operationTypes.groupExpanding);
     }
 
-    if (that._updateLockCount && !change.cancel) {
-      that._changes.push(change);
+    if (this._updateLockCount && !change.cancel) {
+      this._changes.push(change);
       return;
     }
 
-    that._updateItemsCore(change);
+    this._updateItemsCore(change);
 
     if (change.cancel) return;
 
-    that._fireChanged(change);
+    this._fireChanged(change);
   }
 
   public loadingOperationTypes() {
@@ -1273,10 +1267,6 @@ export class DataController extends DataHelperMixin(modules.Controller) {
    * @extended: virtual_scrolling, focus
    */
   protected _fireChanged(change) {
-    if (this._currentOperationTypes) {
-      change.operationTypes = this._currentOperationTypes;
-      this._currentOperationTypes = null;
-    }
     deferRender(() => {
       this.changed.fire(change);
     });

packages/devextreme/js/__internal/grids/grid_core/virtual_scrolling/m_virtual_scrolling.ts

@@ -1004,18 +1004,19 @@ export const data = (Base: ModuleType<DataController>) => class VirtualScrolling
     };
   }
 
-  private _updateVisiblePageIndex(currentPageIndex?) {
+  private _updateVisiblePageIndex(value?: number): void {
     if (!this._rowsScrollController) {
       return;
     }
-    if (isDefined(currentPageIndex)) {
-      this._silentOption(VISIBLE_PAGE_INDEX, currentPageIndex);
+
+    if (isDefined(value)) {
+      this._silentOption(VISIBLE_PAGE_INDEX, value);
       this.pageChanged.fire();
       return;
     }
 
-    const viewPortItemIndex = this._rowsScrollController.getViewportItemIndex();
-    const newPageIndex = Math.floor(viewPortItemIndex / this.pageSize());
+    const viewportItemIndex = this._rowsScrollController.getViewportItemIndex();
+    const newPageIndex = Math.floor(viewportItemIndex / this.pageSize());
 
     if (this.pageIndex() !== newPageIndex) {
       this._silentOption(VISIBLE_PAGE_INDEX, newPageIndex);