refactor(grid): Removed scroll throttle for grid scrolls

Author: rkaraivanov

projects/igniteui-angular/grids/grid/src/grid-base.directive.ts

@@ -30,7 +30,6 @@ import {
     ViewContainerRef,
     DOCUMENT,
     inject,
-    InjectionToken
 } from '@angular/core';
 import {
     areEqualArrays,
@@ -111,15 +110,6 @@ import { CharSeparatedValueData, DropPosition, FilterMode, getUUID, GridCellMerg
 import { getCurrentI18n, getNumberFormatter, IResourceChangeEventArgs,  } from 'igniteui-i18n-core';
 import { I18N_FORMATTER } from 'igniteui-angular/core';
 
-/**
- * Injection token for setting the throttle time used in grid virtual scroll.
- * @hidden
- */
-export const SCROLL_THROTTLE_TIME = /*@__PURE__*/new InjectionToken<number>('SCROLL_THROTTLE_TIME', {
-    factory: () => 40
-});
-
-
 interface IMatchInfoCache {
     row: any;
     index: number;
@@ -176,7 +166,6 @@ export abstract class IgxGridBaseDirective implements GridType,
     protected _diTransactions = inject(IgxGridTransaction, { optional: true });
     /** @hidden @internal */
     public i18nFormatter = inject(I18N_FORMATTER);
-    private readonly THROTTLE_TIME = inject(SCROLL_THROTTLE_TIME);
 
     /**
      * Gets/Sets the display time for the row adding snackbar notification.
@@ -3730,7 +3719,6 @@ export abstract class IgxGridBaseDirective implements GridType,
 
         this.scrollNotify.pipe(
             filter(() => !this._init),
-            throttleTime(this.THROTTLE_TIME, animationFrameScheduler, { leading: false, trailing: true }),
             destructor
         )
             .subscribe((event) => {

projects/igniteui-angular/grids/grid/src/grid-cell-selection.spec.ts

@@ -1,7 +1,6 @@
 import { TestBed, fakeAsync, tick, ComponentFixture, waitForAsync } from '@angular/core/testing';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { IgxGridComponent } from './public_api';
-import { SCROLL_THROTTLE_TIME } from './../src/grid-base.directive';
 import {
     SelectionWithScrollsComponent,
     SelectionWithTransactionsComponent,
@@ -979,9 +978,6 @@ describe('IgxGrid - Cell selection #grid', () => {
         let gridContent: DebugElement;
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(SelectionWithScrollsComponent);
             fix.detectChanges();
             grid = fix.componentInstance.grid;

projects/igniteui-angular/grids/grid/src/grid-keyBoardNav.spec.ts

@@ -15,7 +15,6 @@ import { DebugElement, QueryList } from '@angular/core';
 import { IgxGridGroupByRowComponent } from './groupby-row.component';
 import { CellType } from 'igniteui-angular/grids/core';
 import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core';
-import { SCROLL_THROTTLE_TIME } from './../src/grid-base.directive';
 
 const DEBOUNCETIME = 100;
 
@@ -223,9 +222,6 @@ describe('IgxGrid - Keyboard navigation #grid', () => {
         }));
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(VirtualGridComponent);
             fix.detectChanges();
             grid = fix.componentInstance.grid;

projects/igniteui-angular/grids/grid/src/grid-mrl-keyboard-nav.spec.ts

@@ -11,7 +11,6 @@ import { GridFunctions, GRID_MRL_BLOCK } from '../../../test-utils/grid-function
 import { CellType, IGridCellEventArgs, IgxColumnComponent, IgxGridMRLNavigationService } from 'igniteui-angular/grids/core';
 import { IgxColumnLayoutComponent } from 'igniteui-angular/grids/core';
 import { DefaultSortingStrategy, SortingDirection } from 'igniteui-angular/core';
-import { SCROLL_THROTTLE_TIME } from './../src/grid-base.directive';
 
 const DEBOUNCE_TIME = 60;
 const CELL_CSS_CLASS = '.igx-grid__td';
@@ -29,9 +28,6 @@ describe('IgxGrid Multi Row Layout - Keyboard navigation #grid', () => {
     }));
 
     beforeEach(() => {
-        TestBed.configureTestingModule({
-            providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-        });
         fix = TestBed.createComponent(ColumnLayoutTestComponent);
     });
 

projects/igniteui-angular/grids/grid/src/grid.component.spec.ts

@@ -18,7 +18,6 @@ import { AsyncPipe } from '@angular/common';
 import { setElementSize, ymd } from '../../../test-utils/helper-utils.spec';
 import { FilteringExpressionsTree, FilteringLogic, getComponentSize, GridColumnDataType, IgxNumberFilteringOperand, IgxStringFilteringOperand, ISortingExpression, ɵSize, SortingDirection } from 'igniteui-angular/core';
 import { IgxPaginatorComponent, IgxPaginatorContentDirective } from 'igniteui-angular/paginator';
-import { SCROLL_THROTTLE_TIME } from './../src/grid-base.directive';
 
 describe('IgxGrid Component Tests #grid', () => {
     const MIN_COL_WIDTH = '136px';
@@ -42,12 +41,6 @@ describe('IgxGrid Component Tests #grid', () => {
             .compileComponents();
         }));
 
-        beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
-        });
-
         it('should initialize a grid with columns from markup', () => {
             const fix = TestBed.createComponent(IgxGridMarkupDeclarationComponent);
             fix.detectChanges();

projects/igniteui-angular/grids/grid/src/grid.master-detail.spec.ts

@@ -15,7 +15,6 @@ import { GridSummaryCalculationMode, IgxStringFilteringOperand, SortingDirection
 import { IgxCheckboxComponent } from 'igniteui-angular/checkbox';
 import { IgxInputDirective, IgxInputGroupComponent } from 'igniteui-angular/input-group';
 import { IgxPaginatorComponent } from 'igniteui-angular/paginator';
-import { SCROLL_THROTTLE_TIME } from './../src/grid-base.directive';
 
 const DEBOUNCE_TIME = 60;
 const ROW_TAG = 'igx-grid-row';
@@ -44,12 +43,6 @@ describe('IgxGrid Master Detail #grid', () => {
         }).compileComponents();
     }));
 
-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-        });
-    }));
-
     describe('Basic', () => {
         beforeEach(fakeAsync(() => {
             fix = TestBed.createComponent(DefaultGridMasterDetailComponent);

projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.navigation.spec.ts

@@ -10,7 +10,6 @@ import { clearGridSubs, setupHierarchicalGridScrollDetection } from '../../../te
 import { GridFunctions } from '../../../test-utils/grid-functions.spec';
 import { IGridCellEventArgs, IgxColumnComponent, IgxGridCellComponent, IgxGridNavigationService } from 'igniteui-angular/grids/core';
 import { IPathSegment } from 'igniteui-angular/core';
-import { SCROLL_THROTTLE_TIME } from './../../grid/src/grid-base.directive';
 
 const DEBOUNCE_TIME = 60;
 const GRID_CONTENT_CLASS = '.igx-grid__tbody-content';
@@ -38,20 +37,11 @@ describe('IgxHierarchicalGrid Navigation', () => {
         jasmine.DEFAULT_TIMEOUT_INTERVAL = defaultTimeout * 2;
     }));
 
-    beforeEach(waitForAsync(() => {
-        TestBed.configureTestingModule({
-            providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-        });
-    }));
-
     afterAll(() => jasmine.DEFAULT_TIMEOUT_INTERVAL = defaultTimeout);
 
     describe('IgxHierarchicalGrid Basic Navigation #hGrid', () => {
 
         beforeEach(waitForAsync(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fixture = TestBed.createComponent(IgxHierarchicalGridTestBaseComponent);
             fixture.detectChanges();
             hierarchicalGrid = fixture.componentInstance.hgrid;
@@ -964,9 +954,6 @@ describe('IgxHierarchicalGrid Navigation', () => {
 
     describe('IgxHierarchicalGrid Navigation API #hGrid', () => {
         beforeEach(waitForAsync(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 1 }]
-            });
             fixture = TestBed.createComponent(IgxHierarchicalGridMultiLayoutComponent);
             fixture.detectChanges();
             hierarchicalGrid = fixture.componentInstance.hgrid;

projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.virtualization.spec.ts

@@ -14,7 +14,6 @@ import { IgxHierarchicalGridDefaultComponent } from '../../../test-utils/hierarc
 import { firstValueFrom } from 'rxjs';
 import { FilteringExpressionsTree, FilteringLogic, IgxStringFilteringOperand } from 'igniteui-angular/core';
 import { IgxGridNavigationService } from 'igniteui-angular/grids/core';
-import { SCROLL_THROTTLE_TIME } from './../../grid/src/grid-base.directive';
 
 describe('IgxHierarchicalGrid Virtualization #hGrid', () => {
     let fixture;
@@ -34,9 +33,6 @@ describe('IgxHierarchicalGrid Virtualization #hGrid', () => {
     }));
 
     beforeEach(() => {
-        TestBed.configureTestingModule({
-            providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 1 }]
-        });
         fixture = TestBed.createComponent(IgxHierarchicalGridTestBaseComponent);
         fixture.detectChanges();
         hierarchicalGrid = fixture.componentInstance.hgrid;

projects/igniteui-angular/grids/tree-grid/src/tree-grid-keyBoardNav.spec.ts

@@ -9,7 +9,6 @@ import { GridFunctions } from '../../../test-utils/grid-functions.spec';
 import { DebugElement } from '@angular/core';
 import { firstValueFrom } from 'rxjs';
 import { CellType } from 'igniteui-angular/grids/core';
-import { SCROLL_THROTTLE_TIME } from './../../grid/src/grid-base.directive';
 
 const DEBOUNCETIME = 60;
 
@@ -397,9 +396,6 @@ describe('IgxTreeGrid - Key Board Navigation #tGrid', () => {
         const treeColumns = ['ID', 'Name', 'HireDate', 'Age', 'OnPTO'];
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(IgxTreeGridWithScrollsComponent);
             fix.detectChanges();
             treeGrid = fix.componentInstance.treeGrid;

projects/igniteui-angular/grids/tree-grid/src/tree-grid-multi-cell-selection.spec.ts

@@ -11,7 +11,6 @@ import { UIInteractions, wait } from '../../../test-utils/ui-interactions.spec';
 import { GridSelectionFunctions, GridSummaryFunctions, GridFunctions } from '../../../test-utils/grid-functions.spec';
 import { GridSelectionMode } from 'igniteui-angular/grids/core';
 import { IgxStringFilteringOperand } from 'igniteui-angular/core';
-import { SCROLL_THROTTLE_TIME } from './../../grid/src/grid-base.directive';
 
 describe('IgxTreeGrid - Multi Cell selection #tGrid', () => {
 
@@ -33,9 +32,6 @@ describe('IgxTreeGrid - Multi Cell selection #tGrid', () => {
         let detect;
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 1 }]
-            });
             fix = TestBed.createComponent(IgxTreeGridSelectionKeyComponent);
             fix.detectChanges();
             treeGrid = fix.componentInstance.treeGrid;
@@ -560,9 +556,6 @@ describe('IgxTreeGrid - Multi Cell selection #tGrid', () => {
         let detect;
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(IgxTreeGridSelectionComponent);
             fix.detectChanges();
             treeGrid = fix.componentInstance.treeGrid;
@@ -675,9 +668,6 @@ describe('IgxTreeGrid - Multi Cell selection #tGrid', () => {
         let treeGrid;
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(IgxTreeGridSelectionWithTransactionComponent);
             fix.detectChanges();
             treeGrid = fix.componentInstance.treeGrid;
@@ -808,9 +798,6 @@ describe('IgxTreeGrid - Multi Cell selection #tGrid', () => {
         let treeGrid;
 
         beforeEach(() => {
-            TestBed.configureTestingModule({
-                providers: [{ provide: SCROLL_THROTTLE_TIME, useValue: 0 }]
-            });
             fix = TestBed.createComponent(IgxTreeGridFKeySelectionWithTransactionComponent);
             fix.detectChanges();
             treeGrid = fix.componentInstance.treeGrid;