Merge pull request #7790 from IgniteUI/mkirova/fix-7788

fix(igxHierarchicalGrid): Move onDataPreLoad in base hierarchical gri…

Author: ChronosSF

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

@@ -10,7 +10,9 @@ import {
     Input,
     ViewChild,
     TemplateRef,
-    Directive
+    Directive,
+    Output,
+    EventEmitter
 } from '@angular/core';
 import { IgxGridBaseDirective, IgxGridTransaction } from '../grid-base.directive';
 import { GridBaseAPIService } from '../api.service';
@@ -29,6 +31,7 @@ import { IgxColumnResizingService } from '../resizing/resizing.service';
 import { GridType } from '../common/grid.interface';
 import { IgxColumnGroupComponent } from '../columns/column-group.component';
 import { IgxColumnComponent } from '../columns/column.component';
+import { IForOfState } from '../../directives/for-of/for_of.directive';
 
 export const IgxHierarchicalTransactionServiceFactory = {
     provide: IgxGridTransaction,
@@ -59,6 +62,17 @@ export class IgxHierarchicalGridBaseDirective extends IgxGridBaseDirective {
     @Input()
     public showExpandAll = false;
 
+    /**
+     * Emitted when a new chunk of data is loaded from virtualization.
+     * @example
+     * ```typescript
+     *  <igx-hierarchical-grid [id]="'igx-grid-1'" [data]="Data" [autoGenerate]="true" (onDataPreLoad)="handleEvent()">
+     *  </igx-hierarchical-grid>
+     * ```
+     */
+    @Output()
+    public onDataPreLoad = new EventEmitter<IForOfState>();
+
     /**
      * @hidden
      */

projects/igniteui-angular/src/lib/grids/hierarchical-grid/hierarchical-grid.component.ts

@@ -14,9 +14,7 @@ import {
     AfterContentInit,
     OnInit,
     OnDestroy,
-    DoCheck,
-    EventEmitter,
-    Output
+    DoCheck
 } from '@angular/core';
 import { IgxGridBaseDirective } from '../grid-base.directive';
 import { GridBaseAPIService } from '../api.service';
@@ -32,7 +30,6 @@ import { IgxHierarchicalGridBaseDirective } from './hierarchical-grid-base.direc
 import { takeUntil } from 'rxjs/operators';
 import { IgxTemplateOutletDirective } from '../../directives/template-outlet/template_outlet.directive';
 import { IgxGridSelectionService, IgxGridCRUDService } from '../selection/selection.service';
-import { IForOfState } from '../../directives/for-of/for_of.directive';
 import { IgxTransactionService } from '../../services/public_api';
 import { IgxForOfSyncService, IgxForOfScrollSyncService } from '../../directives/for-of/for_of.sync.service';
 import { GridType } from '../common/grid.interface';
@@ -142,17 +139,6 @@ export class IgxHierarchicalGridComponent extends IgxHierarchicalGridBaseDirecti
         return this._filteredData;
     }
 
-    /**
-     * Emitted when a new chunk of data is loaded from virtualization.
-     * @example
-     * ```typescript
-     *  <igx-hierarchical-grid [id]="'igx-grid-1'" [data]="Data" [autoGenerate]="true" (onDataPreLoad)="handleEvent()">
-     *  </igx-hierarchical-grid>
-     * ```
-     */
-    @Output()
-    public onDataPreLoad = new EventEmitter<IForOfState>();
-
     /**
      * Gets/Sets the total number of records in the data source.
      * @remarks

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

@@ -369,6 +369,32 @@ describe('IgxHierarchicalGrid Virtualization #hGrid', () => {
 
         expect(hierarchicalGrid.verticalScrollContainer.getScroll().children[0].offsetHeight).toEqual(561);
     });
+
+    it('should emit onScroll and onDataPreLoad on row island when child grid is scrolled.', async() => {
+        const ri = fixture.componentInstance.rowIsland;
+        const firstRow = hierarchicalGrid.dataRowList.toArray()[0];
+        (firstRow.nativeElement.children[0] as HTMLElement).click();
+        fixture.detectChanges();
+
+        const childGrid = hierarchicalGrid.hgridAPI.getChildGrids(false)[0];
+        const verticalScroll = childGrid.verticalScrollContainer;
+        const elem = verticalScroll['scrollComponent'].elementRef.nativeElement;
+
+
+        spyOn(ri.onScroll, 'emit').and.callThrough();
+        spyOn(ri.onDataPreLoad, 'emit').and.callThrough();
+
+
+        // scroll down
+        elem.scrollTop = 400;
+        fixture.detectChanges();
+        fixture.componentRef.hostView.detectChanges();
+        await wait();
+        fixture.detectChanges();
+
+        expect(ri.onScroll.emit).toHaveBeenCalled();
+        expect(ri.onDataPreLoad.emit).toHaveBeenCalled();
+    });
 });
 
 describe('IgxHierarchicalGrid Virtualization Custom Scenarios #hGrid', () => {