test(tooltip): Splits unit tests for destroy into multiple methods to ensure cancellation of all potential timeouts and removal of all potential event handlers. Smaller methods also make code more readable and easier to maintain.

PiperOrigin-RevId: 346363503

Author: Shi Shu

packages/mdc-tooltip/test/foundation.test.ts

@@ -33,6 +33,9 @@ const ESC_EVENTS = [
   {type: 'keydown', keyCode: 27, target: {}},
 ];
 
+// Constant for the animationFrame mock found in setUpMdcTestEnvironment
+const ANIMATION_FRAME = 1;
+
 // This function assumes that the foundation has already been initialized for
 // rich tooltips. If isRich and isPersistent have not been initialized, the
 // checks for rich tooltip and persistent rich tooltips will not be called. This
@@ -1229,27 +1232,93 @@ describe('MDCTooltipFoundation', () => {
            .toHaveBeenCalledWith('top', `${expectedTooltipTop}px`);
      });
 
-  it('#destroy cancels any pending callbacks, removes global event listeners, and removes all tooltip animation classes',
+  it('#destroy clears showTimeout', () => {
+    const {foundation} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.handleAnchorMouseEnter();
+    foundation.destroy();
+
+    expect(foundation.showTimeout).toEqual(null);
+  });
+
+  it('#destroy clears requestAnimationFrame from show', () => {
+    const {foundation, mockAdapter} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.show();
+    expect(foundation['frameId']).not.toEqual(null);
+    foundation.destroy();
+    jasmine.clock().tick(ANIMATION_FRAME);
+
+    expect(foundation['frameId']).toEqual(null);
+    expect(mockAdapter.removeClass)
+        .toHaveBeenCalledWith(CssClasses.SHOWING_TRANSITION);
+    expect(mockAdapter.removeClass)
+        .toHaveBeenCalledWith(CssClasses.HIDE_TRANSITION);
+    // 1 call from show and 5 calls from destroy
+    expect(mockAdapter.removeClass).toHaveBeenCalledTimes(6);
+    expect(mockAdapter.addClass).not.toHaveBeenCalledWith(CssClasses.SHOWN);
+    expect(mockAdapter.addClass)
+        .not.toHaveBeenCalledWith(CssClasses.SHOWING_TRANSITION);
+  });
+
+  it('#destroy clears hideTimeout', () => {
+    const {foundation} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.handleAnchorMouseLeave();
+    foundation.destroy();
+
+    expect(foundation.hideTimeout).toEqual(null);
+  });
+
+  it('#destroy removes tooltip classes', () => {
+    const {foundation, mockAdapter} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.destroy();
+
+    expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.SHOWN);
+    expect(mockAdapter.removeClass)
+        .toHaveBeenCalledWith(CssClasses.SHOWING_TRANSITION);
+    expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.SHOWING);
+    expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.HIDE);
+    expect(mockAdapter.removeClass)
+        .toHaveBeenCalledWith(CssClasses.HIDE_TRANSITION);
+  });
+
+  it('#destroy cancels all animation frame requests', () => {
+    const {foundation} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.handleWindowChangeEvent();
+    foundation.destroy();
+
+    expect(foundation['animFrame']['rafIDs'].size).toEqual(0);
+  });
+
+  it('#destroy removes the event listeners for plain tooltips', () => {
+    const {foundation, mockAdapter} = setUpFoundationTest(MDCTooltipFoundation);
+
+    foundation.destroy();
+
+    expect(mockAdapter.deregisterEventHandler)
+        .not.toHaveBeenCalledWith('mouseenter', jasmine.any(Function));
+    expect(mockAdapter.deregisterEventHandler)
+        .not.toHaveBeenCalledWith('mouseleave', jasmine.any(Function));
+    expect(mockAdapter.deregisterDocumentEventHandler)
+        .toHaveBeenCalledWith('click', jasmine.any(Function));
+    expect(mockAdapter.deregisterDocumentEventHandler)
+        .toHaveBeenCalledWith('keydown', jasmine.any(Function));
+    expect(mockAdapter.deregisterWindowEventHandler)
+        .toHaveBeenCalledWith('scroll', jasmine.any(Function));
+    expect(mockAdapter.deregisterWindowEventHandler)
+        .toHaveBeenCalledWith('resize', jasmine.any(Function));
+  });
+
+  it('#destroy removes the event listeners for default rich tooltips',
      () => {
        const {foundation, mockAdapter} =
-           setUpFoundationTest(MDCTooltipFoundation);
-       mockAdapter.hasClass.withArgs(CssClasses.RICH).and.returnValue(true);
-       foundation.init();
-       foundation.handleAnchorMouseEnter();
-       foundation.handleAnchorMouseLeave();
-       foundation.destroy();
+           setUpFoundationTestForRichTooltip(MDCTooltipFoundation);
 
-       jasmine.clock().tick(1);
-       expect(mockAdapter.addClass).not.toHaveBeenCalledWith(CssClasses.SHOWN);
-       expect(mockAdapter.addClass)
-           .not.toHaveBeenCalledWith(CssClasses.SHOWING_TRANSITION);
-       expect(foundation.hideTimeout).toEqual(null);
+       foundation.destroy();
 
-       expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.SHOWN);
-       expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.SHOWING);
-       expect(mockAdapter.removeClass).toHaveBeenCalledWith(CssClasses.HIDE);
-       expect(mockAdapter.removeClass)
-           .toHaveBeenCalledWith(CssClasses.HIDE_TRANSITION);
        expect(mockAdapter.deregisterEventHandler)
            .toHaveBeenCalledWith('mouseenter', jasmine.any(Function));
        expect(mockAdapter.deregisterEventHandler)
@@ -1264,6 +1333,27 @@ describe('MDCTooltipFoundation', () => {
            .toHaveBeenCalledWith('resize', jasmine.any(Function));
      });
 
+  it('#destroy removes the event listeners for persistent rich tooltips',
+     () => {
+       const {foundation, mockAdapter} = setUpFoundationTestForRichTooltip(
+           MDCTooltipFoundation, {isPersistent: true});
+
+       foundation.destroy();
+
+       expect(mockAdapter.deregisterEventHandler)
+           .not.toHaveBeenCalledWith('mouseenter', jasmine.any(Function));
+       expect(mockAdapter.deregisterEventHandler)
+           .not.toHaveBeenCalledWith('mouseleave', jasmine.any(Function));
+       expect(mockAdapter.deregisterDocumentEventHandler)
+           .toHaveBeenCalledWith('click', jasmine.any(Function));
+       expect(mockAdapter.deregisterDocumentEventHandler)
+           .toHaveBeenCalledWith('keydown', jasmine.any(Function));
+       expect(mockAdapter.deregisterWindowEventHandler)
+           .toHaveBeenCalledWith('scroll', jasmine.any(Function));
+       expect(mockAdapter.deregisterWindowEventHandler)
+           .toHaveBeenCalledWith('resize', jasmine.any(Function));
+     });
+
   it('recalculates position of tooltip if anchor position changes', () => {
     const anchorBoundingRect =
         {top: 0, bottom: 35, left: 0, right: 200, width: 200, height: 35};