diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html index f53dfdc2ba..39a4113fd0 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html @@ -34,7 +34,7 @@ {{ tabbedFacet.label | translate }} - diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.spec.ts b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.spec.ts index 0bec9d2ea6..2563f8ff12 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.spec.ts @@ -142,6 +142,18 @@ describe('SearchFacetChipTabbedComponent', () => { expect(await icon.getName()).toBe('keyboard_arrow_up'); }); + it('should update isPopulated and call detectChanges on ChangeDetectorRef', () => { + spyOn(component['changeDetectorRef'], 'detectChanges').and.callThrough(); + + component.onIsPopulatedEventChange(true); + expect(component.isPopulated).toBe(true); + expect(component['changeDetectorRef'].detectChanges).toHaveBeenCalled(); + + component.onIsPopulatedEventChange(false); + expect(component.isPopulated).toBe(false); + expect(component['changeDetectorRef'].detectChanges).toHaveBeenCalledTimes(2); + }); + it('should update display value when new displayValue$ emitted', async () => { const displayValue = 'field_LABEL: test, test2'; const chip = await loader.getHarness(MatChipHarness); diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.ts b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.ts index 4a9e1aca66..f5516a1a82 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.ts @@ -15,17 +15,17 @@ * limitations under the License. */ -import { Component, ElementRef, Input, ViewChild, ViewEncapsulation } from '@angular/core'; +import { ChangeDetectorRef, Component, ElementRef, Input, ViewChild, ViewEncapsulation } from '@angular/core'; import { ConfigurableFocusTrap, ConfigurableFocusTrapFactory } from '@angular/cdk/a11y'; import { MatMenuTrigger } from '@angular/material/menu'; import { TabbedFacetField } from '../../../models/tabbed-facet-field.interface'; import { Subject } from 'rxjs'; @Component({ - selector: 'adf-search-facet-chip-tabbed', - templateUrl: './search-facet-chip-tabbed.component.html', - styleUrls: ['./search-facet-chip-tabbed.component.scss'], - encapsulation: ViewEncapsulation.None + selector: 'adf-search-facet-chip-tabbed', + templateUrl: './search-facet-chip-tabbed.component.html', + styleUrls: ['./search-facet-chip-tabbed.component.scss'], + encapsulation: ViewEncapsulation.None }) export class SearchFacetChipTabbedComponent { @Input() @@ -47,7 +47,7 @@ export class SearchFacetChipTabbedComponent { chipIcon = 'keyboard_arrow_down'; isPopulated = false; - constructor(private focusTrapFactory: ConfigurableFocusTrapFactory) {} + constructor(private focusTrapFactory: ConfigurableFocusTrapFactory, private changeDetectorRef: ChangeDetectorRef) {} onMenuOpen() { if (this.menuContainer && !this.focusTrap) { @@ -87,4 +87,8 @@ export class SearchFacetChipTabbedComponent { this.menuTrigger.closeMenu(); } } + onIsPopulatedEventChange(isPopulated: boolean): void { + this.isPopulated = isPopulated; + this.changeDetectorRef.detectChanges(); + } }