mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-23 18:50:06 +08:00
Code Issues Actions 14 Packages Projects Releases Wiki Activity

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

Browse Source 
This reverts commit 6759887c44.
This commit is contained in:
MadCcc 2023-06-07 21:59:21 +08:00 committed by GitHub
parent 80264a7aa5
commit 7322aa6f5f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
444 changed files with 3577 additions and 3489 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.eslintignore
View File

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

27
.eslintrc.js
View File

@ -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: [
'react',
'@babel',
'vitest',
'@typescript-eslint',
'react-hooks',
'unicorn',
'markdown',
],
plugins: ['react', '@babel', 'jest', '@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,
'vitest/expect-expect': 0,
'vitest/no-done-callback': 0,
'vitest/valid-title': 0,
'vitest/no-conditional-expect': 0,
'vitest/no-standalone-expect': 0,
'jest/no-test-callback': 0,
'jest/expect-expect': 0,
'jest/no-done-callback': 0,
'jest/valid-title': 0,
'jest/no-conditional-expect': 0,
'jest/no-standalone-expect': 0,
'unicorn/better-regex': 2,
'unicorn/prefer-string-trim-start-end': 2,

4
.github/workflows/test.yml vendored
View File

@ -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

1
.gitignore vendored
View File

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

23
.jest.image.js Normal file
View File

@ -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,
};

68
.jest.js Normal file
View File

@ -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%',
};

19
.jest.node.js Normal file
View File

@ -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,
};

21
.jest.site.js Normal file
View File

@ -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',
},
},
};

3
__mocks__/rc-virtual-list.ts
View File

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

12
components/__tests__/__snapshots__/index.test.ts.snap
View File

