inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

AAE-4879 Deatach tooltip card when directive is destroyed (#6939)

Browse Source
This commit is contained in:
Pablo Martinez Garcia
2021-04-20 10:21:22 +02:00
committed by GitHub
parent aed2208205
commit d37608111a
2 changed files with 19 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
lib/core/directives/tooltip-card/tooltip-card.directive.spec.ts
View File

@@ -96,4 +96,17 @@ describe('TooltipCardDirective', () => {
tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card'); tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card');
expect(tooltipCard).toBeNull(); expect(tooltipCard).toBeNull();
}); });
it('should hide tooltip-card on destroy', () => {
const span = fixture.debugElement.query(By.css('span.test-component'));
span.triggerEventHandler('mouseenter', {});
fixture.detectChanges();
let tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card');
expect(tooltipCard).not.toBeNull();
fixture.componentInstance.directive.ngOnDestroy();
fixture.detectChanges();
tooltipCard = overlay.querySelector<HTMLElement>('div.adf-tooltip-card');
expect(tooltipCard).toBeNull();
});
}); });

8
lib/core/directives/tooltip-card/tooltip-card.directive.ts
View File

@@ -14,13 +14,13 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
import { ComponentRef, Directive, ElementRef, HostListener, Input, OnInit } from '@angular/core'; import { ComponentRef, Directive, ElementRef, HostListener, Input, OnDestroy, OnInit } from '@angular/core';
import { Overlay, OverlayPositionBuilder, OverlayRef } from '@angular/cdk/overlay'; import { Overlay, OverlayPositionBuilder, OverlayRef } from '@angular/cdk/overlay';
import { ComponentPortal } from '@angular/cdk/portal'; import { ComponentPortal } from '@angular/cdk/portal';
import { TooltipCardComponent } from './tooltip-card.component'; import { TooltipCardComponent } from './tooltip-card.component';
@Directive({ selector: '[adf-tooltip-card]' }) @Directive({ selector: '[adf-tooltip-card]' })
export class TooltipCardDirective implements OnInit { export class TooltipCardDirective implements OnInit, OnDestroy {
@Input('adf-tooltip-card') text = ''; @Input('adf-tooltip-card') text = '';
@Input() image = ''; @Input() image = '';
@@ -41,6 +41,10 @@ export class TooltipCardDirective implements OnInit {
private elementRef: ElementRef) { private elementRef: ElementRef) {
} }
ngOnDestroy(): void {
this.hide();
}
ngOnInit(): void { ngOnInit(): void {
const positionStrategy = this.overlayPositionBuilder const positionStrategy = this.overlayPositionBuilder
.flexibleConnectedTo(this.elementRef) .flexibleConnectedTo(this.elementRef)