From 265c8e8a5657070203dadeb60dab8bc26e85af2d Mon Sep 17 00:00:00 2001 From: Alex Molodyh <140214274+amolodyh-hyland@users.noreply.github.com> Date: Thu, 6 Feb 2025 13:04:37 -0800 Subject: [PATCH] AAE-28655 Fix for datatable not scrolling back up after paginations (#10605) * AAE-28655 Fix for datatable not scrolling back up after paginations --- .../datatable/datatable.component.html | 64 ++++++++++--------- .../datatable/datatable.component.spec.ts | 38 +++++++++++ 2 files changed, 73 insertions(+), 29 deletions(-) diff --git a/lib/core/src/lib/datatable/components/datatable/datatable.component.html b/lib/core/src/lib/datatable/components/datatable/datatable.component.html index 6393c0999c..49a9220ade 100644 --- a/lib/core/src/lib/datatable/components/datatable/datatable.component.html +++ b/lib/core/src/lib/datatable/components/datatable/datatable.component.html @@ -174,12 +174,13 @@
- +
+ role="gridcell" + class="adf-datatable-cell adf-datatable__actions-cell adf-datatable-hover-only">
+ [attr.data-automation-id]="'fileSize_' + data.getValue(row, col, resolverFn)">
+ [attr.data-automation-id]="'text_' + data.getValue(row, col, resolverFn)">
+ [attr.data-automation-id]="'boolean_' + data.getValue(row, col, resolverFn)"> + role="gridcell" + tabindex="0" + class="adf-datatable-cell adf-datatable__actions-cell adf-datatable-center-actions-column-ie adf-datatable-actions-menu">
-
-
- - + + +
+
+ + +
-
-
+ +
+ +
-
+ diff --git a/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts b/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts index 33b66515a3..04a64b3e64 100644 --- a/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts +++ b/lib/core/src/lib/datatable/components/datatable/datatable.component.spec.ts @@ -1468,6 +1468,44 @@ describe('DataTable', () => { expect(await testingUtils.checkIfMatCheckboxesHaveClass('adf-datatable-hover-only')).toBeTrue(); }); }); + + it('should scroll back to the top when new data is set', async () => { + const columnDefinitions = [ + { + type: 'text', + key: 'id', + title: '' + }, + { + type: 'text', + key: 'name', + title: 'Name' + } + ] as DataColumn[]; + const initialRows = Array.from({ length: 20 }, (_, i) => ({ id: `${i + 1}`, name: `Row ${i + 1}` })); + const nextRows = Array.from({ length: 20 }, (_, i) => ({ id: `${i + 21}`, name: `Row ${i + 21}` })); + + // Load first 20 records + dataTable.data = new ObjectDataTableAdapter(initialRows, columnDefinitions); + fixture.detectChanges(); + + // Check that scroll body height > 0 + const scrollBody = fixture.nativeElement.querySelector('.adf-datatable-body'); + expect(scrollBody.scrollHeight).toBeGreaterThan(0); + + // Scroll to bottom + scrollBody.scrollTop = scrollBody.scrollHeight; + scrollBody.dispatchEvent(new Event('scroll')); + fixture.detectChanges(); + + // Set new records + dataTable.data = new ObjectDataTableAdapter(nextRows, columnDefinitions); + fixture.detectChanges(); + + // Verify new records are loaded and first record is at top + expect(scrollBody.scrollTop).toBe(0); + expect(testingUtils.getInnerTextByDataAutomationId('text_Row 21')).toContain('Row 21'); + }); }); describe('Accesibility', () => {