fix(tabs): Leak from undestroyed animations

Author: pmoleri

projects/igniteui-angular/src/lib/carousel/carousel-base.ts

@@ -81,6 +81,11 @@ export abstract class IgxCarouselComponentBase {
         protected cdr: ChangeDetectorRef) {
     }
 
+    public baseDestroy(): void {
+        this.enterAnimationPlayer?.destroy();
+        this.leaveAnimationPlayer?.destroy();
+    }
+
     /** @hidden */
     protected triggerAnimations() {
         if (this.animationType !== CarouselAnimationType.none) {
@@ -177,7 +182,7 @@ export abstract class IgxCarouselComponentBase {
         this.enterAnimationPlayer.animationEnd.subscribe(() => {
             // TODO: animation may never end. Find better way to clean up the player
             if (this.enterAnimationPlayer) {
-                this.enterAnimationPlayer.reset();
+                this.enterAnimationPlayer.destroy();
                 this.enterAnimationPlayer = null;
             }
             this.animationPosition = 0;
@@ -200,7 +205,7 @@ export abstract class IgxCarouselComponentBase {
         this.leaveAnimationPlayer.animationEnd.subscribe(() => {
             // TODO: animation may never end. Find better way to clean up the player
             if (this.leaveAnimationPlayer) {
-                this.leaveAnimationPlayer.reset();
+                this.leaveAnimationPlayer.destroy();
                 this.leaveAnimationPlayer = null;
             }
             this.animationPosition = 0;

projects/igniteui-angular/src/lib/carousel/carousel.component.ts

@@ -754,6 +754,7 @@ export class IgxCarouselComponent extends IgxCarouselComponentBase implements IC
 
     /** @hidden */
     public ngOnDestroy() {
+        super.baseDestroy();
         this.destroy$.next(true);
         this.destroy$.complete();
         this.destroyed = true;

projects/igniteui-angular/src/lib/stepper/stepper.component.ts

@@ -386,6 +386,7 @@ export class IgxStepperComponent extends IgxCarouselComponentBase implements Igx
 
     /** @hidden @internal */
     public ngOnDestroy(): void {
+        super.baseDestroy();
         this.destroy$.next();
         this.destroy$.complete();
     }

projects/igniteui-angular/src/lib/tabs/tabs.directive.ts

@@ -150,6 +150,7 @@ export abstract class IgxTabsDirective extends IgxCarouselComponentBase implemen
 
     /** @hidden */
     public ngOnDestroy(): void {
+        super.baseDestroy();
         if (this._itemChanges$) {
             this._itemChanges$.unsubscribe();
         }

projects/igniteui-angular/src/lib/tabs/tabs/tabs.component.spec.ts

@@ -29,7 +29,7 @@ const KEY_ENTER_EVENT = new KeyboardEvent('keydown', { key: 'Enter', bubbles: tr
 const KEY_SPACE_EVENT = new KeyboardEvent('keydown', { key: ' ', bubbles: true });
 
 describe('IgxTabs', () => {
-    configureTestSuite();
+    configureTestSuite({ checkLeaks: true });
 
     const tabItemNormalCssClass = 'igx-tabs__header-item';
     const tabItemSelectedCssClass = 'igx-tabs__header-item--selected';