Merge pull request #12638 from contra1337/issue-12637

resolves #12637 -- uses proper group children property in dropdown autoselect

src/app/components/dropdown/dropdown.spec.ts

@@ -20,6 +20,7 @@ import { TimesIcon } from 'primeng/icons/times';
         </p-dropdown>
         <p-dropdown [(ngModel)]="selectedCity"></p-dropdown>
         <button (click)="setValue()"></button>
+        <p-dropdown [(ngModel)]="selectedCity" [options]="groupedCarsAlternate" optionGroupChildren="children" [group]="true"></p-dropdown>
     `
 })
 class TestDropdownComponent {
@@ -55,6 +56,12 @@ class TestDropdownComponent {
         }
     ];
 
+    groupedCarsAlternate = this.groupedCars.map(city => ({
+      label: city.label,
+      value: city.value,
+      children: city.items
+    }));
+
     disabled: boolean;
 
     editable: boolean;
@@ -69,6 +76,7 @@ describe('Dropdown', () => {
     let dropdown: Dropdown;
     let testDropdown: Dropdown;
     let groupDropdown: Dropdown;
+    let alternateGroupDropdown: Dropdown;
     let fixture: ComponentFixture<Dropdown>;
     let groupFixture: ComponentFixture<TestDropdownComponent>;
 
@@ -82,6 +90,7 @@ describe('Dropdown', () => {
         groupFixture = TestBed.createComponent(TestDropdownComponent);
         groupDropdown = groupFixture.debugElement.children[0].componentInstance;
         testDropdown = groupFixture.debugElement.children[1].componentInstance;
+        alternateGroupDropdown = groupFixture.debugElement.children[3].componentInstance;
         dropdown = fixture.componentInstance;
     });
 
@@ -541,6 +550,12 @@ describe('Dropdown', () => {
         expect(groupDropdown.selectedOption.label).toEqual('Mercedes');
     });
 
+    it('should alternateGroup auto select with alternate children field', () => {
+      groupFixture.detectChanges();
+
+      expect(alternateGroupDropdown.selectedOption.label).toEqual('Audi')
+    });
+
     [null, undefined, ''].map((value) =>
         it('should return filled false when value is not provided', () => {
             dropdown.value = value;
@@ -549,4 +564,4 @@ describe('Dropdown', () => {
             expect(dropdown.filled).toBeFalsy();
         })
     );
-});
+});

src/app/components/dropdown/dropdown.ts

@@ -1017,7 +1017,7 @@ export class Dropdown implements OnInit, AfterViewInit, AfterContentInit, AfterV
 
         if (this.autoDisplayFirst && !this.placeholder && !this.selectedOption && this.optionsToDisplay && this.optionsToDisplay.length && !this.editable) {
             if (this.group) {
-                this.selectedOption = this.optionsToDisplay[0].items[0];
+                this.selectedOption = this.getOptionGroupChildren(this.optionsToDisplay[0])[0];
             } else {
                 this.selectedOption = this.optionsToDisplay[0];
             }