test: Update tooltip test case (#38283)

This commit is contained in:
hms181231 2022-10-31 10:14:10 +08:00 committed by GitHub
parent 759abca658
commit 302a8e5a58
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -4,7 +4,7 @@ import type { TooltipPlacement } from '..';
import Tooltip from '..'; import Tooltip from '..';
import mountTest from '../../../tests/shared/mountTest'; import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest'; import rtlTest from '../../../tests/shared/rtlTest';
import { fireEvent, render, sleep, waitFor } from '../../../tests/utils'; import { fireEvent, render, waitFakeTimer, waitFor } from '../../../tests/utils';
import Button from '../../button'; import Button from '../../button';
import DatePicker from '../../date-picker'; import DatePicker from '../../date-picker';
import Input from '../../input'; import Input from '../../input';
@ -258,6 +258,7 @@ describe('Tooltip', () => {
}); });
it('should works for date picker', async () => { it('should works for date picker', async () => {
jest.useFakeTimers();
const onOpenChange = jest.fn(); const onOpenChange = jest.fn();
const onVisibleChange = jest.fn(); const onVisibleChange = jest.fn();
const ref = React.createRef<any>(); const ref = React.createRef<any>();
@ -277,21 +278,24 @@ describe('Tooltip', () => {
const picker = container.getElementsByClassName('ant-picker')[0]; const picker = container.getElementsByClassName('ant-picker')[0];
fireEvent.mouseEnter(picker); fireEvent.mouseEnter(picker);
await sleep(100); await waitFakeTimer();
expect(onOpenChange).toHaveBeenCalledWith(true); expect(onOpenChange).toHaveBeenCalledWith(true);
expect(onVisibleChange).toHaveBeenCalledWith(true); expect(onVisibleChange).toHaveBeenCalledWith(true);
expect(ref.current?.props.visible).toBe(true); expect(ref.current?.props.visible).toBe(true);
expect(container.querySelector('.ant-tooltip-open')).not.toBeNull(); expect(container.querySelector('.ant-tooltip-open')).not.toBeNull();
fireEvent.mouseLeave(picker); fireEvent.mouseLeave(picker);
await sleep(100); await waitFakeTimer();
expect(onOpenChange).toHaveBeenCalledWith(false); expect(onOpenChange).toHaveBeenCalledWith(false);
expect(onVisibleChange).toHaveBeenCalledWith(false); expect(onVisibleChange).toHaveBeenCalledWith(false);
expect(ref.current?.props.visible).toBe(false); expect(ref.current?.props.visible).toBe(false);
expect(container.querySelector('.ant-tooltip-open')).toBeNull(); expect(container.querySelector('.ant-tooltip-open')).toBeNull();
jest.clearAllTimers();
jest.useRealTimers();
}); });
it('should works for input group', async () => { it('should works for input group', async () => {
jest.useFakeTimers();
const onOpenChange = jest.fn(); const onOpenChange = jest.fn();
const onVisibleChange = jest.fn(); const onVisibleChange = jest.fn();
const ref = React.createRef<any>(); const ref = React.createRef<any>();
@ -312,18 +316,20 @@ describe('Tooltip', () => {
expect(container.getElementsByClassName('ant-input-group')).toHaveLength(1); expect(container.getElementsByClassName('ant-input-group')).toHaveLength(1);
const inputGroup = container.getElementsByClassName('ant-input-group')[0]; const inputGroup = container.getElementsByClassName('ant-input-group')[0];
fireEvent.mouseEnter(inputGroup); fireEvent.mouseEnter(inputGroup);
await sleep(100); await waitFakeTimer();
expect(onOpenChange).toHaveBeenCalledWith(true); expect(onOpenChange).toHaveBeenCalledWith(true);
expect(onVisibleChange).toHaveBeenCalledWith(true); expect(onVisibleChange).toHaveBeenCalledWith(true);
expect(ref.current?.props.visible).toBe(true); expect(ref.current?.props.visible).toBe(true);
expect(container.querySelector('.ant-tooltip-open')).not.toBeNull(); expect(container.querySelector('.ant-tooltip-open')).not.toBeNull();
fireEvent.mouseLeave(inputGroup); fireEvent.mouseLeave(inputGroup);
await sleep(100); await waitFakeTimer();
expect(onOpenChange).toHaveBeenCalledWith(false); expect(onOpenChange).toHaveBeenCalledWith(false);
expect(onVisibleChange).toHaveBeenCalledWith(false); expect(onVisibleChange).toHaveBeenCalledWith(false);
expect(ref.current?.props.visible).toBe(false); expect(ref.current?.props.visible).toBe(false);
expect(container.querySelector('.ant-tooltip-open')).toBeNull(); expect(container.querySelector('.ant-tooltip-open')).toBeNull();
jest.clearAllTimers();
jest.useRealTimers();
}); });
// https://github.com/ant-design/ant-design/issues/20891 // https://github.com/ant-design/ant-design/issues/20891
@ -355,6 +361,17 @@ describe('Tooltip', () => {
}); });
describe('support other placement when mouse enter', () => { describe('support other placement when mouse enter', () => {
beforeAll(() => {
jest.useFakeTimers();
});
afterAll(() => {
jest.useRealTimers();
});
afterEach(() => {
jest.clearAllTimers();
});
const placementList = [ const placementList = [
'top', 'top',
'left', 'left',
@ -379,7 +396,7 @@ describe('Tooltip', () => {
expect(container.getElementsByTagName('span')).toHaveLength(1); expect(container.getElementsByTagName('span')).toHaveLength(1);
const element = container.getElementsByTagName('span')[0]; const element = container.getElementsByTagName('span')[0];
fireEvent.mouseEnter(element); fireEvent.mouseEnter(element);
await sleep(500); await waitFakeTimer();
await waitFor(() => { await waitFor(() => {
expect(document.querySelector(`.ant-tooltip-placement-${placement}`)).not.toBeNull(); expect(document.querySelector(`.ant-tooltip-placement-${placement}`)).not.toBeNull();
}); });
@ -403,7 +420,7 @@ describe('Tooltip', () => {
); );
const button = container.getElementsByTagName('span')[0]; const button = container.getElementsByTagName('span')[0];
fireEvent.mouseEnter(button); fireEvent.mouseEnter(button);
await sleep(600); await waitFakeTimer();
expect(document.querySelector('.ant-tooltip')).not.toBeNull(); expect(document.querySelector('.ant-tooltip')).not.toBeNull();
}); });