Feat/y

components/__tests__/__snapshots__/index.test.ts.snap

@@ -0,0 +1,73 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`antd exports modules correctly 1`] = `
+[
+  "Affix",
+  "Alert",
+  "Anchor",
+  "AutoComplete",
+  "Avatar",
+  "BackTop",
+  "Badge",
+  "Breadcrumb",
+  "Button",
+  "Calendar",
+  "Card",
+  "Carousel",
+  "Cascader",
+  "Checkbox",
+  "Col",
+  "Collapse",
+  "Comment",
+  "ConfigProvider",
+  "DatePicker",
+  "Descriptions",
+  "Divider",
+  "Drawer",
+  "Dropdown",
+  "Empty",
+  "Form",
+  "Grid",
+  "Image",
+  "Input",
+  "InputNumber",
+  "Layout",
+  "List",
+  "Mentions",
+  "Menu",
+  "Modal",
+  "PageHeader",
+  "Pagination",
+  "Popconfirm",
+  "Popover",
+  "Progress",
+  "Radio",
+  "Rate",
+  "Result",
+  "Row",
+  "Segmented",
+  "Select",
+  "Skeleton",
+  "Slider",
+  "Space",
+  "Spin",
+  "Statistic",
+  "Steps",
+  "Switch",
+  "Table",
+  "Tabs",
+  "Tag",
+  "TimePicker",
+  "Timeline",
+  "Tooltip",
+  "Transfer",
+  "Tree",
+  "TreeSelect",
+  "Typography",
+  "Upload",
+  "message",
+  "notification",
+  "theme",
+  "version",
+]
+`;

components/__tests__/index.test.ts

@@ -0,0 +1,21 @@
+const OLD_NODE_ENV = process.env.NODE_ENV;
+process.env.NODE_ENV = 'development';
+const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+const antd = require('..');
+
+describe('antd', () => {
+  afterAll(() => {
+    process.env.NODE_ENV = OLD_NODE_ENV;
+  });
+
+  it('exports modules correctly', () => {
+    expect(Object.keys(antd)).toMatchSnapshot();
+  });
+
+  it('should hint when import all components in dev mode', () => {
+    expect(warnSpy).toHaveBeenCalledWith(
+      'You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.',
+    );
+    warnSpy.mockRestore();
+  });
+});

components/__tests__/node.test.tsx

