test: ✅ 100% coverage (#26839)

* test: isStyleSupport

* test: 100% test coverage

components/_util/__tests__/util.test.js

@@ -3,38 +3,61 @@ import React from 'react';
 import { mount } from 'enzyme';
 import KeyCode from 'rc-util/lib/KeyCode';
 import delayRaf from '../raf';
-import throttleByAnimationFrame from '../throttleByAnimationFrame';
+import {
+  throttleByAnimationFrame,
+  throttleByAnimationFrameDecorator,
+} from '../throttleByAnimationFrame';
 import getDataOrAriaProps from '../getDataOrAriaProps';
 import Wave from '../wave';
 import TransButton from '../transButton';
+import { isStyleSupport, isFlexSupported } from '../styleChecker';
 import { sleep } from '../../../tests/utils';
 import focusTest from '../../../tests/shared/focusTest';
 
 describe('Test utils function', () => {
   focusTest(TransButton);
 
-  it('throttle function should work', async () => {
-    const callback = jest.fn();
-    const throttled = throttleByAnimationFrame(callback);
-    expect(callback).not.toHaveBeenCalled();
+  describe('throttle', () => {
+    it('throttle function should work', async () => {
+      const callback = jest.fn();
+      const throttled = throttleByAnimationFrame(callback);
+      expect(callback).not.toHaveBeenCalled();
 
-    throttled();
-    throttled();
-    await sleep(20);
+      throttled();
+      throttled();
+      await sleep(20);
 
-    expect(callback).toHaveBeenCalled();
-    expect(callback.mock.calls.length).toBe(1);
-  });
+      expect(callback).toHaveBeenCalled();
+      expect(callback.mock.calls.length).toBe(1);
+    });
+
+    it('throttle function should be canceled', async () => {
+      const callback = jest.fn();
+      const throttled = throttleByAnimationFrame(callback);
 
-  it('throttle function should be canceled', async () => {
-    const callback = jest.fn();
-    const throttled = throttleByAnimationFrame(callback);
+      throttled();
+      throttled.cancel();
+      await sleep(20);
 
-    throttled();
-    throttled.cancel();
-    await sleep(20);
+      expect(callback).not.toHaveBeenCalled();
+    });
 
-    expect(callback).not.toHaveBeenCalled();
+    it('throttleByAnimationFrameDecorator should works', async () => {
+      const callbackFn = jest.fn();
+      class Test {
+        @throttleByAnimationFrameDecorator()
+        // eslint-disable-next-line class-methods-use-this
+        callback() {
+          callbackFn();
+        }
+      }
+      const test = new Test();
+      test.callback();
+      test.callback();
+      test.callback();
+      await sleep(30);
+      expect(callbackFn).toHaveBeenCalledTimes(1);
+    });
   });
 
   describe('getDataOrAriaProps', () => {
@@ -185,4 +208,24 @@ describe('Test utils function', () => {
       expect(preventDefault).toHaveBeenCalled();
     });
   });
+
+  describe('style', () => {
+    it('isFlexSupported', () => {
+      expect(isFlexSupported).toBe(true);
+    });
+
+    it('isStyleSupport', () => {
+      expect(isStyleSupport('color')).toBe(true);
+      expect(isStyleSupport('not-existed')).toBe(false);
+    });
+
+    it('isStyleSupport return false in service side', () => {
+      const spy = jest
+        .spyOn(window.document, 'documentElement', 'get')
+        .mockImplementation(() => undefined);
+      expect(isStyleSupport('color')).toBe(false);
+      expect(isStyleSupport('not-existed')).toBe(false);
+      spy.mockRestore();
+    });
+  });
 });

components/_util/styleChecker.tsx

-const isStyleSupport = (styleName: string | Array<string>): boolean => {
+export const isStyleSupport = (styleName: string | Array<string>): boolean => {
   if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
     const styleNameList = Array.isArray(styleName) ? styleName : [styleName];
     const { documentElement } = window.document;
@@ -9,5 +9,3 @@ const isStyleSupport = (styleName: string | Array<string>): boolean => {
 };
 
 export const isFlexSupported = isStyleSupport(['flex', 'webkitFlex', 'Flex', 'msFlex']);
-
-export default isStyleSupport;

components/_util/throttleByAnimationFrame.tsx

 import raf from 'raf';
 
-export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
+export function throttleByAnimationFrame(fn: (...args: any[]) => void) {
   let requestId: number | null;
 
   const later = (args: any[]) => () => {
@@ -20,15 +20,18 @@ export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
 }
 
 export function throttleByAnimationFrameDecorator() {
-  // eslint-disable-next-line func-names
-  return function(target: any, key: string, descriptor: any) {
+  return function throttle(target: any, key: string, descriptor: any) {
     const fn = descriptor.value;
     let definingProperty = false;
     return {
       configurable: true,
       get() {
+        // In IE11 calling Object.defineProperty has a side-effect of evaluating the
+        // getter for the property which is being replaced. This causes infinite
+        // recursion and an "Out of stack space" error.
         // eslint-disable-next-line no-prototype-builtins
         if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
+          /* istanbul ignore next */
           return fn;
         }
 

components/_util/wave.tsx

@@ -174,7 +174,6 @@ export default class Wave extends React.Component<{ insertExtraNode?: boolean }>
 
   resetEffect(node: HTMLElement) {
     if (!node || node === this.extraNode || !(node instanceof Element)) {
-      /* istanbul ignore next */
       return;
     }
     const { insertExtraNode } = this.props;

components/back-top/index.tsx

@@ -4,7 +4,7 @@ import addEventListener from 'rc-util/lib/Dom/addEventListener';
 import classNames from 'classnames';
 import omit from 'omit.js';
 import VerticalAlignTopOutlined from '@ant-design/icons/VerticalAlignTopOutlined';
-import throttleByAnimationFrame from '../_util/throttleByAnimationFrame';
+import { throttleByAnimationFrame } from '../_util/throttleByAnimationFrame';
 import { ConfigContext } from '../config-provider';
 import getScroll from '../_util/getScroll';
 import scrollTo from '../_util/scrollTo';

components/button/__tests__/wave.test.tsx

@@ -84,4 +84,10 @@ describe('click wave effect', () => {
     expect(resetEffect).toHaveBeenCalledTimes(2);
     resetEffect.mockRestore();
   });
+
+  it('Wave on falsy element', async () => {
+    const wrapper = mount(<Wave />);
+    const waveInstance = wrapper.find(Wave).instance() as any;
+    waveInstance.resetEffect();
+  });
 });

components/typography/Base.tsx

@@ -14,7 +14,7 @@ import LocaleReceiver from '../locale-provider/LocaleReceiver';
 import devWarning from '../_util/devWarning';
 import TransButton from '../_util/transButton';
 import raf from '../_util/raf';
-import isStyleSupport from '../_util/styleChecker';
+import { isStyleSupport } from '../_util/styleChecker';
 import Tooltip from '../tooltip';
 import Typography, { TypographyProps } from './Typography';
 import Editable from './Editable';