@ -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",
]
`;

4
components/__tests__/__snapshots__/setup.test.tsx.snap
View File

@ -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

3
components/__tests__/index.test.ts
View File

@ -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(() => {

31
components/__tests__/node.test.tsx
View File

@ -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 {
default: fakeDemoTest,
rootPropsTest: () => {},
};
return fakeDemoTest;
});
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, async () => {
describe(componentName, () => {
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(
demoFile,
async () => {
const Demo = (await import(`../../${demoFile}`)).default;
test(demoFile, () => {
const Demo = require(`../../${demoFile}`).default; // eslint-disable-line global-require, import/no-dynamic-require
expect(() => {
renderToString(<Demo />);
}).not.toThrow();
},
120000,
);
});
});
});
});

3
components/_util/PurePanel.tsx
View File

@ -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 */

8
components/_util/__tests__/getScroll.test.ts
View File

@ -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 = {};

2
components/_util/__tests__/responsiveObserve.test.tsx
View File

@ -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,

12
components/_util/__tests__/scrollTo.test.ts
View File

@ -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,
});

14
components/_util/__tests__/util.test.tsx
View File

@ -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);

8
components/_util/__tests__/warning.test.ts
View File

@ -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(() => {

71
components/_util/__tests__/wave.test.tsx
View File

@ -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', () => {
const mockFn = () => isVisible;
return {
default: mockFn,
};
jest.mock('rc-util/lib/Dom/isVisible', () => {
const mockFn = () => (global as any).isVisible;
return 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 () => {
await vi.runAllTimersAsync();
vi.clearAllTimers();
afterEach(() => {
jest.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();
});

20
components/affix/__tests__/Affix.test.tsx
View File

@ -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();
vi.clearAllTimers();
jest.useRealTimers();
jest.clearAllTimers();
});
afterAll(() => {
@ -89,11 +89,7 @@ describe('Affix Render', () => {
});
it('Anchor correct render when target is null', async () => {
render(
<Affix target={() => null}>
<span>test</span>
</Affix>,
);
render(<Affix target={() => null}>test</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} />,
{

4
components/affix/__tests__/__snapshots__/Affix.test.tsx.snap
View File

@ -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=""

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

@ -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 [

2
components/affix/__tests__/__snapshots__/demo.test.tsx.snap
View File

@ -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 [

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

@ -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

2
components/alert/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

6
components/alert/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"

24
components/alert/__tests__/index.test.tsx
View File

@ -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(() => {
expect(screen.getByRole('tooltip')).toBeInTheDocument();
act(() => {
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();
});

108
components/anchor/__tests__/Anchor.test.tsx
View File

@ -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', () => ({
default: vi.fn(),
}));
jest.mock('scroll-into-view-if-needed', () => jest.fn());
describe('Anchor Render', () => {
const getBoundingClientRectMock = vi.spyOn(HTMLHeadingElement.prototype, 'getBoundingClientRect');
const getClientRectsMock = vi.spyOn(HTMLHeadingElement.prototype, 'getClientRects');
const getBoundingClientRectMock = jest.spyOn(
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();
vi.mocked(scrollIntoView).mockReset();
jest.useFakeTimers();
scrollIntoViewMock.mockReset();
});
afterEach(() => {
vi.clearAllTimers();
vi.useRealTimers();
jest.clearAllTimers();
jest.useRealTimers();
});
afterAll(() => {
vi.clearAllTimers();
vi.useRealTimers();
jest.clearAllTimers();
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 scrollToSpy = vi.spyOn(window, 'scrollTo');
const root = createDiv();
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 onChange = vi.fn();
const root = createDiv();
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 root = createRootDiv();
const scrollToSpy = jest.spyOn(window, 'scrollTo');
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 root = createRootDiv();
const scrollToSpy = jest.spyOn(window, 'scrollTo');
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 afterFn = vi.fn();
const beforeFn = jest.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 root = createRootDiv();
const scrollToSpy = jest.spyOn(window, 'scrollTo');
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 root = createRootDiv();
const scrollToSpy = jest.spyOn(window, 'scrollTo');
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 scrollToSpy = vi.spyOn(window, 'scrollTo');
const root = createDiv();
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 onChange = vi.fn();
const root = createDiv();
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('');

8
components/anchor/__tests__/__snapshots__/Anchor.test.tsx.snap
View File

@ -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=""

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

@ -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

2
components/anchor/__tests__/__snapshots__/demo.test.tsx.snap
View File

@ -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

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

@ -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

2
components/app/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

6
components/app/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

12
components/app/__tests__/index.test.tsx
View File

@ -11,12 +11,12 @@ describe('App', () => {
rtlTest(App);
beforeEach(() => {
vi.useFakeTimers();
jest.useFakeTimers();
});
afterEach(() => {
vi.clearAllTimers();
vi.useRealTimers();
jest.clearAllTimers();
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(
'color: rgb(255, 0, 0);',
);
expect(container.querySelector<HTMLDivElement>('.ant-app')).toHaveStyle('color: blue;');
});
});

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

@ -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

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

@ -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 [

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

@ -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"
>

16
components/auto-complete/__tests__/focus.test.tsx
View File

@ -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} />

6
components/auto-complete/__tests__/index.test.tsx
View File

@ -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"

2
components/auto-complete/index.tsx
View File

@ -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;

8
components/avatar/__tests__/Avatar.test.tsx
View File

@ -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();

32
components/avatar/__tests__/__snapshots__/Avatar.test.tsx.snap
View File

@ -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;"

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

@ -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

2
components/avatar/__tests__/__snapshots__/demo.test.tsx.snap
View File

@ -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

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

@ -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 [

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

@ -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 [

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

@ -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"
/>

12
components/back-top/__tests__/index.test.tsx
View File

@ -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.',

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

@ -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

2
components/badge/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

28
components/badge/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

4
components/badge/__tests__/__snapshots__/ribbon.test.tsx.snap
View File

@ -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"
>

10
components/badge/__tests__/index.test.tsx
View File

@ -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();
});
}

8
components/breadcrumb/__tests__/Breadcrumb.test.tsx
View File

@ -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();

24
components/breadcrumb/__tests__/__snapshots__/Breadcrumb.test.tsx.snap
View File

@ -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"
>

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

@ -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

2
components/breadcrumb/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

4
components/breadcrumb/__tests__/__snapshots__/itemRender.test.tsx.snap
View File

@ -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"

4
components/breadcrumb/__tests__/__snapshots__/router.test.tsx.snap
View File

@ -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"
>

4
components/breadcrumb/__tests__/router.test.tsx
View File

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

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

@ -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

2
components/button/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

52
components/button/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"

10
components/button/__tests__/delay-timer.test.tsx
View File

@ -30,16 +30,16 @@ const Content = () => {
it('Delay loading timer in Button component', () => {
const otherTimer = 9528;
vi.spyOn<Window, 'setTimeout'>(window, 'setTimeout').mockReturnValue(otherTimer);
vi.restoreAllMocks();
jest.spyOn<Window, 'setTimeout'>(window, 'setTimeout').mockReturnValue(otherTimer);
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 }} />;

22
components/button/__tests__/index.test.tsx
View File

@ -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

18
components/button/__tests__/wave.test.tsx
View File

@ -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 () => {
await vi.runAllTimersAsync();
vi.clearAllTimers();
vi.useRealTimers();
afterEach(() => {
jest.clearAllTimers();
jest.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'));

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

@ -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

2
components/calendar/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

10
components/calendar/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

66
components/calendar/__tests__/index.test.tsx
View File

@ -20,19 +20,17 @@ const ref: {
calendarHeaderProps?: CalendarHeaderProps<unknown>;
} = {};
vi.mock('../Header', async (importOriginal) => {
const HeaderModule = await importOriginal<typeof import('../Header')>();
jest.mock('../Header', () => {
const HeaderModule = jest.requireActual('../Header');
const HeaderComponent = HeaderModule.default;
return {
default: (props: CalendarHeaderProps<any>) => {
return (props: CalendarHeaderProps<any>) => {
ref.calendarHeaderProps = props;
return <HeaderComponent {...props} />;
},
};
});
vi.mock('rc-picker', async () => {
const RcPicker = await vi.importActual<typeof import('rc-picker')>('rc-picker');
jest.mock('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 onChange = vi.fn();
const onSelect = jest.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 onYearChange = vi.fn();
const onTypeChange = vi.fn();
const onMonthChange = jest.fn();
const onYearChange = jest.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();
});
});

20
components/calendar/__tests__/select.test.tsx
View File

@ -13,16 +13,16 @@ describe('Calendar.onSelect', () => {
beforeEach(() => {
resetWarned();
vi.useFakeTimers();
vi.clearAllTimers();
jest.useFakeTimers();
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 onPanelChange = vi.fn();
const onSelect = jest.fn();
const onPanelChange = jest.fn();
const { container } = render(<Calendar onSelect={onSelect} onPanelChange={onPanelChange} />);
// Default is month radio

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

@ -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

2
components/card/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

10
components/card/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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;"

6
components/card/__tests__/index.test.tsx
View File

@ -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

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

@ -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

2
components/carousel/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

12
components/carousel/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

9
components/carousel/__tests__/index.test.tsx
View File

@ -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}>

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

@ -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

2
components/cascader/__tests__/__snapshots__/demo.test.tsx.snap
View File

@ -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

34
components/cascader/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

27
components/cascader/__tests__/index.test.tsx
View File

@ -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.',

2
components/cascader/index.tsx
View File

@ -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;

4
components/checkbox/__tests__/__snapshots__/checkbox.test.tsx.snap
View File

@ -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"
>

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

@ -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

2
components/checkbox/__tests__/__snapshots__/demo.test.tsx.snap
View File

@ -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

6
components/checkbox/__tests__/__snapshots__/group.test.tsx.snap
View File

@ -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"
/>

6
components/checkbox/__tests__/checkbox.test.tsx
View File

@ -12,8 +12,8 @@ describe('Checkbox', () => {
rtlTest(Checkbox);
it('responses hover events', () => {
const onMouseEnter = vi.fn();
const onMouseLeave = vi.fn();
const onMouseEnter = jest.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`?',

22
components/checkbox/__tests__/group.test.tsx
View File

@ -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('');

2
components/col/style/index.ts
View File

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

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

@ -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

2
components/collapse/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -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

10
components/collapse/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -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"
>

34
components/collapse/__tests__/index.test.tsx
View File

@ -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" key={2} extra={<button type="button">action</button>} />
<Collapse.Panel header="header" 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();
const spiedRAF = vi
jest.useFakeTimers();
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,7 +213,8 @@ describe('Collapse', () => {
});
describe('expandIconPosition', () => {
it.each(['left', 'right'] as const)(`warning for legacy %s'`, (pos) => {
['left', 'right'].forEach((pos) => {
it(`warning for legacy '${pos}'`, () => {
render(
<Collapse expandIconPosition={pos}>
<Collapse.Panel header="header" key="1" />
@ -235,6 +236,7 @@ describe('Collapse', () => {
expect(container.querySelector('.ant-collapse-icon-position-end')).toBeTruthy();
});
});
});
it('Collapse.Panel usage', () => {
const { container } = render(

2
components/color-picker/ColorPicker.tsx
View File

@ -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,

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

@ -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

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

@ -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

Some files were not shown because too many files have changed in this diff Show More