@@ -0,0 +1,48 @@
+import glob from 'glob';
+import * as React from 'react';
+import { renderToString } from 'react-dom/server';
+import type { Options } from '../../tests/shared/demoTest';
+
+(global as any).testConfig = {};
+
+jest.mock('../../tests/shared/demoTest', () => {
+  function fakeDemoTest(name: string, option: Options = {}) {
+    (global as any).testConfig[name] = option;
+  }
+
+  return fakeDemoTest;
+});
+
+describe('node', () => {
+  beforeAll(() => {
+    jest.useFakeTimers().setSystemTime(new Date('2016-11-22'));
+  });
+
+  // Find the component exist demo test file
+  const files = glob.sync(`./components/*/__tests__/demo.test.@(j|t)s?(x)`);
+
+  files.forEach(componentTestFile => {
+    const componentName = componentTestFile.match(/components\/([^/]*)\//)![1];
+
+    // Test for ssr
+    describe(componentName, () => {
+      const demoList = glob.sync(`./components/${componentName}/demo/*.md`);
+
+      // Use mock to get config
+      require(`../../${componentTestFile}`); // eslint-disable-line global-require, import/no-dynamic-require
+      const option = (global as any).testConfig?.[componentName];
+
+      demoList.forEach(demoFile => {
+        const skip: string[] = option?.skip || [];
+        const test = skip.some(skipMarkdown => demoFile.includes(skipMarkdown)) ? it.skip : it;
+
+        test(demoFile, () => {
+          const Demo = require(`../../${demoFile}`).default; // eslint-disable-line global-require, import/no-dynamic-require
+          expect(() => {
+            renderToString(<Demo />);
+          }).not.toThrow();
+        });
+      });
+    });
+  });
+});

components/_util/ActionButton.tsx

@@ -0,0 +1,113 @@
+import useState from 'rc-util/lib/hooks/useState';
+import * as React from 'react';
+import Button from '../button';
+import type { ButtonProps, LegacyButtonType } from '../button/button';
+import { convertLegacyProps } from '../button/button';
+
+export interface ActionButtonProps {
+  type?: LegacyButtonType;
+  actionFn?: (...args: any[]) => any | PromiseLike<any>;
+  close?: Function;
+  autoFocus?: boolean;
+  prefixCls: string;
+  buttonProps?: ButtonProps;
+  emitEvent?: boolean;
+  quitOnNullishReturnValue?: boolean;
+  children?: React.ReactNode;
+}
+
+function isThenable(thing?: PromiseLike<any>): boolean {
+  return !!(thing && !!thing.then);
+}
+
+const ActionButton: React.FC<ActionButtonProps> = (props) => {
+  const clickedRef = React.useRef<boolean>(false);
+  const ref = React.useRef<HTMLInputElement>(null);
+  const [loading, setLoading] = useState<ButtonProps['loading']>(false);
+  const { close } = props;
+  const onInternalClose = (...args: any[]) => {
+    close?.(...args);
+  };
+
+  React.useEffect(() => {
+    let timeoutId: ReturnType<typeof setTimeout> | null = null;
+    if (props.autoFocus) {
+      timeoutId = setTimeout(() => {
+        ref.current?.focus();
+      });
+    }
+    return () => {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+      }
+    };
+  }, []);
+
+  const handlePromiseOnOk = (returnValueOfOnOk?: PromiseLike<any>) => {
+    if (!isThenable(returnValueOfOnOk)) {
+      return;
+    }
+    setLoading(true);
+    returnValueOfOnOk!.then(
+      (...args: any[]) => {
+        setLoading(false, true);
+        onInternalClose(...args);
+        clickedRef.current = false;
+      },
+      (e: Error) => {
+        // See: https://github.com/ant-design/ant-design/issues/6183
+        setLoading(false, true);
+        clickedRef.current = false;
+        return Promise.reject(e);
+      },
+    );
+  };
+
+  const onClick = (e: React.MouseEvent<HTMLButtonElement>) => {
+    const { actionFn } = props;
+    if (clickedRef.current) {
+      return;
+    }
+    clickedRef.current = true;
+    if (!actionFn) {
+      onInternalClose();
+      return;
+    }
+    let returnValueOfOnOk;
+    if (props.emitEvent) {
+      returnValueOfOnOk = actionFn(e);
+      if (props.quitOnNullishReturnValue && !isThenable(returnValueOfOnOk)) {
+        clickedRef.current = false;
+        onInternalClose(e);
+        return;
+      }
+    } else if (actionFn.length) {
+      returnValueOfOnOk = actionFn(close);
+      // https://github.com/ant-design/ant-design/issues/23358
+      clickedRef.current = false;
+    } else {
+      returnValueOfOnOk = actionFn();
+      if (!returnValueOfOnOk) {
+        onInternalClose();
+        return;
+      }
+    }
+    handlePromiseOnOk(returnValueOfOnOk);
+  };
+
+  const { type, children, prefixCls, buttonProps } = props;
+  return (
+    <Button
+      {...convertLegacyProps(type)}
+      onClick={onClick}
+      loading={loading}
+      prefixCls={prefixCls}
+      {...buttonProps}
+      ref={ref}
+    >
+      {children}
+    </Button>
+  );
+};
+
+export default ActionButton;

components/_util/__tests__/easings.test.ts

@@ -0,0 +1,12 @@
+import { easeInOutCubic } from '../easings';
+
+describe('Test easings', () => {
+  it('easeInOutCubic return value', () => {
+    const nums: number[] = [];
+    for (let index = 0; index < 5; index++) {
+      nums.push(easeInOutCubic(index, 1, 5, 4));
+    }
+
+    expect(nums).toEqual([1, 1.25, 3, 4.75, 5]);
+  });
+});

