Revert "chore: migrate to vitest (#42506)" (#42900)

This reverts commit 6759887c44.

.eslintignore

@@ -21,3 +21,4 @@ coverage
 **/*.d.ts
 # Scripts
 scripts/previewEditor/**/*
+jest-stare

.eslintrc.js

@@ -3,7 +3,7 @@ module.exports = {
     'airbnb',
     'prettier',
     'plugin:compat/recommended',
-    'plugin:vitest/recommended',
+    'plugin:jest/recommended',
     'plugin:react/recommended',
     'plugin:import/typescript',
     'plugin:markdown/recommended',
@@ -12,6 +12,7 @@ module.exports = {
     browser: true,
     node: true,
     jasmine: true,
+    jest: true,
     es6: true,
   },
   settings: {
@@ -24,15 +25,7 @@ module.exports = {
     },
   },
   parser: '@typescript-eslint/parser',
-  plugins: [
+  plugins: ['react', '@babel', 'jest', '@typescript-eslint', 'react-hooks', 'unicorn', 'markdown'],
-    'react',
-    '@babel',
-    'vitest',
-    '@typescript-eslint',
-    'react-hooks',
-    'unicorn',
-    'markdown',
-  ],
   // https://github.com/typescript-eslint/typescript-eslint/issues/46#issuecomment-470486034
   overrides: [
     {
@@ -159,10 +152,8 @@ module.exports = {
           'scripts/**',
           '**/*.test.js',
           '**/__tests__/*',
-          '__mocks__/**',
           '*.config.js',
           '**/*.md',
-          'vitest*config.ts',
         ],
       },
     ],
@@ -188,12 +179,12 @@ module.exports = {
     'no-restricted-globals': 0,
     'max-classes-per-file': 0,
 
-    'vitest/prefer-to-be': 0,
+    'jest/no-test-callback': 0,
-    'vitest/expect-expect': 0,
+    'jest/expect-expect': 0,
-    'vitest/no-done-callback': 0,
+    'jest/no-done-callback': 0,
-    'vitest/valid-title': 0,
+    'jest/valid-title': 0,
-    'vitest/no-conditional-expect': 0,
+    'jest/no-conditional-expect': 0,
-    'vitest/no-standalone-expect': 0,
+    'jest/no-standalone-expect': 0,
 
     'unicorn/better-regex': 2,
     'unicorn/prefer-string-trim-start-end': 2,

.github/workflows/test.yml

@@ -191,7 +191,7 @@ jobs:
       # dom test
       - name: dom test
         if: ${{ matrix.module == 'dom' }}
-        run: npm test -- --shard=${{matrix.shard}} --coverage
+        run: npm test -- --maxWorkers=2 --shard=${{matrix.shard}} --coverage
 
       - name: persist coverages
         if: ${{ matrix.module == 'dom' && matrix.react == '17' }}
@@ -347,7 +347,7 @@ jobs:
       - name: test
         # lib only run in master branch not in pull request
         if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        run: npm test -- --shard=${{matrix.shard}}
+        run: npm test -- --maxWorkers=2 --shard=${{matrix.shard}}
         env:
           LIB_DIR: ${{ matrix.module }}
     needs: compile

.gitignore

@@ -58,6 +58,7 @@ components/version/token-meta.json
 # Image snapshot diff
 __diff_output__/
 __image_snapshots__/
+/jest-stare
 /imageSnapshots
 /imageDiffSnapshots
 

.jest.image.js

@@ -0,0 +1,23 @@
+const { moduleNameMapper, transformIgnorePatterns } = require('./.jest');
+
+// jest config for image snapshots
+module.exports = {
+  setupFiles: ['./tests/setup.js'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'md'],
+  moduleNameMapper,
+  transform: {
+    '\\.tsx?$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.js$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.md$': './node_modules/@ant-design/tools/lib/jest/demoPreprocessor',
+    '\\.(jpg|png|gif|svg)$': './node_modules/@ant-design/tools/lib/jest/imagePreprocessor',
+  },
+  testRegex: 'image\\.test\\.(j|t)s$',
+  transformIgnorePatterns,
+  globals: {
+    'ts-jest': {
+      tsConfigFile: './tsconfig.test.json',
+    },
+  },
+  preset: 'jest-puppeteer',
+  testTimeout: 10000,
+};

.jest.js

@@ -0,0 +1,68 @@
+const compileModules = ['react-sticky-box', 'rc-tween-one', '@babel', '@ant-design', 'countup.js'];
+
+const ignoreList = [];
+
+// cnpm use `_` as prefix
+['', '_'].forEach((prefix) => {
+  compileModules.forEach((module) => {
+    ignoreList.push(`${prefix}${module}`);
+  });
+});
+
+const transformIgnorePatterns = [
+  // Ignore modules without es dir.
+  // Update: @babel/runtime should also be transformed
+  `/node_modules/(?!${ignoreList.join('|')})[^/]+?/(?!(es)/)`,
+];
+
+function getTestRegex(libDir) {
+  if (['dist', 'lib', 'es'].includes(libDir)) {
+    return 'demo\\.test\\.(j|t)sx?$';
+  }
+  return '.*\\.test\\.(j|t)sx?$';
+}
+
+module.exports = {
+  verbose: true,
+  testEnvironment: 'jsdom',
+  setupFiles: ['./tests/setup.js', 'jest-canvas-mock'],
+  setupFilesAfterEnv: ['./tests/setupAfterEnv.ts'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'md'],
+  modulePathIgnorePatterns: ['/_site/'],
+  moduleNameMapper: {
+    '/\\.(css|less)$/': 'identity-obj-proxy',
+    '^antd$': '<rootDir>/components/index',
+    '^antd/es/(.*)$': '<rootDir>/components/$1',
+  },
+  testPathIgnorePatterns: ['/node_modules/', 'dekko', 'node', 'image.test.js', 'image.test.ts'],
+  transform: {
+    '\\.tsx?$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.(m?)js$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.md$': './node_modules/@ant-design/tools/lib/jest/demoPreprocessor',
+    '\\.(jpg|png|gif|svg)$': './node_modules/@ant-design/tools/lib/jest/imagePreprocessor',
+  },
+  testRegex: getTestRegex(process.env.LIB_DIR),
+  collectCoverageFrom: [
+    'components/**/*.{ts,tsx}',
+    '!components/*/style/index.tsx',
+    '!components/style/index.tsx',
+    '!components/*/locale/index.tsx',
+    '!components/*/__tests__/type.test.tsx',
+    '!components/**/*/interface.{ts,tsx}',
+    '!components/*/__tests__/image.test.{ts,tsx}',
+    '!components/__tests__/node.test.tsx',
+    '!components/*/demo/*.tsx',
+    '!components/*/design/**',
+  ],
+  transformIgnorePatterns,
+  globals: {
+    'ts-jest': {
+      tsConfig: './tsconfig.test.json',
+    },
+  },
+  testEnvironmentOptions: {
+    url: 'http://localhost',
+  },
+  // bail: true,
+  maxWorkers: '50%',
+};

.jest.node.js

@@ -0,0 +1,19 @@
+const { moduleNameMapper, transformIgnorePatterns } = require('./.jest');
+
+// jest config for server render environment
+module.exports = {
+  setupFiles: ['./tests/setup.js'],
+  setupFilesAfterEnv: ['./tests/setupAfterEnv.ts'],
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'md'],
+  moduleNameMapper,
+  transform: {
+    '\\.tsx?$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.js$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.md$': './node_modules/@ant-design/tools/lib/jest/demoPreprocessor',
+    '\\.(jpg|png|gif|svg)$': './node_modules/@ant-design/tools/lib/jest/imagePreprocessor',
+  },
+  testRegex: 'node\\.test\\.(j|t)sx$',
+  testEnvironment: 'node',
+  transformIgnorePatterns,
+  // bail: true,
+};

.jest.site.js

@@ -0,0 +1,21 @@
+const { moduleNameMapper, transformIgnorePatterns } = require('./.jest');
+
+// jest config for server render environment
+module.exports = {
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'md'],
+  moduleNameMapper,
+  transform: {
+    '\\.tsx?$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.js$': './node_modules/@ant-design/tools/lib/jest/codePreprocessor',
+    '\\.md$': './node_modules/@ant-design/tools/lib/jest/demoPreprocessor',
+    '\\.(jpg|png|gif|svg)$': './node_modules/@ant-design/tools/lib/jest/imagePreprocessor',
+  },
+  testRegex: 'check-site\\.(j|t)s$',
+  testEnvironment: 'node',
+  transformIgnorePatterns,
+  globals: {
+    'ts-jest': {
+      tsConfigFile: './tsconfig.test.json',
+    },
+  },
+};

__mocks__/rc-virtual-list.ts

@@ -1,3 +0,0 @@
-import Mock from 'rc-virtual-list/es/mock';
-
-export default Mock;

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

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`antd > exports modules correctly 1`] = `
+exports[`antd exports modules correctly 1`] = `
 [
   "Affix",
   "Alert",
@@ -37,9 +37,7 @@ exports[`antd > exports modules correctly 1`] = `
   "List",
   "Mentions",
   "Menu",
-  "message",
   "Modal",
-  "notification",
   "Pagination",
   "Popconfirm",
   "Popover",
@@ -61,7 +59,6 @@ exports[`antd > exports modules correctly 1`] = `
   "Table",
   "Tabs",
   "Tag",
-  "theme",
   "TimePicker",
   "Timeline",
   "Tooltip",
@@ -71,7 +68,10 @@ exports[`antd > exports modules correctly 1`] = `
   "TreeSelect",
   "Typography",
   "Upload",
-  "version",
   "Watermark",
+  "message",
+  "notification",
+  "theme",
+  "version",
 ]
 `;

components/__tests__/__snapshots__/setup.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`SetUp.Test > diff of React 18 & React 17 1`] = `
+exports[`SetUp.Test diff of React 18 & React 17 1`] = `
 NodeList [
   <div>
   bamboo

components/__tests__/index.test.ts

@@ -1,7 +1,6 @@
-import * as antd from '..';
-
 const OLD_NODE_ENV = process.env.NODE_ENV;
 process.env.NODE_ENV = 'development';
+const antd = require('..');
 
 describe('antd', () => {
   afterAll(() => {

components/__tests__/node.test.tsx

@@ -3,24 +3,21 @@ import * as React from 'react';
 import { renderToString } from 'react-dom/server';
 import type { Options } from '../../tests/shared/demoTest';
 
-globalThis.testConfig = {};
+(global as any).testConfig = {};
 
-vi.mock('../../tests/shared/demoTest', () => {
+jest.mock('../../tests/shared/demoTest', () => {
   function fakeDemoTest(name: string, option: Options = {}) {
-    globalThis.testConfig[name] = option;
+    (global as any).testConfig[name] = option;
   }
 
   fakeDemoTest.rootPropsTest = () => {};
 
-  return {
+  return fakeDemoTest;
-    default: fakeDemoTest,
-    rootPropsTest: () => {},
-  };
 });
 
 describe('node', () => {
   beforeAll(() => {
-    vi.useFakeTimers().setSystemTime(new Date('2016-11-22'));
+    jest.useFakeTimers().setSystemTime(new Date('2016-11-22'));
   });
 
   // Find the component exist demo test file
@@ -30,27 +27,23 @@ describe('node', () => {
     const componentName = componentTestFile.match(/components\/([^/]*)\//)![1];
 
     // Test for ssr
-    // eslint-disable-next-line vitest/valid-describe-callback
+    describe(componentName, () => {
-    describe(componentName, async () => {
       const demoList = globSync(`./components/${componentName}/demo/*.tsx`);
 
       // Use mock to get config
-      await import(`../../${componentTestFile}`);
+      require(`../../${componentTestFile}`); // eslint-disable-line global-require, import/no-dynamic-require
+      const option = (global as any).testConfig?.[componentName];
+
       demoList.forEach((demoFile) => {
-        const option = globalThis.testConfig?.[componentName];
         const skip: string[] = option?.skip || [];
         const test = skip.some((skipMarkdown) => demoFile.includes(skipMarkdown)) ? it.skip : it;
 
-        test(
+        test(demoFile, () => {
-          demoFile,
+          const Demo = require(`../../${demoFile}`).default; // eslint-disable-line global-require, import/no-dynamic-require
-          async () => {
+          expect(() => {
-            const Demo = (await import(`../../${demoFile}`)).default;
+            renderToString(<Demo />);
-            expect(() => {
+          }).not.toThrow();
-              renderToString(<Demo />);
+        });
-            }).not.toThrow();
-          },
-          120000,
-        );
       });
     });
   });

components/_util/PurePanel.tsx

@@ -7,7 +7,7 @@ export interface BaseProps {
   style?: React.CSSProperties;
 }
 
-/* c8 ignore start */
+/* istanbul ignore next */
 export default function genPurePanel<ComponentProps extends BaseProps>(
   Component: any,
   defaultPrefixCls?: string,
@@ -96,4 +96,3 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
     );
   } as typeof Component;
 }
-/* c8 ignore stop */

components/_util/__tests__/getScroll.test.ts

@@ -7,7 +7,7 @@ describe('getScroll', () => {
   });
 
   it('getScroll window', async () => {
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
       window.pageXOffset = x;
       window.pageYOffset = y;
     });
@@ -18,7 +18,7 @@ describe('getScroll', () => {
   });
 
   it('getScroll document', async () => {
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
       document.documentElement.scrollLeft = x;
       document.documentElement.scrollTop = y;
     });
@@ -30,7 +30,7 @@ describe('getScroll', () => {
 
   it('getScroll div', async () => {
     const div = document.createElement('div');
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
       div.scrollLeft = x;
       div.scrollTop = y;
     });
@@ -42,7 +42,7 @@ describe('getScroll', () => {
 
   it('getScroll documentElement', async () => {
     const div: any = {};
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((x, y) => {
       div.scrollLeft = null;
       div.scrollTop = null;
       div.documentElement = {};

components/_util/__tests__/responsiveObserve.test.tsx

@@ -11,7 +11,7 @@ describe('Test ResponsiveObserve', () => {
       return null;
     };
     render(<Demo />);
-    const subscribeFunc = vi.fn();
+    const subscribeFunc = jest.fn();
     const token = responsiveObserveRef.subscribe(subscribeFunc);
     expect(
       responsiveObserveRef.matchHandlers[responsiveObserveRef.responsiveMap.xs].mql.matches,

components/_util/__tests__/scrollTo.test.ts

@@ -2,10 +2,10 @@ import { waitFakeTimer } from '../../../tests/utils';
 import scrollTo from '../scrollTo';
 
 describe('Test ScrollTo function', () => {
-  const dateNowMock = vi.spyOn(Date, 'now');
+  const dateNowMock = jest.spyOn(Date, 'now');
 
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   beforeEach(() => {
@@ -13,16 +13,16 @@ describe('Test ScrollTo function', () => {
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   afterEach(() => {
-    vi.clearAllTimers();
+    jest.clearAllTimers();
     dateNowMock.mockClear();
   });
 
   it('test scrollTo', async () => {
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((_, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((_, y) => {
       window.scrollY = y;
       window.pageYOffset = y;
     });
@@ -36,7 +36,7 @@ describe('Test ScrollTo function', () => {
   });
 
   it('test callback - option', async () => {
-    const cbMock = vi.fn();
+    const cbMock = jest.fn();
     scrollTo(1000, {
       callback: cbMock,
     });

components/_util/__tests__/util.test.tsx

@@ -9,19 +9,19 @@ import TransButton from '../transButton';
 describe('Test utils function', () => {
   describe('throttle', () => {
     beforeAll(() => {
-      vi.useFakeTimers();
+      jest.useFakeTimers();
     });
 
     afterAll(() => {
-      vi.useRealTimers();
+      jest.useRealTimers();
     });
 
     afterEach(() => {
-      vi.clearAllTimers();
+      jest.clearAllTimers();
     });
 
     it('throttle function should work', async () => {
-      const callback = vi.fn();
+      const callback = jest.fn();
       const throttled = throttleByAnimationFrame(callback);
       expect(callback).not.toHaveBeenCalled();
 
@@ -34,7 +34,7 @@ describe('Test utils function', () => {
     });
 
     it('throttle function should be canceled', async () => {
-      const callback = vi.fn();
+      const callback = jest.fn();
       const throttled = throttleByAnimationFrame(callback);
 
       throttled();
@@ -54,7 +54,7 @@ describe('Test utils function', () => {
     });
 
     it('should trigger onClick when press enter', () => {
-      const onClick = vi.fn();
+      const onClick = jest.fn();
 
       const { container } = render(<TransButton onClick={onClick}>TransButton</TransButton>);
 
@@ -75,7 +75,7 @@ describe('Test utils function', () => {
     });
 
     it('isStyleSupport return false in service side', () => {
-      const spy = vi
+      const spy = jest
         .spyOn(window.document, 'documentElement', 'get')
         .mockImplementation(() => undefined as unknown as HTMLElement);
       expect(isStyleSupport('color')).toBe(false);

components/_util/__tests__/warning.test.ts

@@ -1,10 +1,8 @@
-import type { SpyInstance } from 'vitest';
-
 describe('Test warning', () => {
-  let spy: SpyInstance;
+  let spy: jest.SpyInstance;
 
   beforeAll(() => {
-    spy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    spy = jest.spyOn(console, 'error').mockImplementation(() => {});
   });
 
   afterAll(() => {
@@ -12,7 +10,7 @@ describe('Test warning', () => {
   });
 
   beforeEach(() => {
-    vi.resetModules();
+    jest.resetModules();
   });
 
   afterEach(() => {

components/_util/__tests__/wave.test.tsx

@@ -3,13 +3,11 @@ import mountTest from '../../../tests/shared/mountTest';
 import { act, fireEvent, getByText, render, waitFakeTimer } from '../../../tests/utils';
 import Wave from '../wave';
 
-let isVisible = vi.hoisted(() => true);
+(global as any).isVisible = true;
 
-vi.mock('rc-util/es/Dom/isVisible', () => {
+jest.mock('rc-util/lib/Dom/isVisible', () => {
-  const mockFn = () => isVisible;
+  const mockFn = () => (global as any).isVisible;
-  return {
+  return mockFn;
-    default: mockFn,
-  };
 });
 
 describe('Wave component', () => {
@@ -31,37 +29,44 @@ describe('Wave component', () => {
     }
 
     (window as any).ResizeObserver = FakeResizeObserver;
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
     expect(obCnt).not.toBe(0);
     expect(disCnt).not.toBe(0);
   });
 
   beforeEach(() => {
-    isVisible = true;
+    (global as any).isVisible = true;
     document.body.innerHTML = '';
   });
 
-  afterEach(async () => {
+  afterEach(() => {
-    await vi.runAllTimersAsync();
+    jest.clearAllTimers();
-    vi.clearAllTimers();
     const styles = document.getElementsByTagName('style');
     for (let i = 0; i < styles.length; i += 1) {
       styles[i].remove();
     }
   });
 
-  function getWaveColor() {
+  function getWaveStyle() {
+    const styleObj: Record<string, string> = {};
     const { style } = document.querySelector<HTMLElement>('.ant-wave')!;
-    return style.getPropertyValue('--wave-color');
+    style.cssText.split(';').forEach((kv) => {
+      if (kv.trim()) {
+        const cells = kv.split(':');
+        styleObj[cells[0].trim()] = cells[1].trim();
+      }
+    });
+
+    return styleObj;
   }
 
   function waitRaf() {
     act(() => {
-      vi.advanceTimersByTime(100);
+      jest.advanceTimersByTime(100);
     });
   }
 
@@ -85,7 +90,7 @@ describe('Wave component', () => {
   });
 
   it('invisible in screen', () => {
-    isVisible = false;
+    (global as any).isVisible = false;
     const { container, unmount } = render(
       <Wave>
         <button type="button">button</button>
@@ -114,7 +119,9 @@ describe('Wave component', () => {
     fireEvent.click(container.querySelector('button')!);
     waitRaf();
 
-    expect(getWaveColor()).toBeFalsy();
+    const style = getWaveStyle();
+
+    expect(style['--wave-color']).toBeFalsy();
 
     unmount();
   });
@@ -122,7 +129,7 @@ describe('Wave component', () => {
   it('wave color is not grey', () => {
     const { container, unmount } = render(
       <Wave>
-        <button type="button" style={{ borderColor: 'rgb(255, 0, 0)' }}>
+        <button type="button" style={{ borderColor: 'red' }}>
           button
         </button>
       </Wave>,
@@ -131,7 +138,8 @@ describe('Wave component', () => {
     fireEvent.click(container.querySelector('button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('rgb(255, 0, 0)');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('red');
 
     unmount();
   });
@@ -139,14 +147,15 @@ describe('Wave component', () => {
   it('read wave color from border-top-color', () => {
     const { container, unmount } = render(
       <Wave>
-        <div style={{ borderTopColor: 'rgb(0, 0, 255)' }}>button</div>
+        <div style={{ borderTopColor: 'blue' }}>button</div>
       </Wave>,
     );
 
     fireEvent.click(getByText(container, 'button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('rgb(0, 0, 255)');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('blue');
 
     unmount();
   });
@@ -154,14 +163,15 @@ describe('Wave component', () => {
   it('read wave color from background color', () => {
     const { container, unmount } = render(
       <Wave>
-        <div style={{ backgroundColor: 'rgb(0, 128, 0)' }}>button</div>
+        <div style={{ backgroundColor: 'green' }}>button</div>
       </Wave>,
     );
 
     fireEvent.click(getByText(container, 'button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('rgb(0, 128, 0)');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('green');
 
     unmount();
   });
@@ -169,14 +179,15 @@ describe('Wave component', () => {
   it('read wave color from border firstly', () => {
     const { container, unmount } = render(
       <Wave>
-        <div style={{ borderColor: 'rgb(255, 0, 0)', backgroundColor: 'green' }}>button</div>
+        <div style={{ borderColor: 'yellow', backgroundColor: 'green' }}>button</div>
       </Wave>,
     );
 
     fireEvent.click(getByText(container, 'button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('rgb(255, 0, 0)');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('yellow');
 
     unmount();
   });
@@ -211,7 +222,7 @@ describe('Wave component', () => {
   });
 
   it('not show when hidden', () => {
-    isVisible = false;
+    (global as any).isVisible = false;
 
     const { container } = render(
       <Wave>
@@ -260,7 +271,7 @@ describe('Wave component', () => {
   it('wave color should inferred if border is transparent and background is not', () => {
     const { container, unmount } = render(
       <Wave>
-        <button type="button" style={{ borderColor: 'transparent', background: 'rgb(255, 0, 0)' }}>
+        <button type="button" style={{ borderColor: 'transparent', background: 'red' }}>
           button
         </button>
       </Wave>,
@@ -268,7 +279,8 @@ describe('Wave component', () => {
     fireEvent.click(container.querySelector('button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('rgb(255, 0, 0)');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('red');
 
     unmount();
   });
@@ -285,7 +297,8 @@ describe('Wave component', () => {
     fireEvent.click(container.querySelector('button')!);
     waitRaf();
 
-    expect(getWaveColor()).toEqual('red');
+    const style = getWaveStyle();
+    expect(style['--wave-color']).toEqual('red');
 
     unmount();
   });

components/affix/__tests__/Affix.test.tsx

@@ -22,7 +22,7 @@ const AffixMounter: React.FC<AffixProps> = ({ getInstance, ...restProps }) => {
   const container = useRef<HTMLDivElement>(null);
   useEffect(() => {
     if (container.current) {
-      container.current.addEventListener = vi
+      container.current.addEventListener = jest
         .fn()
         .mockImplementation((event: keyof HTMLElementEventMap, cb: (ev: Event) => void) => {
           events[event] = cb;
@@ -42,12 +42,12 @@ describe('Affix Render', () => {
   rtlTest(Affix);
   accessibilityTest(Affix);
 
-  const domMock = vi.spyOn(HTMLElement.prototype, 'getBoundingClientRect');
+  const domMock = jest.spyOn(HTMLElement.prototype, 'getBoundingClientRect');
 
   const classRect: Record<string, DOMRect> = { container: { top: 0, bottom: 100 } as DOMRect };
 
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   beforeAll(() => {
@@ -57,8 +57,8 @@ describe('Affix Render', () => {
   });
 
   afterEach(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
-    vi.clearAllTimers();
+    jest.clearAllTimers();
   });
 
   afterAll(() => {
@@ -89,11 +89,7 @@ describe('Affix Render', () => {
   });
 
   it('Anchor correct render when target is null', async () => {
-    render(
+    render(<Affix target={() => null}>test</Affix>);
-      <Affix target={() => null}>
-        <span>test</span>
-      </Affix>,
-    );
     await waitFakeTimer();
   });
 
@@ -113,7 +109,7 @@ describe('Affix Render', () => {
   });
 
   it('updatePosition when offsetTop changed', async () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
 
     const { container, rerender } = render(<AffixMounter offsetTop={0} onChange={onChange} />);
     await waitFakeTimer();
@@ -232,7 +228,7 @@ describe('Affix Render', () => {
       '.fixed', // outer
     ].forEach((selector) => {
       it(`trigger listener when size change: ${selector}`, async () => {
-        const updateCalled = vi.fn();
+        const updateCalled = jest.fn();
         const { container } = render(
           <AffixMounter offsetBottom={0} onTestUpdatePosition={updateCalled} />,
           {

components/affix/__tests__/__snapshots__/Affix.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Affix Render > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Affix Render rtl render component should be rendered correctly in RTL direction 1`] = `
 <div>
   <div
     class=""

components/affix/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/affix/demo/basic.tsx extend context correctly 1`] = `
 Array [

components/affix/__tests__/__snapshots__/demo.test.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/affix/demo/basic.tsx correctly 1`] = `
 Array [

components/alert/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/alert/demo/action.tsx extend context correctly 1`] = `
 <div

components/alert/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/alert/demo/action.tsx correctly 1`] = `
 <div

components/alert/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Alert > custom action 1`] = `
+exports[`Alert custom action 1`] = `
 <div
   class="ant-alert ant-alert-success"
   data-show="true"
@@ -74,7 +74,7 @@ exports[`Alert > custom action 1`] = `
 </div>
 `;
 
-exports[`Alert > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Alert rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-alert ant-alert-info ant-alert-no-icon ant-alert-rtl"
   data-show="true"

components/alert/__tests__/index.test.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import Alert from '..';
 import accessibilityTest from '../../../tests/shared/accessibilityTest';
 import rtlTest from '../../../tests/shared/rtlTest';
-import { render, screen, waitFor } from '../../../tests/utils';
+import { act, render, screen } from '../../../tests/utils';
 import Button from '../../button';
 import Popconfirm from '../../popconfirm';
 import Tooltip from '../../tooltip';
@@ -15,15 +15,15 @@ describe('Alert', () => {
   accessibilityTest(Alert);
 
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('should show close button and could be closed', async () => {
-    const onClose = vi.fn();
+    const onClose = jest.fn();
     render(
       <Alert
         message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
@@ -35,6 +35,10 @@ describe('Alert', () => {
 
     await userEvent.click(screen.getByRole('button', { name: /close/i }));
 
+    act(() => {
+      jest.runAllTimers();
+    });
+
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
@@ -72,7 +76,7 @@ describe('Alert', () => {
   });
 
   it('should show error as ErrorBoundary when children have error', () => {
-    const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     expect(warnSpy).toHaveBeenCalledTimes(0);
     // @ts-expect-error
     // eslint-disable-next-line react/jsx-no-undef
@@ -101,9 +105,11 @@ describe('Alert', () => {
 
     await userEvent.hover(screen.getByRole('alert'));
 
-    await waitFor(() => {
+    act(() => {
-      expect(screen.getByRole('tooltip')).toBeInTheDocument();
+      jest.runAllTimers();
     });
+
+    expect(screen.getByRole('tooltip')).toBeInTheDocument();
   });
 
   it('could be used with Popconfirm', async () => {
@@ -117,6 +123,10 @@ describe('Alert', () => {
     );
     await userEvent.click(screen.getByRole('alert'));
 
+    act(() => {
+      jest.runAllTimers();
+    });
+
     expect(screen.getByRole('tooltip')).toBeInTheDocument();
   });
 

components/anchor/__tests__/Anchor.test.tsx

@@ -2,7 +2,6 @@ import { resetWarned } from 'rc-util/lib/warning';
 import React, { useState } from 'react';
 import scrollIntoView from 'scroll-into-view-if-needed';
 
-import type { SpyInstance } from 'vitest';
 import Anchor from '..';
 import { act, fireEvent, render, waitFakeTimer } from '../../../tests/utils';
 import Button from '../../button';
@@ -10,9 +9,8 @@ import type { AnchorDirection } from '../Anchor';
 
 const { Link } = Anchor;
 
-function createRootDiv() {
+function createDiv() {
   const root = document.createElement('div');
-  root.className = 'root';
   document.body.appendChild(root);
   return root;
 }
@@ -20,16 +18,18 @@ function createRootDiv() {
 let idCounter = 0;
 const getHashUrl = () => `Anchor-API-${idCounter++}`;
 
-vi.mock('scroll-into-view-if-needed', () => ({
+jest.mock('scroll-into-view-if-needed', () => jest.fn());
-  default: vi.fn(),
-}));
 
 describe('Anchor Render', () => {
-  const getBoundingClientRectMock = vi.spyOn(HTMLHeadingElement.prototype, 'getBoundingClientRect');
+  const getBoundingClientRectMock = jest.spyOn(
-  const getClientRectsMock = vi.spyOn(HTMLHeadingElement.prototype, 'getClientRects');
+    HTMLHeadingElement.prototype,
+    'getBoundingClientRect',
+  );
+  const getClientRectsMock = jest.spyOn(HTMLHeadingElement.prototype, 'getClientRects');
+  const scrollIntoViewMock = jest.createMockFromModule<any>('scroll-into-view-if-needed');
 
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
     getBoundingClientRectMock.mockReturnValue({
       width: 100,
       height: 100,
@@ -39,18 +39,18 @@ describe('Anchor Render', () => {
   });
 
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
-    vi.mocked(scrollIntoView).mockReset();
+    scrollIntoViewMock.mockReset();
   });
 
   afterEach(() => {
-    vi.clearAllTimers();
+    jest.clearAllTimers();
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   afterAll(() => {
-    vi.clearAllTimers();
+    jest.clearAllTimers();
-    vi.useRealTimers();
+    jest.useRealTimers();
     getBoundingClientRectMock.mockRestore();
     getClientRectsMock.mockRestore();
   });
@@ -186,12 +186,12 @@ describe('Anchor Render', () => {
     const link = container.querySelector(`a[href="http://www.example.com/#${hash}"]`)!;
     fireEvent.click(link);
     await waitFakeTimer();
-    expect(link.classList.contains('ant-anchor-link-title-active')).toBeTruthy();
+    expect(link.classList).toContain('ant-anchor-link-title-active');
   });
 
   it('scrolls the page when clicking a link', async () => {
-    const root = createRootDiv();
+    const root = createDiv();
-    const scrollToSpy = vi.spyOn(window, 'scrollTo');
+    const scrollToSpy = jest.spyOn(window, 'scrollTo');
     render(<div id="/faq?locale=en#Q1">Q1</div>, { container: root });
     const { container } = render(
       <Anchor items={[{ key: 'Q1', title: 'Q1', href: '/#/faq?locale=en#Q1' }]} />,
@@ -200,14 +200,13 @@ describe('Anchor Render', () => {
     fireEvent.click(link);
     await waitFakeTimer();
     expect(scrollToSpy).toHaveBeenCalled();
-    scrollToSpy.mockRestore();
   });
 
   it('handleScroll should not be triggered when scrolling caused by clicking a link', async () => {
     const hash1 = getHashUrl();
     const hash2 = getHashUrl();
-    const root = createRootDiv();
+    const root = createDiv();
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     render(
       <div>
         <div id={hash1}>Hello</div>
@@ -266,8 +265,8 @@ describe('Anchor Render', () => {
   it('targetOffset prop', async () => {
     const hash = getHashUrl();
 
-    const scrollToSpy = vi.spyOn(window, 'scrollTo');
+    const scrollToSpy = jest.spyOn(window, 'scrollTo');
-    const root = createRootDiv();
+    const root = createDiv();
     render(<h1 id={hash}>Hello</h1>, { container: root });
     const { container, rerender } = render(
       <Anchor items={[{ key: hash, href: `#${hash}`, title: hash }]} />,
@@ -291,16 +290,14 @@ describe('Anchor Render', () => {
     fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
     await waitFakeTimer();
     expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
-
-    scrollToSpy.mockRestore();
   });
 
   // https://github.com/ant-design/ant-design/issues/31941
   it('targetOffset prop when contain spaces', async () => {
     const hash = `${getHashUrl()} s p a c e s`;
 
-    const scrollToSpy = vi.spyOn(window, 'scrollTo');
+    const scrollToSpy = jest.spyOn(window, 'scrollTo');
-    const root = createRootDiv();
+    const root = createDiv();
     render(<h1 id={hash}>Hello</h1>, { container: root });
     const { container, rerender } = render(
       <Anchor items={[{ key: hash, href: `#${hash}`, title: hash }]} />,
@@ -322,8 +319,6 @@ describe('Anchor Render', () => {
     fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
     await waitFakeTimer();
     expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
-
-    scrollToSpy.mockRestore();
   });
 
   it('onClick event', () => {
@@ -352,7 +347,7 @@ describe('Anchor Render', () => {
   it('onChange event', () => {
     const hash1 = getHashUrl();
     const hash2 = getHashUrl();
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Anchor
         onChange={onChange}
@@ -383,8 +378,8 @@ describe('Anchor Render', () => {
     const hash1 = getHashUrl();
     const hash2 = getHashUrl();
 
-    const beforeFn = vi.fn();
+    const beforeFn = jest.fn();
-    const afterFn = vi.fn();
+    const afterFn = jest.fn();
 
     const Demo: React.FC = () => {
       const [trigger, setTrigger] = useState(false);
@@ -440,8 +435,8 @@ describe('Anchor Render', () => {
     getBoundingClientRectMock.mockReturnValue({ width: 0, height: 0, top: 1000 } as DOMRect);
     const hash = getHashUrl();
 
-    const scrollToSpy = vi.spyOn(window, 'scrollTo');
+    const scrollToSpy = jest.spyOn(window, 'scrollTo');
-    const root = createRootDiv();
+    const root = createDiv();
     render(<h1 id={hash}>Hello</h1>, { container: root });
     const { container, rerender } = render(
       <Anchor>
@@ -475,14 +470,13 @@ describe('Anchor Render', () => {
       height: 100,
       top: 1000,
     } as DOMRect);
-
-    scrollToSpy.mockRestore();
   });
 
   it('test edge case when container is not windows', async () => {
     const hash = getHashUrl();
 
-    const root = createRootDiv();
+    const scrollToSpy = jest.spyOn(window, 'scrollTo');
+    const root = createDiv();
     render(<h1 id={hash}>Hello</h1>, { container: root });
 
     const { container, rerender } = render(
@@ -498,23 +492,19 @@ describe('Anchor Render', () => {
         </Anchor>,
       );
 
-    // Since it's mock rect pos here. We need always reset the `scrollTop` for test
-    document.body.scrollTop = 0;
     fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
     await waitFakeTimer();
-    expect(document.body.scrollTop).toEqual(1000);
+    expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
 
-    document.body.scrollTop = 0;
     setProps({ offsetTop: 100 });
     fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
     await waitFakeTimer();
-    expect(document.body.scrollTop).toEqual(900);
+    expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
 
-    document.body.scrollTop = 0;
     setProps({ targetOffset: 200 });
     fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
     await waitFakeTimer();
-    expect(document.body.scrollTop).toEqual(800);
+    expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
   });
 
   describe('getCurrentAnchor', () => {
@@ -539,7 +529,7 @@ describe('Anchor Render', () => {
     it('should trigger onChange when have getCurrentAnchor', () => {
       const hash1 = getHashUrl();
       const hash2 = getHashUrl();
-      const onChange = vi.fn();
+      const onChange = jest.fn();
       const { container } = render(
         <Anchor
           onChange={onChange}
@@ -563,7 +553,7 @@ describe('Anchor Render', () => {
     it('getCurrentAnchor have default link as argument', () => {
       const hash1 = getHashUrl();
       const hash2 = getHashUrl();
-      const getCurrentAnchor = vi.fn();
+      const getCurrentAnchor = jest.fn();
       const { container } = render(
         <Anchor
           getCurrentAnchor={getCurrentAnchor}
@@ -613,8 +603,8 @@ describe('Anchor Render', () => {
     describe('scroll x', () => {
       it('targetOffset horizontal', async () => {
         const hash = getHashUrl();
-        const scrollToSpy = vi.spyOn(window, 'scrollTo');
+        const scrollToSpy = jest.spyOn(window, 'scrollTo');
-        const root = createRootDiv();
+        const root = createDiv();
         render(<h1 id={hash}>Hello</h1>, { container: root });
         const { container, rerender } = render(
           <Anchor
@@ -658,8 +648,6 @@ describe('Anchor Render', () => {
         fireEvent.click(container.querySelector(`a[href="#${hash}"]`)!);
         await waitFakeTimer();
         expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800);
-
-        scrollToSpy.mockRestore();
       });
     });
 
@@ -768,12 +756,12 @@ describe('Anchor Render', () => {
       const link = container.querySelector(`a[href="http://www.example.com/#${hash}"]`)!;
       fireEvent.click(link);
       await waitFakeTimer();
-      expect(link.classList.contains('ant-anchor-link-title-active')).toBeTruthy();
+      expect(link.classList).toContain('ant-anchor-link-title-active');
     });
 
     it('scrolls the page when clicking a link', async () => {
-      const root = createRootDiv();
+      const root = createDiv();
-      const scrollToSpy = vi.spyOn(window, 'scrollTo');
+      const scrollToSpy = jest.spyOn(window, 'scrollTo');
       render(<div id="/faq?locale=en#Q1">Q1</div>, { container: root });
       const { container } = render(
         <Anchor>
@@ -784,15 +772,13 @@ describe('Anchor Render', () => {
       fireEvent.click(link);
       await waitFakeTimer();
       expect(scrollToSpy).toHaveBeenCalled();
-
-      scrollToSpy.mockRestore();
     });
 
     it('handleScroll should not be triggered when scrolling caused by clicking a link', async () => {
       const hash1 = getHashUrl();
       const hash2 = getHashUrl();
-      const root = createRootDiv();
+      const root = createDiv();
-      const onChange = vi.fn();
+      const onChange = jest.fn();
       render(
         <div>
           <div id={hash1}>Hello</div>
@@ -865,10 +851,10 @@ describe('Anchor Render', () => {
   });
 
   describe('warning', () => {
-    let errSpy: SpyInstance;
+    let errSpy: jest.SpyInstance;
     beforeEach(() => {
       resetWarned();
-      errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+      errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     });
 
     afterEach(() => {
@@ -985,14 +971,14 @@ describe('Anchor Render', () => {
       const toggleButton = wrapper.container.querySelector('button')!;
 
       fireEvent.click(toggleButton);
-      act(() => vi.runAllTimers());
+      act(() => jest.runAllTimers());
       expect(!!ink.style.left).toBe(true);
       expect(!!ink.style.width).toBe(true);
       expect(ink.style.top).toBe('');
       expect(ink.style.height).toBe('');
 
       fireEvent.click(toggleButton);
-      act(() => vi.runAllTimers());
+      act(() => jest.runAllTimers());
       expect(!!ink.style.top).toBe(true);
       expect(!!ink.style.height).toBe(true);
       expect(ink.style.left).toBe('');

components/anchor/__tests__/__snapshots__/Anchor.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Anchor Render > render items and ignore jsx children 1`] = `
+exports[`Anchor Render render items and ignore jsx children 1`] = `
 <div>
   <div
     class=""
@@ -32,7 +32,7 @@ exports[`Anchor Render > render items and ignore jsx children 1`] = `
 </div>
 `;
 
-exports[`Anchor Render > renders items correctly 1`] = `
+exports[`Anchor Render renders items correctly 1`] = `
 <div>
   <div
     class=""
@@ -108,7 +108,7 @@ exports[`Anchor Render > renders items correctly 1`] = `
 </div>
 `;
 
-exports[`Anchor Render > renders items correctly#horizontal 1`] = `
+exports[`Anchor Render renders items correctly#horizontal 1`] = `
 <div>
   <div
     class=""

components/anchor/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/anchor/demo/basic.tsx extend context correctly 1`] = `
 <div

components/anchor/__tests__/__snapshots__/demo.test.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/anchor/demo/basic.tsx correctly 1`] = `
 <div

components/app/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/app/demo/basic.tsx extend context correctly 1`] = `
 <div

components/app/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/app/demo/basic.tsx correctly 1`] = `
 <div

components/app/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,12 +1,12 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`App > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`App rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-app"
 />
 `;
 
-exports[`App > single 1`] = `
+exports[`App single 1`] = `
 <div
   class="ant-app"
 >

components/app/__tests__/index.test.tsx

@@ -11,12 +11,12 @@ describe('App', () => {
   rtlTest(App);
 
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterEach(() => {
-    vi.clearAllTimers();
+    jest.clearAllTimers();
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('single', () => {
@@ -134,12 +134,10 @@ describe('App', () => {
 
   it('support style', () => {
     const { container } = render(
-      <App style={{ color: 'rgb(255, 0, 0)' }}>
+      <App style={{ color: 'blue' }}>
         <div>test</div>
       </App>,
     );
-    expect(container.querySelector<HTMLDivElement>('.ant-app')).toHaveStyle(
+    expect(container.querySelector<HTMLDivElement>('.ant-app')).toHaveStyle('color: blue;');
-      'color: rgb(255, 0, 0);',
-    );
   });
 });

components/auto-complete/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/auto-complete/demo/basic.tsx extend context correctly 1`] = `
 Array [
@@ -235,7 +235,7 @@ exports[`renders components/auto-complete/demo/certain-category.tsx extend conte
       >
         <div
           class="rc-virtual-list-holder"
-          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+          style="max-height: 256px; overflow-y: auto;"
         >
           <div>
             <div
@@ -1827,7 +1827,7 @@ exports[`renders components/auto-complete/demo/non-case-sensitive.tsx extend con
       >
         <div
           class="rc-virtual-list-holder"
-          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+          style="max-height: 256px; overflow-y: auto;"
         >
           <div>
             <div
@@ -2028,7 +2028,7 @@ exports[`renders components/auto-complete/demo/render-panel.tsx extend context c
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div

components/auto-complete/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/auto-complete/demo/basic.tsx correctly 1`] = `
 Array [

components/auto-complete/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`AutoComplete > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`AutoComplete rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-select ant-select-rtl ant-select-auto-complete ant-select-single ant-select-show-search"
 >

components/auto-complete/__tests__/focus.test.tsx

@@ -5,7 +5,7 @@ import { render } from '../../../tests/utils';
 
 describe('AutoComplete children could be focus', () => {
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   let container: HTMLDivElement;
@@ -15,7 +15,7 @@ describe('AutoComplete children could be focus', () => {
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   afterEach(() => {
@@ -23,31 +23,31 @@ describe('AutoComplete children could be focus', () => {
   });
 
   it('focus() and onFocus', () => {
-    const handleFocus = vi.fn();
+    const handleFocus = jest.fn();
     const { container: wrapper } = render(<AutoComplete onFocus={handleFocus} />, { container });
     wrapper.querySelector('input')?.focus();
     act(() => {
-      vi.runAllTimers();
+      jest.runAllTimers();
     });
     expect(handleFocus).toHaveBeenCalled();
   });
 
   it('blur() and onBlur', () => {
-    const handleBlur = vi.fn();
+    const handleBlur = jest.fn();
     const { container: wrapper } = render(<AutoComplete onBlur={handleBlur} />, { container });
     wrapper.querySelector('input')?.focus();
     act(() => {
-      vi.runAllTimers();
+      jest.runAllTimers();
     });
     wrapper.querySelector('input')?.blur();
     act(() => {
-      vi.runAllTimers();
+      jest.runAllTimers();
     });
     expect(handleBlur).toHaveBeenCalled();
   });
 
   it('child.ref should work', () => {
-    const mockRef = vi.fn();
+    const mockRef = jest.fn();
     render(
       <AutoComplete dataSource={[]}>
         <input ref={mockRef} />

components/auto-complete/__tests__/index.test.tsx

@@ -49,7 +49,7 @@ describe('AutoComplete', () => {
   });
 
   it('AutoComplete throws error when contains invalid dataSource', () => {
-    const spy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const spy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
     render(
       // @ts-ignore
@@ -82,7 +82,7 @@ describe('AutoComplete', () => {
   });
 
   it('should not warning when getInputElement is null', () => {
-    const warnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
     render(<AutoComplete placeholder="input here" allowClear />);
     expect(warnSpy).not.toHaveBeenCalled();
     warnSpy.mockRestore();
@@ -100,7 +100,7 @@ describe('AutoComplete', () => {
   it('deprecated dropdownClassName', () => {
     resetWarned();
 
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     const { container } = render(
       <AutoComplete
         dropdownClassName="legacy"

components/auto-complete/index.tsx

@@ -178,7 +178,7 @@ const RefAutoComplete = React.forwardRef<RefSelectProps, AutoCompleteProps>(
 };
 
 // We don't care debug panel
-/* c8 ignore next */
+/* istanbul ignore next */
 const PurePanel = genPurePanel(RefAutoComplete);
 
 RefAutoComplete.Option = Option;

components/avatar/__tests__/Avatar.test.tsx

@@ -7,7 +7,7 @@ import rtlTest from '../../../tests/shared/rtlTest';
 import { fireEvent, render } from '../../../tests/utils';
 import useBreakpoint from '../../grid/hooks/useBreakpoint';
 
-vi.mock('../../grid/hooks/useBreakpoint');
+jest.mock('../../grid/hooks/useBreakpoint');
 
 describe('Avatar Render', () => {
   mountTest(Avatar);
@@ -122,7 +122,7 @@ describe('Avatar Render', () => {
   });
 
   it('should warning when pass a string as icon props', () => {
-    const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Avatar size={64} icon="aa" />);
     expect(warnSpy).not.toHaveBeenCalled();
 
@@ -152,7 +152,7 @@ describe('Avatar Render', () => {
   });
 
   it('support onMouseEnter', () => {
-    const onMouseEnter = vi.fn();
+    const onMouseEnter = jest.fn();
     const { container } = render(<Avatar {...{ onMouseEnter }}>TestString</Avatar>);
     fireEvent.mouseEnter(container.firstChild!);
     expect(onMouseEnter).toHaveBeenCalled();
@@ -191,7 +191,7 @@ describe('Avatar Render', () => {
   });
 
   it('clickable', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(<Avatar onClick={onClick}>TestString</Avatar>);
     fireEvent.click(container.querySelector('.ant-avatar-string')!);
     expect(onClick).toHaveBeenCalled();

components/avatar/__tests__/__snapshots__/Avatar.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Avatar Render > adjusts component size to 24 when window size is xs 1`] = `
+exports[`Avatar Render adjusts component size to 24 when window size is xs 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -14,7 +14,7 @@ exports[`Avatar Render > adjusts component size to 24 when window size is xs 1`]
 </div>
 `;
 
-exports[`Avatar Render > adjusts component size to 32 when window size is sm 1`] = `
+exports[`Avatar Render adjusts component size to 32 when window size is sm 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -28,7 +28,7 @@ exports[`Avatar Render > adjusts component size to 32 when window size is sm 1`]
 </div>
 `;
 
-exports[`Avatar Render > adjusts component size to 40 when window size is md 1`] = `
+exports[`Avatar Render adjusts component size to 40 when window size is md 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -42,7 +42,7 @@ exports[`Avatar Render > adjusts component size to 40 when window size is md 1`]
 </div>
 `;
 
-exports[`Avatar Render > adjusts component size to 64 when window size is lg 1`] = `
+exports[`Avatar Render adjusts component size to 64 when window size is lg 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -56,7 +56,7 @@ exports[`Avatar Render > adjusts component size to 64 when window size is lg 1`]
 </div>
 `;
 
-exports[`Avatar Render > adjusts component size to 80 when window size is xl 1`] = `
+exports[`Avatar Render adjusts component size to 80 when window size is xl 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -70,7 +70,7 @@ exports[`Avatar Render > adjusts component size to 80 when window size is xl 1`]
 </div>
 `;
 
-exports[`Avatar Render > adjusts component size to 100 when window size is xxl 1`] = `
+exports[`Avatar Render adjusts component size to 100 when window size is xxl 1`] = `
 <div>
   <span
     class="ant-avatar ant-avatar-circle"
@@ -84,7 +84,7 @@ exports[`Avatar Render > adjusts component size to 100 when window size is xxl 1
 </div>
 `;
 
-exports[`Avatar Render > fallback 1`] = `
+exports[`Avatar Render fallback 1`] = `
 <span
   class="ant-avatar ant-avatar-circle"
 >
@@ -97,7 +97,7 @@ exports[`Avatar Render > fallback 1`] = `
 </span>
 `;
 
-exports[`Avatar Render > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Avatar Render rtl render component should be rendered correctly in RTL direction 1`] = `
 <span
   class="ant-avatar ant-avatar-circle"
 >
@@ -108,7 +108,7 @@ exports[`Avatar Render > rtl render > component should be rendered correctly in
 </span>
 `;
 
-exports[`Avatar Render > should calculate scale of avatar children correctly 1`] = `
+exports[`Avatar Render should calculate scale of avatar children correctly 1`] = `
 <span
   class="ant-avatar-string"
   style="transform: scale(0.72) translateX(-50%);"
@@ -117,7 +117,7 @@ exports[`Avatar Render > should calculate scale of avatar children correctly 1`]
 </span>
 `;
 
-exports[`Avatar Render > should calculate scale of avatar children correctly 2`] = `
+exports[`Avatar Render should calculate scale of avatar children correctly 2`] = `
 <span
   class="ant-avatar-string"
   style="transform: scale(0.72) translateX(-50%);"
@@ -126,7 +126,7 @@ exports[`Avatar Render > should calculate scale of avatar children correctly 2`]
 </span>
 `;
 
-exports[`Avatar Render > should calculate scale of avatar children correctly with gap 1`] = `
+exports[`Avatar Render should calculate scale of avatar children correctly with gap 1`] = `
 <span
   class="ant-avatar-string"
   style="transform: scale(0.36) translateX(-50%);"
@@ -135,7 +135,7 @@ exports[`Avatar Render > should calculate scale of avatar children correctly wit
 </span>
 `;
 
-exports[`Avatar Render > should handle onError correctly 1`] = `
+exports[`Avatar Render should handle onError correctly 1`] = `
 <span
   class="ant-avatar ant-avatar-circle ant-avatar-image"
 >
@@ -145,7 +145,7 @@ exports[`Avatar Render > should handle onError correctly 1`] = `
 </span>
 `;
 
-exports[`Avatar Render > should show image on success after a failure state 1`] = `
+exports[`Avatar Render should show image on success after a failure state 1`] = `
 <span
   class="ant-avatar ant-avatar-circle"
 >
@@ -158,7 +158,7 @@ exports[`Avatar Render > should show image on success after a failure state 1`]
 </span>
 `;
 
-exports[`Avatar Render > should show image on success after a failure state 2`] = `
+exports[`Avatar Render should show image on success after a failure state 2`] = `
 <span
   class="ant-avatar ant-avatar-circle ant-avatar-image"
 >
@@ -168,7 +168,7 @@ exports[`Avatar Render > should show image on success after a failure state 2`]
 </span>
 `;
 
-exports[`Avatar Render > support size is number 1`] = `
+exports[`Avatar Render support size is number 1`] = `
 <span
   class="ant-avatar ant-avatar-circle"
   style="width: 100px; height: 100px; line-height: 100px; font-size: 18px;"

components/avatar/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/avatar/demo/badge.tsx extend context correctly 1`] = `
 <div

components/avatar/__tests__/__snapshots__/demo.test.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/avatar/demo/badge.tsx correctly 1`] = `
 <div

components/back-top/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/back-top/demo/basic.tsx extend context correctly 1`] = `
 Array [

components/back-top/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/back-top/demo/basic.tsx correctly 1`] = `
 Array [

components/back-top/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`BackTop > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`BackTop rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-back-top ant-back-top-rtl"
 />

components/back-top/__tests__/index.test.tsx

@@ -6,17 +6,17 @@ import { fireEvent, render, waitFakeTimer } from '../../../tests/utils';
 
 describe('BackTop', () => {
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
   afterEach(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
   mountTest(BackTop);
   rtlTest(BackTop);
 
   it('should scroll to top after click it', async () => {
     const { container } = render(<BackTop />);
-    const scrollToSpy = vi.spyOn(window, 'scrollTo').mockImplementation((_, y) => {
+    const scrollToSpy = jest.spyOn(window, 'scrollTo').mockImplementation((_, y) => {
       window.scrollY = y;
       window.pageYOffset = y;
       document.documentElement.scrollTop = y;
@@ -31,20 +31,20 @@ describe('BackTop', () => {
   });
 
   it('support onClick', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(<BackTop onClick={onClick} visibilityHeight={0} />);
     fireEvent.click(container.querySelector<HTMLDivElement>('.ant-back-top')!);
     expect(onClick).toHaveBeenCalled();
   });
 
   it('invalid target', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(<BackTop onClick={onClick} target={undefined} />);
     fireEvent.click(container.querySelector<HTMLDivElement>('.ant-back-top')!);
     expect(onClick).toHaveBeenCalled();
   });
   it('should console Error', () => {
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<BackTop />);
     expect(errSpy).toHaveBeenCalledWith(
       'Warning: [antd: BackTop] `BackTop` is deprecated, please use `FloatButton.BackTop` instead.',

components/badge/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/badge/demo/basic.tsx extend context correctly 1`] = `
 <div

components/badge/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/badge/demo/basic.tsx correctly 1`] = `
 <div

components/badge/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Badge > render Badge status/color when contains children 1`] = `
+exports[`Badge render Badge status/color when contains children 1`] = `
 <div>
   <span
     class="ant-badge"
@@ -69,7 +69,7 @@ exports[`Badge > render Badge status/color when contains children 1`] = `
 </div>
 `;
 
-exports[`Badge > render correct with negative number 1`] = `
+exports[`Badge render correct with negative number 1`] = `
 <div>
   <span
     class="ant-badge ant-badge-not-a-wrapper"
@@ -154,13 +154,13 @@ exports[`Badge > render correct with negative number 1`] = `
 </div>
 `;
 
-exports[`Badge > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Badge rtl render component should be rendered correctly in RTL direction 1`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper ant-badge-rtl"
 />
 `;
 
-exports[`Badge > rtl render > component should be rendered correctly in RTL direction 2`] = `
+exports[`Badge rtl render component should be rendered correctly in RTL direction 2`] = `
 <span
   class="ant-badge ant-badge-rtl"
 >
@@ -190,7 +190,7 @@ exports[`Badge > rtl render > component should be rendered correctly in RTL dire
 </span>
 `;
 
-exports[`Badge > should be compatible with borderColor style 1`] = `
+exports[`Badge should be compatible with borderColor style 1`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -214,7 +214,7 @@ exports[`Badge > should be compatible with borderColor style 1`] = `
 </span>
 `;
 
-exports[`Badge > should display custom color and number is 0 1`] = `
+exports[`Badge should display custom color and number is 0 1`] = `
 <div>
   <span
     class="ant-badge ant-badge-not-a-wrapper"
@@ -265,7 +265,7 @@ exports[`Badge > should display custom color and number is 0 1`] = `
 </div>
 `;
 
-exports[`Badge > should render when count is changed 1`] = `
+exports[`Badge should render when count is changed 1`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -358,7 +358,7 @@ exports[`Badge > should render when count is changed 1`] = `
 </span>
 `;
 
-exports[`Badge > should render when count is changed 2`] = `
+exports[`Badge should render when count is changed 2`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -451,7 +451,7 @@ exports[`Badge > should render when count is changed 2`] = `
 </span>
 `;
 
-exports[`Badge > should render when count is changed 3`] = `
+exports[`Badge should render when count is changed 3`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -485,7 +485,7 @@ exports[`Badge > should render when count is changed 3`] = `
 </span>
 `;
 
-exports[`Badge > should render when count is changed 4`] = `
+exports[`Badge should render when count is changed 4`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -499,7 +499,7 @@ exports[`Badge > should render when count is changed 4`] = `
 </span>
 `;
 
-exports[`Badge > should render when count is changed 5`] = `
+exports[`Badge should render when count is changed 5`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -532,7 +532,7 @@ exports[`Badge > should render when count is changed 5`] = `
 </span>
 `;
 
-exports[`Badge > should render when count is changed 6`] = `
+exports[`Badge should render when count is changed 6`] = `
 <span
   class="ant-badge ant-badge-not-a-wrapper"
 >
@@ -615,7 +615,7 @@ exports[`Badge > should render when count is changed 6`] = `
 </span>
 `;
 
-exports[`Badge > should support offset when count is a ReactNode 1`] = `
+exports[`Badge should support offset when count is a ReactNode 1`] = `
 <span
   class="ant-badge"
 >

components/badge/__tests__/__snapshots__/ribbon.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Ribbon > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Ribbon rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-ribbon-wrapper"
 >

components/badge/__tests__/index.test.tsx

@@ -18,15 +18,15 @@ describe('Badge', () => {
   ));
 
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterEach(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('no strict warning', () => {
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     const { rerender } = render(
       <Badge dot>
         <span />
@@ -83,7 +83,7 @@ describe('Badge', () => {
 
     act(() => {
       fireEvent.mouseEnter(container.querySelector('.ant-badge')!);
-      vi.runAllTimers();
+      jest.runAllTimers();
     });
     expect(container.querySelector('.ant-tooltip-open')).toBeTruthy();
   });
@@ -95,7 +95,7 @@ describe('Badge', () => {
       rerender(<Badge count={count} />);
 
       act(() => {
-        vi.runAllTimers();
+        jest.runAllTimers();
         expect(asFragment().firstChild).toMatchSnapshot();
       });
     }

components/breadcrumb/__tests__/Breadcrumb.test.tsx

@@ -12,7 +12,7 @@ describe('Breadcrumb', () => {
   rtlTest(Breadcrumb);
   accessibilityTest(Breadcrumb);
 
-  const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+  const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
   afterEach(() => {
     errorSpy.mockReset();
@@ -326,7 +326,7 @@ describe('Breadcrumb', () => {
 
   it('should console Error when `overlay` in props', () => {
     resetWarned();
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(
       <Breadcrumb>
         <Breadcrumb.Item overlay={<div>test</div>} />
@@ -339,14 +339,14 @@ describe('Breadcrumb', () => {
   });
 
   it('should not console Error when `overlay` not in props', () => {
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Breadcrumb items={[{ path: '/', title: 'Test' }]} />);
     expect(errSpy).not.toHaveBeenCalled();
     errSpy.mockRestore();
   });
 
   it('should use `onClick`', async () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const wrapper = render(<Breadcrumb items={[{ title: 'test', onClick }]} />);
     const item = await wrapper.findByText('test');
     item.click();

components/breadcrumb/__tests__/__snapshots__/Breadcrumb.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Breadcrumb > filter React.Fragment 1`] = `
+exports[`Breadcrumb filter React.Fragment 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -36,7 +36,7 @@ exports[`Breadcrumb > filter React.Fragment 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Breadcrumb rtl render component should be rendered correctly in RTL direction 1`] = `
 <nav
   class="ant-breadcrumb ant-breadcrumb-rtl"
 >
@@ -44,7 +44,7 @@ exports[`Breadcrumb > rtl render > component should be rendered correctly in RTL
 </nav>
 `;
 
-exports[`Breadcrumb > should accept undefined items 1`] = `
+exports[`Breadcrumb should accept undefined items 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -52,7 +52,7 @@ exports[`Breadcrumb > should accept undefined items 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should allow Breadcrumb.Item is null or undefined 1`] = `
+exports[`Breadcrumb should allow Breadcrumb.Item is null or undefined 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -68,7 +68,7 @@ exports[`Breadcrumb > should allow Breadcrumb.Item is null or undefined 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should not display Breadcrumb Item when its children is falsy 1`] = `
+exports[`Breadcrumb should not display Breadcrumb Item when its children is falsy 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -97,7 +97,7 @@ exports[`Breadcrumb > should not display Breadcrumb Item when its children is fa
 </nav>
 `;
 
-exports[`Breadcrumb > should render a menu 1`] = `
+exports[`Breadcrumb should render a menu 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -177,7 +177,7 @@ exports[`Breadcrumb > should render a menu 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should render correct 1`] = `
+exports[`Breadcrumb should render correct 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -209,7 +209,7 @@ exports[`Breadcrumb > should render correct 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should support Breadcrumb.Item default separator 1`] = `
+exports[`Breadcrumb should support Breadcrumb.Item default separator 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -253,7 +253,7 @@ exports[`Breadcrumb > should support Breadcrumb.Item default separator 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should support React.Fragment and falsy children 1`] = `
+exports[`Breadcrumb should support React.Fragment and falsy children 1`] = `
 <nav
   class="ant-breadcrumb"
 >
@@ -302,7 +302,7 @@ exports[`Breadcrumb > should support React.Fragment and falsy children 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should support custom attribute 1`] = `
+exports[`Breadcrumb should support custom attribute 1`] = `
 <nav
   class="ant-breadcrumb"
   data-custom="custom"
@@ -333,7 +333,7 @@ exports[`Breadcrumb > should support custom attribute 1`] = `
 </nav>
 `;
 
-exports[`Breadcrumb > should support string \`0\` and number \`0\` 1`] = `
+exports[`Breadcrumb should support string \`0\` and number \`0\` 1`] = `
 <nav
   class="ant-breadcrumb"
 >

components/breadcrumb/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/breadcrumb/demo/basic.tsx extend context correctly 1`] = `
 <nav

components/breadcrumb/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/breadcrumb/demo/basic.tsx correctly 1`] = `
 <nav

components/breadcrumb/__tests__/__snapshots__/itemRender.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Breadcrumb.ItemRender > render as expect 1`] = `
+exports[`Breadcrumb.ItemRender render as expect 1`] = `
 <div>
   <nav
     class="ant-breadcrumb"

components/breadcrumb/__tests__/__snapshots__/router.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`react router > react router 3 1`] = `
+exports[`react router react router 3 1`] = `
 <nav
   class="ant-breadcrumb"
 >

components/breadcrumb/__tests__/router.test.tsx

@@ -25,11 +25,11 @@ const breadcrumbNameMap = {
 
 describe('react router', () => {
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('react router 6', () => {

components/button/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/button/demo/basic.tsx extend context correctly 1`] = `
 <div

components/button/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/button/demo/basic.tsx correctly 1`] = `
 <div

components/button/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Button > fixbug renders {0} , 0 and {false} 1`] = `
+exports[`Button fixbug renders {0} , 0 and {false} 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -9,7 +9,7 @@ exports[`Button > fixbug renders {0} , 0 and {false} 1`] = `
 </button>
 `;
 
-exports[`Button > fixbug renders {0} , 0 and {false} 2`] = `
+exports[`Button fixbug renders {0} , 0 and {false} 2`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -20,14 +20,14 @@ exports[`Button > fixbug renders {0} , 0 and {false} 2`] = `
 </button>
 `;
 
-exports[`Button > fixbug renders {0} , 0 and {false} 3`] = `
+exports[`Button fixbug renders {0} , 0 and {false} 3`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
 />
 `;
 
-exports[`Button > renders Chinese characters correctly 1`] = `
+exports[`Button renders Chinese characters correctly 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -38,7 +38,7 @@ exports[`Button > renders Chinese characters correctly 1`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 2`] = `
+exports[`Button renders Chinese characters correctly 2`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -72,7 +72,7 @@ exports[`Button > renders Chinese characters correctly 2`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 3`] = `
+exports[`Button renders Chinese characters correctly 3`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -102,7 +102,7 @@ exports[`Button > renders Chinese characters correctly 3`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 4`] = `
+exports[`Button renders Chinese characters correctly 4`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -136,7 +136,7 @@ exports[`Button > renders Chinese characters correctly 4`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 5`] = `
+exports[`Button renders Chinese characters correctly 5`] = `
 <button
   class="ant-btn ant-btn-default ant-btn-loading"
   type="button"
@@ -170,7 +170,7 @@ exports[`Button > renders Chinese characters correctly 5`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 6`] = `
+exports[`Button renders Chinese characters correctly 6`] = `
 <button
   class="ant-btn ant-btn-default ant-btn-loading"
   type="button"
@@ -205,7 +205,7 @@ exports[`Button > renders Chinese characters correctly 6`] = `
 </button>
 `;
 
-exports[`Button > renders Chinese characters correctly 7`] = `
+exports[`Button renders Chinese characters correctly 7`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -216,7 +216,7 @@ exports[`Button > renders Chinese characters correctly 7`] = `
 </button>
 `;
 
-exports[`Button > renders correctly 1`] = `
+exports[`Button renders correctly 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -227,52 +227,52 @@ exports[`Button > renders correctly 1`] = `
 </button>
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 1`] = `
 <button
   class="ant-btn ant-btn-default ant-btn-rtl"
   type="button"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 2`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 2`] = `
 <button
   class="ant-btn ant-btn-default ant-btn-lg ant-btn-rtl"
   type="button"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 3`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 3`] = `
 <button
   class="ant-btn ant-btn-default ant-btn-sm ant-btn-rtl"
   type="button"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 4`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 4`] = `
 <div
   class="ant-btn-group ant-btn-group-rtl"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 5`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 5`] = `
 <div
   class="ant-btn-group ant-btn-group-lg ant-btn-group-rtl"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 6`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 6`] = `
 <div
   class="ant-btn-group ant-btn-group-sm ant-btn-group-rtl"
 />
 `;
 
-exports[`Button > rtl render > component should be rendered correctly in RTL direction 7`] = `
+exports[`Button rtl render component should be rendered correctly in RTL direction 7`] = `
 <div
   class="ant-btn-group ant-btn-group-rtl"
 />
 `;
 
-exports[`Button > should handle fragment as children 1`] = `
+exports[`Button should handle fragment as children 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -283,7 +283,7 @@ exports[`Button > should handle fragment as children 1`] = `
 </button>
 `;
 
-exports[`Button > should merge text if children using variable 1`] = `
+exports[`Button should merge text if children using variable 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
@@ -294,7 +294,7 @@ exports[`Button > should merge text if children using variable 1`] = `
 </button>
 `;
 
-exports[`Button > should not render as link button when href is undefined 1`] = `
+exports[`Button should not render as link button when href is undefined 1`] = `
 <button
   class="ant-btn ant-btn-primary"
   type="button"
@@ -305,14 +305,14 @@ exports[`Button > should not render as link button when href is undefined 1`] =
 </button>
 `;
 
-exports[`Button > should render empty button without errors 1`] = `
+exports[`Button should render empty button without errors 1`] = `
 <button
   class="ant-btn ant-btn-default"
   type="button"
 />
 `;
 
-exports[`Button > should support custom icon className 1`] = `
+exports[`Button should support custom icon className 1`] = `
 <div>
   <button
     class="ant-btn ant-btn-primary ant-btn-icon-only"
@@ -345,7 +345,7 @@ exports[`Button > should support custom icon className 1`] = `
 </div>
 `;
 
-exports[`Button > should support custom icon styles 1`] = `
+exports[`Button should support custom icon styles 1`] = `
 <div>
   <button
     class="ant-btn ant-btn-primary ant-btn-icon-only"
@@ -379,7 +379,7 @@ exports[`Button > should support custom icon styles 1`] = `
 </div>
 `;
 
-exports[`Button > should support link button 1`] = `
+exports[`Button should support link button 1`] = `
 <a
   class="ant-btn ant-btn-default"
   href="https://ant.design"

components/button/__tests__/delay-timer.test.tsx

@@ -30,16 +30,16 @@ const Content = () => {
 
 it('Delay loading timer in Button component', () => {
   const otherTimer = 9528;
-  vi.spyOn<Window, 'setTimeout'>(window, 'setTimeout').mockReturnValue(otherTimer);
+  jest.spyOn<Window, 'setTimeout'>(window, 'setTimeout').mockReturnValue(otherTimer);
-  vi.restoreAllMocks();
+  jest.restoreAllMocks();
 
   const wrapper = render(<Content />);
 
   const btnTimer = 9527;
-  const setTimeoutMock = vi
+  const setTimeoutMock = jest
     .spyOn<Window, 'setTimeout'>(window, 'setTimeout')
     .mockReturnValue(btnTimer);
-  const clearTimeoutMock = vi.spyOn<Window, 'clearTimeout'>(window, 'clearTimeout');
+  const clearTimeoutMock = jest.spyOn<Window, 'clearTimeout'>(window, 'clearTimeout');
 
   // other component may call setTimeout or clearTimeout
   const setTimeoutCount = () => {
@@ -89,7 +89,7 @@ it('Delay loading timer in Button component', () => {
   expect(setTimeoutCount()).toBe(3);
   expect(clearTimeoutCount()).toBe(2);
 
-  vi.restoreAllMocks();
+  jest.restoreAllMocks();
 });
 it('Delay loading while use loading delay at first time', () => {
   const Demo = () => <Button loading={{ delay: specialDelay }} />;

components/button/__tests__/index.test.tsx

@@ -37,7 +37,7 @@ describe('Button', () => {
 
   it('warns if size is wrong', () => {
     resetWarned();
-    const mockWarn = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const mockWarn = jest.spyOn(console, 'error').mockImplementation(() => {});
     const size = 'who am I';
     // @ts-expect-error: Type '"who am I"' is not assignable to type 'SizeType'.ts(2322)
     render(<Button.Group size={size} />);
@@ -177,22 +177,22 @@ describe('Button', () => {
   });
 
   it('reset when loading back of delay', () => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
     const { rerender, container } = render(<Button loading={{ delay: 1000 }} />);
     rerender(<Button loading={{ delay: 2000 }} />);
     rerender(<Button loading={false} />);
 
     act(() => {
-      vi.runAllTimers();
+      jest.runAllTimers();
     });
 
     expect(container.querySelectorAll('.ant-btn-loading')).toHaveLength(0);
 
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('should not clickable when button is loading', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(
       <Button loading onClick={onClick}>
         button
@@ -238,7 +238,7 @@ describe('Button', () => {
   });
 
   it('should support to change loading', async () => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
     const { container, rerender, unmount } = render(<Button>Button</Button>);
     rerender(<Button loading />);
     expect(container.querySelectorAll('.ant-btn-loading').length).toBe(1);
@@ -252,12 +252,12 @@ describe('Button', () => {
     await waitFakeTimer();
     expect(container.querySelectorAll('.ant-btn-loading').length).toBe(0);
     expect(unmount).not.toThrow();
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('should warning when pass a string as icon props', () => {
     resetWarned();
-    const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
     render(<Button type="primary" icon="ab" />);
     expect(warnSpy).not.toHaveBeenCalled();
@@ -272,7 +272,7 @@ describe('Button', () => {
 
   it('should warning when pass type=link and ghost=true', () => {
     resetWarned();
-    const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Button type="link" ghost />);
     expect(warnSpy).toHaveBeenCalledWith(
       "Warning: [antd: Button] `link` or `text` button can't be a `ghost` button.",
@@ -282,7 +282,7 @@ describe('Button', () => {
 
   it('should warning when pass type=text and ghost=true', () => {
     resetWarned();
-    const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const warnSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Button type="text" ghost />);
     expect(warnSpy).toHaveBeenCalledWith(
       "Warning: [antd: Button] `link` or `text` button can't be a `ghost` button.",
@@ -305,7 +305,7 @@ describe('Button', () => {
   });
 
   it('should not redirect when button is disabled', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(
       <Button href="https://ant.design" onClick={onClick} disabled>
         click me

components/button/__tests__/wave.test.tsx

@@ -3,26 +3,28 @@ import React from 'react';
 import Button from '..';
 import { act, fireEvent, render } from '../../../tests/utils';
 
-vi.mock('rc-util/es/Dom/isVisible', () => ({ default: () => true }));
+jest.mock('rc-util/lib/Dom/isVisible', () => {
+  const mockFn = () => true;
+  return mockFn;
+});
 
 describe('click wave effect', () => {
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
-  afterEach(async () => {
+  afterEach(() => {
-    await vi.runAllTimersAsync();
+    jest.clearAllTimers();
-    vi.clearAllTimers();
+    jest.useRealTimers();
-    vi.useRealTimers();
     document.body.innerHTML = '';
   });
 
   async function clickButton(container: HTMLElement) {
     const element = container.firstChild;
     // https://github.com/testing-library/user-event/issues/833
-    await userEvent.setup({ advanceTimers: vi.advanceTimersByTime }).click(element as Element);
+    await userEvent.setup({ advanceTimers: jest.advanceTimersByTime }).click(element as Element);
     act(() => {
-      vi.advanceTimersByTime(100);
+      jest.advanceTimersByTime(100);
     });
 
     fireEvent(element!, new Event('transitionstart'));

components/calendar/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/calendar/demo/basic.tsx extend context correctly 1`] = `
 <div
@@ -74,7 +74,7 @@ exports[`renders components/calendar/demo/basic.tsx extend context correctly 1`]
           >
             <div
               class="rc-virtual-list-holder"
-              style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+              style="max-height: 256px; overflow-y: auto;"
             >
               <div>
                 <div
@@ -521,7 +521,7 @@ exports[`renders components/calendar/demo/basic.tsx extend context correctly 1`]
           >
             <div
               class="rc-virtual-list-holder"
-              style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+              style="max-height: 256px; overflow-y: auto;"
             >
               <div>
                 <div
@@ -1659,7 +1659,7 @@ exports[`renders components/calendar/demo/card.tsx extend context correctly 1`]
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -2106,7 +2106,7 @@ exports[`renders components/calendar/demo/card.tsx extend context correctly 1`]
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -3243,7 +3243,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -3690,7 +3690,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -4823,7 +4823,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -5270,7 +5270,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -6448,7 +6448,7 @@ exports[`renders components/calendar/demo/customize-header.tsx extend context co
                 >
                   <div
                     class="rc-virtual-list-holder"
-                    style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                    style="max-height: 256px; overflow-y: auto;"
                   >
                     <div>
                       <div
@@ -6920,7 +6920,7 @@ exports[`renders components/calendar/demo/customize-header.tsx extend context co
                 >
                   <div
                     class="rc-virtual-list-holder"
-                    style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                    style="max-height: 256px; overflow-y: auto;"
                   >
                     <div>
                       <div
@@ -8041,7 +8041,7 @@ exports[`renders components/calendar/demo/notice-calendar.tsx extend context cor
           >
             <div
               class="rc-virtual-list-holder"
-              style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+              style="max-height: 256px; overflow-y: auto;"
             >
               <div>
                 <div
@@ -8488,7 +8488,7 @@ exports[`renders components/calendar/demo/notice-calendar.tsx extend context cor
           >
             <div
               class="rc-virtual-list-holder"
-              style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+              style="max-height: 256px; overflow-y: auto;"
             >
               <div>
                 <div
@@ -10036,7 +10036,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div
@@ -10483,7 +10483,7 @@ Array [
             >
               <div
                 class="rc-virtual-list-holder"
-                style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                style="max-height: 256px; overflow-y: auto;"
               >
                 <div>
                   <div

components/calendar/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/calendar/demo/basic.tsx correctly 1`] = `
 <div

components/calendar/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Calendar > Calendar MonthSelect should display correct label 1`] = `
+exports[`Calendar Calendar MonthSelect should display correct label 1`] = `
 <div
   class="ant-picker-calendar ant-picker-calendar-full"
 >
@@ -946,7 +946,7 @@ exports[`Calendar > Calendar MonthSelect should display correct label 1`] = `
 </div>
 `;
 
-exports[`Calendar > Calendar should support locale 1`] = `
+exports[`Calendar Calendar should support locale 1`] = `
 <div
   class="ant-picker-calendar ant-picker-calendar-full"
 >
@@ -1892,7 +1892,7 @@ exports[`Calendar > Calendar should support locale 1`] = `
 </div>
 `;
 
-exports[`Calendar > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Calendar rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-picker-calendar ant-picker-calendar-full ant-picker-calendar-rtl"
 >
@@ -2838,7 +2838,7 @@ exports[`Calendar > rtl render > component should be rendered correctly in RTL d
 </div>
 `;
 
-exports[`Calendar > support Calendar.generateCalendar 1`] = `
+exports[`Calendar support Calendar.generateCalendar 1`] = `
 <div
   class="ant-picker-calendar ant-picker-calendar-full"
 >

components/calendar/__tests__/index.test.tsx

@@ -20,19 +20,17 @@ const ref: {
   calendarHeaderProps?: CalendarHeaderProps<unknown>;
 } = {};
 
-vi.mock('../Header', async (importOriginal) => {
+jest.mock('../Header', () => {
-  const HeaderModule = await importOriginal<typeof import('../Header')>();
+  const HeaderModule = jest.requireActual('../Header');
   const HeaderComponent = HeaderModule.default;
-  return {
+  return (props: CalendarHeaderProps<any>) => {
-    default: (props: CalendarHeaderProps<any>) => {
+    ref.calendarHeaderProps = props;
-      ref.calendarHeaderProps = props;
+    return <HeaderComponent {...props} />;
-      return <HeaderComponent {...props} />;
-    },
   };
 });
 
-vi.mock('rc-picker', async () => {
+jest.mock('rc-picker', () => {
-  const RcPicker = await vi.importActual<typeof import('rc-picker')>('rc-picker');
+  const RcPicker = jest.requireActual('rc-picker');
   const PickerPanelComponent = RcPicker.PickerPanel;
   return {
     ...RcPicker,
@@ -73,8 +71,8 @@ describe('Calendar', () => {
   it('Calendar should be selectable', () => {
     MockDate.set(Dayjs('2000-01-01').valueOf());
 
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(<Calendar onSelect={onSelect} onChange={onChange} />);
 
     fireEvent.click(container.querySelector('.ant-picker-cell')!);
@@ -89,7 +87,7 @@ describe('Calendar', () => {
   });
 
   it('only Valid range should be selectable', () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const validRange: [Dayjs.Dayjs, Dayjs.Dayjs] = [Dayjs('2018-02-02'), Dayjs('2018-02-18')];
     const wrapper = render(
       <Calendar onSelect={onSelect} validRange={validRange} defaultValue={Dayjs('2018-02-02')} />,
@@ -100,7 +98,7 @@ describe('Calendar', () => {
   });
 
   it('dates other than in valid range should be disabled', () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const validRange: [Dayjs.Dayjs, Dayjs.Dayjs] = [Dayjs('2018-02-02'), Dayjs('2018-02-18')];
     const { container } = render(
       <Calendar onSelect={onSelect} validRange={validRange} defaultValue={Dayjs('2018-02-02')} />,
@@ -114,7 +112,7 @@ describe('Calendar', () => {
   });
 
   it('months other than in valid range should be disabled', () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const validRange: [Dayjs.Dayjs, Dayjs.Dayjs] = [Dayjs('2018-02-02'), Dayjs('2018-05-18')];
     const { container } = render(
       <Calendar
@@ -189,7 +187,7 @@ describe('Calendar', () => {
   it('Calendar should switch mode', () => {
     const monthMode = 'month';
     const yearMode = 'year';
-    const onPanelChangeStub = vi.fn();
+    const onPanelChangeStub = jest.fn();
     const wrapper = render(<Calendar mode={yearMode} onPanelChange={onPanelChangeStub} />);
     expect(ref.calendarHeaderProps?.mode).toEqual(yearMode);
     wrapper.rerender(<Calendar mode={monthMode} onPanelChange={onPanelChangeStub} />);
@@ -197,10 +195,10 @@ describe('Calendar', () => {
     expect(onPanelChangeStub).toHaveBeenCalledTimes(0);
   });
 
-  it('Calendar should support locale', async () => {
+  it('Calendar should support locale', () => {
     MockDate.set(Dayjs('2018-10-19').valueOf());
     // eslint-disable-next-line global-require
-    const zhCN = (await import('../locale/zh_CN')).default;
+    const zhCN = require('../locale/zh_CN').default;
     const wrapper = render(<Calendar locale={zhCN} />);
     expect(wrapper.container.children[0]).toMatchSnapshot();
     MockDate.reset();
@@ -208,7 +206,7 @@ describe('Calendar', () => {
 
   describe('onPanelChange', () => {
     it('trigger when click last month of date', () => {
-      const onPanelChange = vi.fn();
+      const onPanelChange = jest.fn();
       const date = Dayjs('1990-09-03');
       const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
 
@@ -219,7 +217,7 @@ describe('Calendar', () => {
     });
 
     it('not trigger when in same month', () => {
-      const onPanelChange = vi.fn();
+      const onPanelChange = jest.fn();
       const date = Dayjs('1990-09-03');
       const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
 
@@ -230,7 +228,7 @@ describe('Calendar', () => {
   });
 
   it('switch should work correctly without prop mode', async () => {
-    const onPanelChange = vi.fn();
+    const onPanelChange = jest.fn();
     const date = Dayjs(new Date(Date.UTC(2017, 7, 9, 8)));
     const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
 
@@ -270,7 +268,7 @@ describe('Calendar', () => {
     const value = Dayjs('1990-01-03');
     const start = Dayjs('2019-04-01');
     const end = Dayjs('2019-11-01');
-    const onValueChange = vi.fn();
+    const onValueChange = jest.fn();
     createWrapper(start, end, value, onValueChange);
     expect(onValueChange).toHaveBeenCalledWith(value.year(2019).month(3), 'year');
   });
@@ -279,7 +277,7 @@ describe('Calendar', () => {
     const value = Dayjs('1990-01-03');
     const start = Dayjs('2019-11-01');
     const end = Dayjs('2019-03-01');
-    const onValueChange = vi.fn();
+    const onValueChange = jest.fn();
     createWrapper(start, end, value, onValueChange);
     expect(onValueChange).toHaveBeenCalledWith(value.year(2019).month(10), 'year');
   });
@@ -288,7 +286,7 @@ describe('Calendar', () => {
     const value = Dayjs('2018-11-03');
     const start = Dayjs('2000-01-01');
     const end = Dayjs('2019-03-01');
-    const onValueChange = vi.fn();
+    const onValueChange = jest.fn();
     const wrapper = render(
       <Header
         prefixCls="ant-picker-calendar"
@@ -311,7 +309,7 @@ describe('Calendar', () => {
     const start = Dayjs('2018-11-01');
     const end = Dayjs('2019-03-01');
     const value = Dayjs('2018-12-03');
-    const onValueChange = vi.fn();
+    const onValueChange = jest.fn();
     const wrapper = render(
       <Header
         prefixCls="ant-picker-calendar"
@@ -330,7 +328,7 @@ describe('Calendar', () => {
   });
 
   it('onTypeChange should work correctly', () => {
-    const onTypeChange = vi.fn();
+    const onTypeChange = jest.fn();
     const value = Dayjs('2018-12-03');
     const wrapper = render(
       <Header
@@ -350,12 +348,12 @@ describe('Calendar', () => {
   });
 
   it('headerRender should work correctly', () => {
-    const onMonthChange = vi.fn();
+    const onMonthChange = jest.fn();
-    const onYearChange = vi.fn();
+    const onYearChange = jest.fn();
-    const onTypeChange = vi.fn();
+    const onTypeChange = jest.fn();
 
     // Year
-    const headerRender = vi.fn(({ value }) => {
+    const headerRender = jest.fn(({ value }) => {
       const year = value.year();
       const options = [];
       for (let i = year - 100; i < year + 100; i += 1) {
@@ -389,7 +387,7 @@ describe('Calendar', () => {
     expect(onYearChange).toHaveBeenCalled();
 
     // Month
-    const headerRenderWithMonth = vi.fn(({ value }) => {
+    const headerRenderWithMonth = jest.fn(({ value }) => {
       const start = 0;
       const end = 12;
       const monthOptions = [];
@@ -432,7 +430,7 @@ describe('Calendar', () => {
     expect(onMonthChange).toHaveBeenCalled();
 
     // Type
-    const headerRenderWithTypeChange = vi.fn(({ type }) => (
+    const headerRenderWithTypeChange = jest.fn(({ type }) => (
       <Group size="small" onChange={onTypeChange} value={type}>
         <Button value="month">Month</Button>
         <Button value="year">Year</Button>
@@ -480,7 +478,7 @@ describe('Calendar', () => {
   });
 
   it('when fullscreen is false, the element returned by dateFullCellRender should be interactive', () => {
-    const onClick = vi.fn();
+    const onClick = jest.fn();
     const { container } = render(
       <Calendar
         fullscreen={false}
@@ -498,7 +496,7 @@ describe('Calendar', () => {
   it('deprecated dateCellRender and monthCellRender', () => {
     resetWarned();
 
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     const { container } = render(
       <Calendar
         dateCellRender={() => <div className="bamboo">Light</div>}
@@ -522,7 +520,7 @@ describe('Calendar', () => {
   it('deprecated dateFullCellRender and monthFullCellRender', () => {
     resetWarned();
 
-    const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     const { container } = render(
       <Calendar
         dateFullCellRender={() => <div className="bamboo">Light</div>}
@@ -542,12 +540,12 @@ describe('Calendar', () => {
   });
 
   it('support Calendar.generateCalendar', () => {
-    vi.useFakeTimers().setSystemTime(new Date('2000-01-01'));
+    jest.useFakeTimers().setSystemTime(new Date('2000-01-01'));
 
     const MyCalendar = Calendar.generateCalendar(dayjsGenerateConfig);
     const { container } = render(<MyCalendar />);
     expect(container.firstChild).toMatchSnapshot();
 
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 });

components/calendar/__tests__/select.test.tsx

@@ -13,16 +13,16 @@ describe('Calendar.onSelect', () => {
 
   beforeEach(() => {
     resetWarned();
-    vi.useFakeTimers();
+    jest.useFakeTimers();
-    vi.clearAllTimers();
+    jest.clearAllTimers();
   });
 
   afterEach(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('source of year select', async () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const { container } = render(<Calendar onSelect={onSelect} />);
 
     fireEvent.mouseDown(container.querySelector('.ant-select-selector')!);
@@ -35,20 +35,20 @@ describe('Calendar.onSelect', () => {
   });
 
   it('source of month select', async () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const { container } = render(<Calendar onSelect={onSelect} />);
 
     fireEvent.mouseDown(container.querySelectorAll('.ant-select-selector')[1]!);
     await waitFakeTimer();
 
-    fireEvent.click(container.querySelectorAll('.ant-select-item-option')[1]!);
+    fireEvent.click(container.querySelector('.ant-select-item-option')!);
     await waitFakeTimer();
 
     expect(onSelect).toHaveBeenCalledWith(expect.anything(), { source: 'month' });
   });
 
   it('source of customize', async () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const { container } = render(
       <Calendar
         onSelect={onSelect}
@@ -73,7 +73,7 @@ describe('Calendar.onSelect', () => {
   });
 
   it('source of date', () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
     const { container } = render(<Calendar onSelect={onSelect} />);
 
     fireEvent.click(container.querySelector('.ant-picker-cell')!);
@@ -81,8 +81,8 @@ describe('Calendar.onSelect', () => {
   });
 
   it('source of date with month panel', async () => {
-    const onSelect = vi.fn();
+    const onSelect = jest.fn();
-    const onPanelChange = vi.fn();
+    const onPanelChange = jest.fn();
     const { container } = render(<Calendar onSelect={onSelect} onPanelChange={onPanelChange} />);
 
     // Default is month radio

components/card/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/card/demo/basic.tsx extend context correctly 1`] = `
 <div

components/card/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/card/demo/basic.tsx correctly 1`] = `
 <div

components/card/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Card > correct pass tabList props 1`] = `
+exports[`Card correct pass tabList props 1`] = `
 <div
   class="ant-card ant-card-bordered ant-card-contain-tabs"
 >
@@ -263,7 +263,7 @@ exports[`Card > correct pass tabList props 1`] = `
 </div>
 `;
 
-exports[`Card > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Card rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-card ant-card-bordered ant-card-rtl"
 >
@@ -273,7 +273,7 @@ exports[`Card > rtl render > component should be rendered correctly in RTL direc
 </div>
 `;
 
-exports[`Card > should still have padding when card which set padding to 0 is loading 1`] = `
+exports[`Card should still have padding when card which set padding to 0 is loading 1`] = `
 <div
   class="ant-card ant-card-loading ant-card-bordered"
 >
@@ -303,7 +303,7 @@ exports[`Card > should still have padding when card which set padding to 0 is lo
 </div>
 `;
 
-exports[`Card > title should be vertically aligned 1`] = `
+exports[`Card title should be vertically aligned 1`] = `
 <div
   class="ant-card ant-card-bordered"
   style="width: 300px;"

components/card/__tests__/index.test.tsx

@@ -12,11 +12,11 @@ describe('Card', () => {
   rtlTest(Card);
 
   beforeAll(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterAll(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('should still have padding when card which set padding to 0 is loading', () => {
@@ -48,7 +48,7 @@ describe('Card', () => {
         tab: 'tab2',
       },
     ];
-    const onTabChange = vi.fn();
+    const onTabChange = jest.fn();
     render(
       <Card onTabChange={onTabChange} tabList={tabList}>
         xxx

components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/carousel/demo/autoplay.tsx extend context correctly 1`] = `
 <div

components/carousel/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/carousel/demo/autoplay.tsx correctly 1`] = `
 <div

components/carousel/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Carousel > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Carousel rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-carousel ant-carousel-rtl"
 >
@@ -19,7 +19,7 @@ exports[`Carousel > rtl render > component should be rendered correctly in RTL d
 </div>
 `;
 
-exports[`Carousel > should works for dotPosition > bottom 1`] = `
+exports[`Carousel should works for dotPosition bottom 1`] = `
 <div
   class="ant-carousel"
 >
@@ -53,7 +53,7 @@ exports[`Carousel > should works for dotPosition > bottom 1`] = `
 </div>
 `;
 
-exports[`Carousel > should works for dotPosition > left 1`] = `
+exports[`Carousel should works for dotPosition left 1`] = `
 <div
   class="ant-carousel ant-carousel-vertical"
 >
@@ -87,7 +87,7 @@ exports[`Carousel > should works for dotPosition > left 1`] = `
 </div>
 `;
 
-exports[`Carousel > should works for dotPosition > right 1`] = `
+exports[`Carousel should works for dotPosition right 1`] = `
 <div
   class="ant-carousel ant-carousel-vertical"
 >
@@ -121,7 +121,7 @@ exports[`Carousel > should works for dotPosition > right 1`] = `
 </div>
 `;
 
-exports[`Carousel > should works for dotPosition > top 1`] = `
+exports[`Carousel should works for dotPosition top 1`] = `
 <div
   class="ant-carousel"
 >

components/carousel/__tests__/index.test.tsx

@@ -10,11 +10,11 @@ describe('Carousel', () => {
   rtlTest(Carousel);
 
   beforeEach(() => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
   });
 
   afterEach(() => {
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('should has innerSlider', () => {
@@ -65,7 +65,7 @@ describe('Carousel', () => {
         <div>3</div>
       </Carousel>,
     );
-    const spy = vi.spyOn(ref.current?.innerSlider, 'autoPlay');
+    const spy = jest.spyOn(ref.current?.innerSlider, 'autoPlay');
     window.resizeTo(1000, window.outerHeight);
     expect(spy).not.toHaveBeenCalled();
     await waitFakeTimer();
@@ -80,13 +80,14 @@ describe('Carousel', () => {
         <div>3</div>
       </Carousel>,
     );
-    const spy = vi.spyOn(window, 'removeEventListener');
+    const spy = jest.spyOn(window, 'removeEventListener');
     unmount();
     expect(spy).toHaveBeenCalled();
   });
 
   describe('should works for dotPosition', () => {
     (['left', 'right', 'top', 'bottom'] as const).forEach((dotPosition) => {
+      // eslint-disable-next-line jest/valid-title
       it(dotPosition, () => {
         const { container } = render(
           <Carousel dotPosition={dotPosition}>

components/cascader/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/cascader/demo/basic.tsx extend context correctly 1`] = `
 <div

components/cascader/__tests__/__snapshots__/demo.test.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/cascader/demo/basic.tsx correctly 1`] = `
 <div

components/cascader/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Cascader > can be selected 1`] = `
+exports[`Cascader can be selected 1`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -132,7 +132,7 @@ exports[`Cascader > can be selected 1`] = `
 </div>
 `;
 
-exports[`Cascader > can be selected 2`] = `
+exports[`Cascader can be selected 2`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -282,7 +282,7 @@ exports[`Cascader > can be selected 2`] = `
 </div>
 `;
 
-exports[`Cascader > can be selected 3`] = `
+exports[`Cascader can be selected 3`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -432,7 +432,7 @@ exports[`Cascader > can be selected 3`] = `
 </div>
 `;
 
-exports[`Cascader > can be selected in RTL direction 1`] = `
+exports[`Cascader can be selected in RTL direction 1`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-cascader-dropdown-rtl ant-select-dropdown-placement-bottomRight"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -564,7 +564,7 @@ exports[`Cascader > can be selected in RTL direction 1`] = `
 </div>
 `;
 
-exports[`Cascader > can be selected in RTL direction 2`] = `
+exports[`Cascader can be selected in RTL direction 2`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-cascader-dropdown-rtl ant-select-dropdown-placement-bottomRight"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -714,7 +714,7 @@ exports[`Cascader > can be selected in RTL direction 2`] = `
 </div>
 `;
 
-exports[`Cascader > can be selected in RTL direction 3`] = `
+exports[`Cascader can be selected in RTL direction 3`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-cascader-dropdown-rtl ant-select-dropdown-placement-bottomRight"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -864,7 +864,7 @@ exports[`Cascader > can be selected in RTL direction 3`] = `
 </div>
 `;
 
-exports[`Cascader > legacy props > should support showCheckedStrategy child 1`] = `
+exports[`Cascader legacy props should support showCheckedStrategy child 1`] = `
 <div
   class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear ant-select-show-arrow ant-select-open"
 >
@@ -1041,7 +1041,7 @@ exports[`Cascader > legacy props > should support showCheckedStrategy child 1`]
 </div>
 `;
 
-exports[`Cascader > legacy props > should support showCheckedStrategy parent 1`] = `
+exports[`Cascader legacy props should support showCheckedStrategy parent 1`] = `
 <div
   class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear ant-select-show-arrow ant-select-open"
 >
@@ -1218,7 +1218,7 @@ exports[`Cascader > legacy props > should support showCheckedStrategy parent 1`]
 </div>
 `;
 
-exports[`Cascader > popup correctly with defaultValue 1`] = `
+exports[`Cascader popup correctly with defaultValue 1`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: auto;"
@@ -1368,7 +1368,7 @@ exports[`Cascader > popup correctly with defaultValue 1`] = `
 </div>
 `;
 
-exports[`Cascader > popup correctly with defaultValue RTL 1`] = `
+exports[`Cascader popup correctly with defaultValue RTL 1`] = `
 <div
   class="ant-select ant-cascader ant-select-rtl ant-select-single ant-select-allow-clear ant-select-show-arrow ant-select-open"
 >
@@ -1604,7 +1604,7 @@ exports[`Cascader > popup correctly with defaultValue RTL 1`] = `
 </div>
 `;
 
-exports[`Cascader > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Cascader rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-select ant-cascader ant-select-rtl ant-select-single ant-select-allow-clear ant-select-show-arrow"
 >
@@ -1664,11 +1664,11 @@ exports[`Cascader > rtl render > component should be rendered correctly in RTL d
 </div>
 `;
 
-exports[`Cascader > should highlight keyword and filter when search in Cascader 1`] = `"<div><div class=\\"ant-cascader-menus\\"><ul class=\\"ant-cascader-menu\\" role=\\"menu\\"><li class=\\"ant-cascader-menu-item\\" role=\\"menuitemcheckbox\\" aria-checked=\\"false\\" data-path-key=\\"zhejiang__RC_CASCADER_SPLIT__hangzhou__RC_CASCADER_SPLIT__xihu\\"><div class=\\"ant-cascader-menu-item-content\\"><span class=\\"ant-cascader-menu-item-keyword\\">Z</span>hejiang / Hang<span class=\\"ant-cascader-menu-item-keyword\\">z</span>hou / West Lake</div></li><li class=\\"ant-cascader-menu-item\\" role=\\"menuitemcheckbox\\" aria-checked=\\"false\\" data-path-key=\\"jiangsu__RC_CASCADER_SPLIT__nanjing__RC_CASCADER_SPLIT__zhonghuamen\\"><div class=\\"ant-cascader-menu-item-content\\">Jiangsu / Nanjing / <span class=\\"ant-cascader-menu-item-keyword\\">Z</span>hong Hua Men</div></li></ul></div></div>"`;
+exports[`Cascader should highlight keyword and filter when search in Cascader 1`] = `"<div><div class="ant-cascader-menus"><ul class="ant-cascader-menu" role="menu"><li class="ant-cascader-menu-item" role="menuitemcheckbox" aria-checked="false" data-path-key="zhejiang__RC_CASCADER_SPLIT__hangzhou__RC_CASCADER_SPLIT__xihu"><div class="ant-cascader-menu-item-content"><span class="ant-cascader-menu-item-keyword">Z</span>hejiang / Hang<span class="ant-cascader-menu-item-keyword">z</span>hou / West Lake</div></li><li class="ant-cascader-menu-item" role="menuitemcheckbox" aria-checked="false" data-path-key="jiangsu__RC_CASCADER_SPLIT__nanjing__RC_CASCADER_SPLIT__zhonghuamen"><div class="ant-cascader-menu-item-content">Jiangsu / Nanjing / <span class="ant-cascader-menu-item-keyword">Z</span>hong Hua Men</div></li></ul></div></div>"`;
 
-exports[`Cascader > should highlight keyword and filter when search in Cascader with same field name of label and value 1`] = `"<div><div class=\\"ant-cascader-menus\\"><ul class=\\"ant-cascader-menu\\" role=\\"menu\\"><li class=\\"ant-cascader-menu-item\\" role=\\"menuitemcheckbox\\" aria-checked=\\"false\\" data-path-key=\\"Zhejiang__RC_CASCADER_SPLIT__Hangzhou__RC_CASCADER_SPLIT__West Lake\\"><div class=\\"ant-cascader-menu-item-content\\"><span class=\\"ant-cascader-menu-item-keyword\\">Z</span>hejiang / Hang<span class=\\"ant-cascader-menu-item-keyword\\">z</span>hou / West Lake</div></li><li class=\\"ant-cascader-menu-item ant-cascader-menu-item-disabled\\" role=\\"menuitemcheckbox\\" aria-checked=\\"false\\" data-path-key=\\"Zhejiang__RC_CASCADER_SPLIT__Hangzhou__RC_CASCADER_SPLIT__Xia Sha\\"><div class=\\"ant-cascader-menu-item-content\\"><span class=\\"ant-cascader-menu-item-keyword\\">Z</span>hejiang / Hang<span class=\\"ant-cascader-menu-item-keyword\\">z</span>hou / Xia Sha</div></li></ul></div></div>"`;
+exports[`Cascader should highlight keyword and filter when search in Cascader with same field name of label and value 1`] = `"<div><div class="ant-cascader-menus"><ul class="ant-cascader-menu" role="menu"><li class="ant-cascader-menu-item" role="menuitemcheckbox" aria-checked="false" data-path-key="Zhejiang__RC_CASCADER_SPLIT__Hangzhou__RC_CASCADER_SPLIT__West Lake"><div class="ant-cascader-menu-item-content"><span class="ant-cascader-menu-item-keyword">Z</span>hejiang / Hang<span class="ant-cascader-menu-item-keyword">z</span>hou / West Lake</div></li><li class="ant-cascader-menu-item ant-cascader-menu-item-disabled" role="menuitemcheckbox" aria-checked="false" data-path-key="Zhejiang__RC_CASCADER_SPLIT__Hangzhou__RC_CASCADER_SPLIT__Xia Sha"><div class="ant-cascader-menu-item-content"><span class="ant-cascader-menu-item-keyword">Z</span>hejiang / Hang<span class="ant-cascader-menu-item-keyword">z</span>hou / Xia Sha</div></li></ul></div></div>"`;
 
-exports[`Cascader > should render not found content 1`] = `
+exports[`Cascader should render not found content 1`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-empty ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: 0;"
@@ -1743,7 +1743,7 @@ exports[`Cascader > should render not found content 1`] = `
 </div>
 `;
 
-exports[`Cascader > should show not found content when options.length is 0 1`] = `
+exports[`Cascader should show not found content when options.length is 0 1`] = `
 <div
   class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up ant-cascader-dropdown ant-select-dropdown-empty ant-select-dropdown-placement-bottomLeft"
   style="--arrow-x: 0px; --arrow-y: 0px; left: -1000vw; top: -1000vh; box-sizing: border-box; min-width: 0;"
@@ -1818,7 +1818,7 @@ exports[`Cascader > should show not found content when options.length is 0 1`] =
 </div>
 `;
 
-exports[`Cascader > support controlled mode 1`] = `
+exports[`Cascader support controlled mode 1`] = `
 <div
   class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow"
 >

components/cascader/__tests__/index.test.tsx

@@ -90,7 +90,7 @@ describe('Cascader', () => {
   });
 
   it('popup correctly when panel is open', () => {
-    const onPopupVisibleChange = vi.fn();
+    const onPopupVisibleChange = jest.fn();
     const { container } = render(
       <Cascader options={options} onPopupVisibleChange={onPopupVisibleChange} />,
     );
@@ -123,7 +123,7 @@ describe('Cascader', () => {
   });
 
   it('can be selected', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(<Cascader open options={options} onChange={onChange} />);
 
     clickOption(container, 0, 0);
@@ -284,7 +284,7 @@ describe('Cascader', () => {
       },
     ];
 
-    const onChange = vi.fn();
+    const onChange = jest.fn();
 
     const { container } = render(
       <Cascader
@@ -320,7 +320,7 @@ describe('Cascader', () => {
   });
 
   describe('limit filtered item count', () => {
-    const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
     afterAll(() => {
       errorSpy.mockRestore();
@@ -353,8 +353,9 @@ describe('Cascader', () => {
   });
 
   // FIXME: Move to `rc-tree-select` instead
+  // eslint-disable-next-line jest/no-disabled-tests
   it.skip('should warning if not find `value` in `options`', () => {
-    const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Cascader options={[{ label: 'a', value: 'a', children: [{ label: 'b' }] }]} />);
     expect(errorSpy).toHaveBeenCalledWith(
       'Warning: [antd: Cascader] Not found `value` in `options`.',
@@ -409,7 +410,8 @@ describe('Cascader', () => {
     const { container } = render(<Cascader options={customOptions} placement="topRight" />);
     toggleOpen(container);
 
-    expect(globalThis.triggerProps.popupPlacement).toEqual('topRight');
+    // Inject in tests/__mocks__/rc-trigger.js
+    expect((global as any)?.triggerProps.popupPlacement).toEqual('topRight');
   });
 
   it('popup correctly with defaultValue RTL', () => {
@@ -456,7 +458,7 @@ describe('Cascader', () => {
         ],
       },
     ];
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <ConfigProvider direction="rtl">
         <Cascader
@@ -492,7 +494,7 @@ describe('Cascader', () => {
   });
 
   it('can be selected when showSearch', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(<Cascader options={options} onChange={onChange} showSearch />);
     fireEvent.change(container.querySelector('input')!, { target: { value: 'Zh' } });
 
@@ -512,7 +514,7 @@ describe('Cascader', () => {
   });
 
   it('onChange works correctly when the label of fieldNames is the same as value', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const sameNames = { label: 'label', value: 'label' };
     const { container } = render(
       <Cascader options={options} onChange={onChange} showSearch fieldNames={sameNames} />,
@@ -526,20 +528,21 @@ describe('Cascader', () => {
     const { container } = render(<Cascader options={options} direction="rtl" />);
     toggleOpen(container);
 
-    expect(globalThis.triggerProps.popupPlacement).toEqual('bottomRight');
+    // Inject in tests/__mocks__/rc-trigger.js
+    expect((global as any).triggerProps.popupPlacement).toEqual('bottomRight');
   });
 
   describe('legacy props', () => {
     it('popupPlacement', () => {
       render(<Cascader open popupPlacement="bottomLeft" />);
-      // Inject in __mocks__/@rc-component/trigger.tsx
+      // Inject in tests/__mocks__/rc-trigger.js
       expect((global as any).triggerProps.popupPlacement).toEqual('bottomLeft');
     });
 
     it('legacy dropdownClassName', () => {
       resetWarned();
 
-      const errSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+      const errSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
       const { container } = render(<Cascader dropdownClassName="legacy" open />);
       expect(errSpy).toHaveBeenCalledWith(
         'Warning: [antd: Cascader] `dropdownClassName` is deprecated. Please use `popupClassName` instead.',

components/cascader/index.tsx

@@ -335,7 +335,7 @@ if (process.env.NODE_ENV !== 'production') {
 }
 
 // We don't care debug panel
-/* c8 ignore next */
+/* istanbul ignore next */
 const PurePanel = genPurePanel(Cascader);
 
 Cascader.SHOW_PARENT = SHOW_PARENT;

components/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Checkbox > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`Checkbox rtl render component should be rendered correctly in RTL direction 1`] = `
 <label
   class="ant-checkbox-wrapper ant-checkbox-rtl"
 >

components/checkbox/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/checkbox/demo/basic.tsx extend context correctly 1`] = `
 <label

components/checkbox/__tests__/__snapshots__/demo.test.tsx.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/checkbox/demo/basic.tsx correctly 1`] = `
 <label

components/checkbox/__tests__/__snapshots__/group.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`CheckboxGroup > passes prefixCls down to checkbox 1`] = `
+exports[`CheckboxGroup passes prefixCls down to checkbox 1`] = `
 <div
   class="my-checkbox-group"
 >
@@ -46,7 +46,7 @@ exports[`CheckboxGroup > passes prefixCls down to checkbox 1`] = `
 </div>
 `;
 
-exports[`CheckboxGroup > rtl render > component should be rendered correctly in RTL direction 1`] = `
+exports[`CheckboxGroup rtl render component should be rendered correctly in RTL direction 1`] = `
 <div
   class="ant-checkbox-group ant-checkbox-group-rtl"
 />

components/checkbox/__tests__/checkbox.test.tsx

@@ -12,8 +12,8 @@ describe('Checkbox', () => {
   rtlTest(Checkbox);
 
   it('responses hover events', () => {
-    const onMouseEnter = vi.fn();
+    const onMouseEnter = jest.fn();
-    const onMouseLeave = vi.fn();
+    const onMouseLeave = jest.fn();
 
     const { container } = render(
       <Checkbox onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} />,
@@ -29,7 +29,7 @@ describe('Checkbox', () => {
   it('warning if set `value`', () => {
     resetWarned();
 
-    const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+    const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
     render(<Checkbox value />);
     expect(errorSpy).toHaveBeenCalledWith(
       'Warning: [antd: Checkbox] `value` is not a valid prop, do you mean `checked`?',

components/checkbox/__tests__/group.test.tsx

@@ -14,7 +14,7 @@ describe('CheckboxGroup', () => {
   rtlTest(Checkbox.Group);
 
   it('should work basically', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Checkbox.Group options={['Apple', 'Pear', 'Orange']} onChange={onChange} />,
     );
@@ -29,7 +29,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('does not trigger onChange callback of both Checkbox and CheckboxGroup when CheckboxGroup is disabled', () => {
-    const onChangeGroup = vi.fn();
+    const onChangeGroup = jest.fn();
 
     const options = [
       { label: 'Apple', value: 'Apple' },
@@ -46,7 +46,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('does not prevent onChange callback from Checkbox when CheckboxGroup is not disabled', () => {
-    const onChangeGroup = vi.fn();
+    const onChangeGroup = jest.fn();
 
     const options = [
       { label: 'Apple', value: 'Apple' },
@@ -94,7 +94,7 @@ describe('CheckboxGroup', () => {
 
   // https://github.com/ant-design/ant-design/issues/12642
   it('should trigger onChange in sub Checkbox', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Checkbox.Group>
         <Checkbox value="my" onChange={onChange} />
@@ -107,7 +107,7 @@ describe('CheckboxGroup', () => {
 
   // https://github.com/ant-design/ant-design/issues/16376
   it('onChange should filter removed value', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container, rerender } = render(
       <Checkbox.Group defaultValue={[1]} onChange={onChange}>
         <Checkbox key={1} value={1} />
@@ -126,7 +126,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('checkbox should register value again after value changed', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container, rerender } = render(
       <Checkbox.Group defaultValue={[1]} onChange={onChange}>
         <Checkbox key={1} value={1} />
@@ -144,7 +144,7 @@ describe('CheckboxGroup', () => {
 
   // https://github.com/ant-design/ant-design/issues/17297
   it('onChange should keep the order of the original values', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Checkbox.Group onChange={onChange}>
         <Checkbox key={1} value={1} />
@@ -194,7 +194,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('skipGroup', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Checkbox.Group onChange={onChange}>
         <Checkbox value={1} />
@@ -206,7 +206,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('Table rowSelection', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
     const { container } = render(
       <Checkbox.Group onChange={onChange}>
         <Table
@@ -227,7 +227,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('should support number option', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
 
     const { container } = render(
       <Checkbox.Group options={[1, 'Pear', 'Orange']} onChange={onChange} />,
@@ -238,7 +238,7 @@ describe('CheckboxGroup', () => {
   });
 
   it('should store latest checkbox value if changed', () => {
-    const onChange = vi.fn();
+    const onChange = jest.fn();
 
     const Demo: React.FC = () => {
       const [v, setV] = useState('');

components/col/style/index.ts

@@ -1,4 +1,4 @@
 // Compatible for babel-plugin-import
 
-/* c8 ignore next */
+/* istanbul ignore next */
 export default {};

components/collapse/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/collapse/demo/accordion.tsx extend context correctly 1`] = `
 <div
@@ -1016,7 +1016,7 @@ Array [
         >
           <div
             class="rc-virtual-list-holder"
-            style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+            style="max-height: 256px; overflow-y: auto;"
           >
             <div>
               <div

components/collapse/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/collapse/demo/accordion.tsx correctly 1`] = `
 <div

components/collapse/__tests__/__snapshots__/index.test.tsx.snap

@@ -1,6 +1,6 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Collapse > Collapse.Panel usage 1`] = `
+exports[`Collapse Collapse.Panel usage 1`] = `
 <div
   class="ant-collapse ant-collapse-icon-position-start ant-collapse-borderless"
 >
@@ -87,7 +87,7 @@ exports[`Collapse > Collapse.Panel usage 1`] = `
 </div>
 `;
 
-exports[`Collapse > could override default openMotion 1`] = `
+exports[`Collapse could override default openMotion 1`] = `
 <div
   class="ant-collapse ant-collapse-icon-position-start"
 >
@@ -144,7 +144,7 @@ exports[`Collapse > could override default openMotion 1`] = `
 </div>
 `;
 
-exports[`Collapse > should render extra node of panel 1`] = `
+exports[`Collapse should render extra node of panel 1`] = `
 <div
   class="ant-collapse ant-collapse-icon-position-start"
 >
@@ -249,7 +249,7 @@ exports[`Collapse > should render extra node of panel 1`] = `
 </div>
 `;
 
-exports[`Collapse > should support remove expandIcon 1`] = `
+exports[`Collapse should support remove expandIcon 1`] = `
 <div
   class="ant-collapse ant-collapse-icon-position-start"
 >

components/collapse/__tests__/index.test.tsx

@@ -1,18 +1,19 @@
 import React from 'react';
 import { act } from 'react-dom/test-utils';
-import { vi } from 'vitest';
 import { fireEvent, render, waitFakeTimer } from '../../../tests/utils';
 import { resetWarned } from '../../_util/warning';
-import Collapse from '../Collapse';
 
 describe('Collapse', () => {
-  const errorSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
+  // eslint-disable-next-line global-require
+  const Collapse = require('..').default;
+
+  const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
 
   // fix React concurrent
   function triggerAllTimer() {
     for (let i = 0; i < 10; i += 1) {
       act(() => {
-        vi.runAllTimers();
+        jest.runAllTimers();
       });
     }
   }
@@ -32,7 +33,7 @@ describe('Collapse', () => {
   it('should support remove expandIcon', () => {
     const { asFragment } = render(
       <Collapse expandIcon={() => null}>
-        <Collapse.Panel key={1} header="header" />
+        <Collapse.Panel header="header" />
       </Collapse>,
     );
     expect(asFragment().firstChild).toMatchSnapshot();
@@ -55,7 +56,7 @@ describe('Collapse', () => {
           </button>
         )}
       >
-        <Collapse.Panel key={1} header="header" />
+        <Collapse.Panel header="header" />
       </Collapse>,
     );
 
@@ -65,15 +66,15 @@ describe('Collapse', () => {
   it('should render extra node of panel', () => {
     const { asFragment } = render(
       <Collapse>
-        <Collapse.Panel header="header" key={1} extra={<button type="button">action</button>} />
+        <Collapse.Panel header="header" extra={<button type="button">action</button>} />
-        <Collapse.Panel header="header" key={2} extra={<button type="button">action</button>} />
+        <Collapse.Panel header="header" extra={<button type="button">action</button>} />
       </Collapse>,
     );
     expect(asFragment().firstChild).toMatchSnapshot();
   });
 
   it('could be expand and collapse', async () => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
     const { container } = render(
       <Collapse>
         <Collapse.Panel header="This is panel header 1" key="1">
@@ -89,13 +90,12 @@ describe('Collapse', () => {
     expect(
       container.querySelector('.ant-collapse-item')?.classList.contains('ant-collapse-item-active'),
     ).toBe(true);
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('could override default openMotion', () => {
-    const props = { openMotion: {} };
     const { container, asFragment } = render(
-      <Collapse {...props}>
+      <Collapse openMotion={{}}>
         <Collapse.Panel header="This is panel header 1" key="1">
           content
         </Collapse.Panel>
@@ -153,8 +153,8 @@ describe('Collapse', () => {
   });
 
   it('should end motion when set activeKey while hiding', async () => {
-    vi.useFakeTimers();
+    jest.useFakeTimers();
-    const spiedRAF = vi
+    const spiedRAF = jest
       .spyOn(window, 'requestAnimationFrame')
       .mockImplementation((cb) => setTimeout(cb, 16.66));
 
@@ -185,7 +185,7 @@ describe('Collapse', () => {
     expect(container.querySelectorAll('.ant-motion-collapse').length).toBe(0);
 
     spiedRAF.mockRestore();
-    vi.useRealTimers();
+    jest.useRealTimers();
   });
 
   it('ref should work', () => {
@@ -213,26 +213,28 @@ describe('Collapse', () => {
   });
 
   describe('expandIconPosition', () => {
-    it.each(['left', 'right'] as const)(`warning for legacy %s'`, (pos) => {
+    ['left', 'right'].forEach((pos) => {
-      render(
+      it(`warning for legacy '${pos}'`, () => {
-        <Collapse expandIconPosition={pos}>
+        render(
-          <Collapse.Panel header="header" key="1" />
+          <Collapse expandIconPosition={pos}>
-        </Collapse>,
+            <Collapse.Panel header="header" key="1" />
-      );
+          </Collapse>,
+        );
 
-      expect(errorSpy).toHaveBeenCalledWith(
+        expect(errorSpy).toHaveBeenCalledWith(
-        'Warning: [antd: Collapse] `expandIconPosition` with `left` or `right` is deprecated. Please use `start` or `end` instead.',
+          'Warning: [antd: Collapse] `expandIconPosition` with `left` or `right` is deprecated. Please use `start` or `end` instead.',
-      );
+        );
-    });
+      });
 
-    it('position end', () => {
+      it('position end', () => {
-      const { container } = render(
+        const { container } = render(
-        <Collapse expandIconPosition="end">
+          <Collapse expandIconPosition="end">
-          <Collapse.Panel header="header" key="1" />
+            <Collapse.Panel header="header" key="1" />
-        </Collapse>,
+          </Collapse>,
-      );
+        );
 
-      expect(container.querySelector('.ant-collapse-icon-position-end')).toBeTruthy();
+        expect(container.querySelector('.ant-collapse-icon-position-end')).toBeTruthy();
+      });
     });
   });
 

components/color-picker/ColorPicker.tsx

@@ -194,7 +194,7 @@ if (process.env.NODE_ENV !== 'production') {
 const PurePanel = genPurePanel(
   ColorPicker,
   'color-picker',
-  /* c8 ignore next */
+  /* istanbul ignore next */
   (prefixCls) => prefixCls,
   (props: ColorPickerProps) => ({
     ...props,

components/color-picker/__tests__/__snapshots__/demo-extend.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/color-picker/demo/allowClear.tsx extend context correctly 1`] = `
 Array [
@@ -190,7 +190,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -572,7 +572,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -954,7 +954,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -1336,7 +1336,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -1738,7 +1738,7 @@ exports[`renders components/color-picker/demo/format.tsx extend context correctl
                                 >
                                   <div
                                     class="rc-virtual-list-holder"
-                                    style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                                    style="max-height: 256px; overflow-y: auto;"
                                   >
                                     <div>
                                       <div
@@ -2149,7 +2149,7 @@ exports[`renders components/color-picker/demo/format.tsx extend context correctl
                                 >
                                   <div
                                     class="rc-virtual-list-holder"
-                                    style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                                    style="max-height: 256px; overflow-y: auto;"
                                   >
                                     <div>
                                       <div
@@ -2777,7 +2777,7 @@ exports[`renders components/color-picker/demo/format.tsx extend context correctl
                                 >
                                   <div
                                     class="rc-virtual-list-holder"
-                                    style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                                    style="max-height: 256px; overflow-y: auto;"
                                   >
                                     <div>
                                       <div
@@ -3394,7 +3394,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -4153,7 +4153,7 @@ exports[`renders components/color-picker/demo/pure-panel.tsx extend context corr
                         >
                           <div
                             class="rc-virtual-list-holder"
-                            style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                            style="max-height: 256px; overflow-y: auto;"
                           >
                             <div>
                               <div
@@ -4533,7 +4533,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div
@@ -4915,7 +4915,7 @@ Array [
                       >
                         <div
                           class="rc-virtual-list-holder"
-                          style="max-height: 256px; overflow-y: auto; overflow-anchor: none;"
+                          style="max-height: 256px; overflow-y: auto;"
                         >
                           <div>
                             <div

components/color-picker/__tests__/__snapshots__/demo.test.ts.snap

@@ -1,4 +1,4 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+// Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders components/color-picker/demo/allowClear.tsx correctly 1`] = `
 <div