fix(dropdown): no scrolling or highlighting of the selected option if…

… list not loaded before (#1166)
allianz · Apr 15, 2024 · 54aa4f4 · 54aa4f4
1 parent 5ad6feb
commit 54aa4f4
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/projects/ng-aquila/src/dropdown/dropdown.spec.ts b/projects/ng-aquila/src/dropdown/dropdown.spec.ts
@@ -606,6 +606,17 @@ describe('NxDropdownComponent', () => {
             // 4 * 44 + 22 (half of item height) + 12 (firstItemPaddingTop) - 100 (middle of panel)
             expect(dropdownInstance.panelBody?.nativeElement.scrollTop).toBe(110);
         }));
+
+        it('should scroll the selected item in the middle of the panel on dropdown change', fakeAsync(() => {
+            createTestComponent(ScrollingTestComponent);
+            trigger.click();
+            tick(500);
+            flush();
+            fixture.detectChanges();
+            tick(1);
+            // 4 * 44 + 22 (half of item height) + 12 (firstItemPaddingTop) - 100 (middle of panel)
+            expect(dropdownInstance.panelBody?.nativeElement.scrollTop).toBe(110);
+        }));
     });
 
     describe('multiselect dropdown', () => {

diff --git a/projects/ng-aquila/src/dropdown/dropdown.ts b/projects/ng-aquila/src/dropdown/dropdown.ts
@@ -674,6 +674,9 @@ export class NxDropdownComponent
                 // the combination of dropdown-item notifying parent and when the parent
                 // tries to fetch the triggerValue from the child throws these errors
                 setTimeout(() => {
+                    if (this._panelOpen) {
+                        this._initActiveItem();
+                    }
                     this._cdr.markForCheck();
                     this.stateChanges.next();
                 });