components/_util/__tests__/getScroll.test.ts

@@ -0,0 +1,57 @@
+import getScroll from '../getScroll';
+
+describe('getScroll', () => {
+  it('getScroll target null', async () => {
+    expect(getScroll(null, true)).toBe(0);
+    expect(getScroll(null, false)).toBe(0);
+  });
+
+  it('getScroll window', async () => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+      window.pageXOffset = x;
+      window.pageYOffset = y;
+    });
+    window.scrollTo(200, 400);
+    expect(getScroll(window, true)).toBe(400);
+    expect(getScroll(window, false)).toBe(200);
+    scrollToSpy.mockRestore();
+  });
+
+  it('getScroll document', async () => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+      document.documentElement.scrollLeft = x;
+      document.documentElement.scrollTop = y;
+    });
+    window.scrollTo(200, 400);
+    expect(getScroll(document, true)).toBe(400);
+    expect(getScroll(document, false)).toBe(200);
+    scrollToSpy.mockRestore();
+  });
+
+  it('getScroll div', async () => {
+    const div = document.createElement('div');
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+      div.scrollLeft = x;
+      div.scrollTop = y;
+    });
+    window.scrollTo(200, 400);
+    expect(getScroll(div, true)).toBe(400);
+    expect(getScroll(div, false)).toBe(200);
+    scrollToSpy.mockRestore();
+  });
+
+  it('getScroll documentElement', async () => {
+    const div: any = {};
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+      div.scrollLeft = null;
+      div.scrollTop = null;
+      div.documentElement = {};
+      div.documentElement.scrollLeft = x;
+      div.documentElement.scrollTop = y;
+    });
+    window.scrollTo(200, 400);
+    expect(getScroll(div, true)).toBe(400);
+    expect(getScroll(div, false)).toBe(200);
+    scrollToSpy.mockRestore();
+  });
+});

components/_util/__tests__/getScrollNode.test.ts

@@ -0,0 +1,9 @@
+/** @jest-environment node */
+import getScroll from '../getScroll';
+
+describe('getScroll node', () => {
+  it('getScroll return 0 in node environment', async () => {
+    expect(getScroll(null, true)).toBe(0);
+    expect(getScroll(null, false)).toBe(0);
+  });
+});

components/_util/__tests__/reactNode.test.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { isValidElement, cloneElement, isFragment, replaceElement } from '../reactNode';
+
+describe('reactNode test', () => {
+  it('isValidElement', () => {
+    expect(isValidElement(null)).toBe(false);
+    expect(isValidElement(<p>test</p>)).toBe(true);
+  });
+  it('isFragment', () => {
+    expect(isFragment(<p>test</p>)).toBe(false);
+    expect(isFragment(<>test</>)).toBe(true);
+  });
+  it('replaceElement', () => {
+    const node = <p>test</p>;
+    expect(replaceElement(null, node)).toBe(node);
+    expect(replaceElement(node, node)).toStrictEqual(node);
+  });
+  it('cloneElement', () => {
+    const node = <p>test</p>;
+    expect(cloneElement(null)).toBe(null);
+    expect(cloneElement(node)).toStrictEqual(node);
+  });
+});

components/_util/__tests__/responsiveObserve.test.ts

@@ -0,0 +1,14 @@
+import ResponsiveObserve, { responsiveMap } from '../responsiveObserve';
+
+describe('Test ResponsiveObserve', () => {
+  it('test ResponsiveObserve subscribe and unsubscribe', () => {
+    const { xs } = responsiveMap;
+    const subscribeFunc = jest.fn();
+    const token = ResponsiveObserve.subscribe(subscribeFunc);
+    expect(ResponsiveObserve.matchHandlers[xs].mql.matches).toBeTruthy();
+    expect(subscribeFunc).toHaveBeenCalledTimes(1);
+
+    ResponsiveObserve.unsubscribe(token);
+    expect(ResponsiveObserve.matchHandlers[xs].mql.removeListener).toHaveBeenCalled();
+  });
+});