diff --git a/components/_util/__tests__/scrollTo.test.js b/components/_util/__tests__/scrollTo.test.js index 3e41a60ee9..dcb402e6bc 100644 --- a/components/_util/__tests__/scrollTo.test.js +++ b/components/_util/__tests__/scrollTo.test.js @@ -1,16 +1,9 @@ import scrollTo from '../scrollTo'; +import { sleep } from '../../../tests/utils'; describe('Test ScrollTo function', () => { let dateNowMock; - beforeAll(() => { - jest.useFakeTimers(); - }); - - afterAll(() => { - jest.useRealTimers(); - }); - beforeEach(() => { dateNowMock = jest .spyOn(Date, 'now') @@ -29,8 +22,8 @@ describe('Test ScrollTo function', () => { }); scrollTo(1000); + await sleep(20); - jest.runAllTimers(); expect(window.pageYOffset).toBe(1000); scrollToSpy.mockRestore(); @@ -41,7 +34,7 @@ describe('Test ScrollTo function', () => { scrollTo(1000, { callback: cbMock, }); - jest.runAllTimers(); + await sleep(20); expect(cbMock).toHaveBeenCalledTimes(1); }); @@ -50,7 +43,7 @@ describe('Test ScrollTo function', () => { scrollTo(1000, { getContainer: () => div, }); - jest.runAllTimers(); + await sleep(20); expect(div.scrollTop).toBe(1000); }); }); diff --git a/components/_util/__tests__/util.test.js b/components/_util/__tests__/util.test.js index d6f4a60bc9..2896266144 100644 --- a/components/_util/__tests__/util.test.js +++ b/components/_util/__tests__/util.test.js @@ -8,37 +8,30 @@ import getDataOrAriaProps from '../getDataOrAriaProps'; import Wave from '../wave'; import TransButton from '../transButton'; import openAnimation from '../openAnimation'; +import { sleep } from '../../../tests/utils'; describe('Test utils function', () => { - beforeAll(() => { - jest.useFakeTimers(); - }); - - afterAll(() => { - jest.useRealTimers(); - }); - - it('throttle function should work', () => { + it('throttle function should work', async () => { const callback = jest.fn(); const throttled = throttleByAnimationFrame(callback); expect(callback).not.toHaveBeenCalled(); throttled(); throttled(); + await sleep(20); - jest.runAllTimers(); expect(callback).toHaveBeenCalled(); expect(callback.mock.calls.length).toBe(1); }); - it('throttle function should be canceled', () => { + it('throttle function should be canceled', async () => { const callback = jest.fn(); const throttled = throttleByAnimationFrame(callback); throttled(); throttled.cancel(); + await sleep(20); - jest.runAllTimers(); expect(callback).not.toHaveBeenCalled(); }); diff --git a/components/_util/__tests__/wave.test.js b/components/_util/__tests__/wave.test.js index 55da64653a..5f15614d2e 100644 --- a/components/_util/__tests__/wave.test.js +++ b/components/_util/__tests__/wave.test.js @@ -46,7 +46,7 @@ describe('Wave component', () => { it('wave color is not grey', async () => { const wrapper = mount(); wrapper.find('button').getDOMNode().click(); - await sleep(0); + await sleep(200); const styles = document.getElementsByTagName('style'); expect(styles.length).toBe(1); expect(styles[0].innerHTML).toContain('--antd-wave-shadow-color: red;'); diff --git a/components/affix/__tests__/Affix.test.js b/components/affix/__tests__/Affix.test.js index ddf03c9028..dcfc2a9862 100644 --- a/components/affix/__tests__/Affix.test.js +++ b/components/affix/__tests__/Affix.test.js @@ -5,6 +5,7 @@ import { getObserverEntities } from '../utils'; import Button from '../../button'; import { spyElementPrototype } from '../../__tests__/util/domHook'; import rtlTest from '../../../tests/shared/rtlTest'; +import { sleep } from '../../../tests/utils'; const events = {}; @@ -54,7 +55,6 @@ describe('Affix Render', () => { }; beforeAll(() => { - jest.useFakeTimers(); domMock = spyElementPrototype(HTMLElement, 'getBoundingClientRect', function mockBounding() { return ( classRect[this.className] || { @@ -66,10 +66,10 @@ describe('Affix Render', () => { }); afterAll(() => { - jest.useRealTimers(); domMock.mockRestore(); }); - const movePlaceholder = top => { + + const movePlaceholder = async top => { classRect.fixed = { top, bottom: top, @@ -77,58 +77,58 @@ describe('Affix Render', () => { events.scroll({ type: 'scroll', }); - jest.runAllTimers(); + await sleep(20); }; - it('Anchor render perfectly', () => { + it('Anchor render perfectly', async () => { document.body.innerHTML = '
'; wrapper = mount(, { attachTo: document.getElementById('mounter') }); - jest.runAllTimers(); + await sleep(20); - movePlaceholder(0); + await movePlaceholder(0); expect(wrapper.instance().affix.state.affixStyle).toBeFalsy(); - movePlaceholder(-100); + await movePlaceholder(-100); expect(wrapper.instance().affix.state.affixStyle).toBeTruthy(); - movePlaceholder(0); + await movePlaceholder(0); expect(wrapper.instance().affix.state.affixStyle).toBeFalsy(); }); - it('support offsetBottom', () => { + it('support offsetBottom', async () => { document.body.innerHTML = '
'; wrapper = mount(, { attachTo: document.getElementById('mounter'), }); - jest.runAllTimers(); + await sleep(20); - movePlaceholder(300); + await movePlaceholder(300); expect(wrapper.instance().affix.state.affixStyle).toBeTruthy(); - movePlaceholder(0); + await movePlaceholder(0); expect(wrapper.instance().affix.state.affixStyle).toBeFalsy(); - movePlaceholder(300); + await movePlaceholder(300); expect(wrapper.instance().affix.state.affixStyle).toBeTruthy(); }); - it('updatePosition when offsetTop changed', () => { + it('updatePosition when offsetTop changed', async () => { document.body.innerHTML = '
'; wrapper = mount(, { attachTo: document.getElementById('mounter'), }); - jest.runAllTimers(); + await sleep(20); - movePlaceholder(-100); + await movePlaceholder(-100); expect(wrapper.instance().affix.state.affixStyle.top).toBe(0); wrapper.setProps({ offsetTop: 10, }); - jest.runAllTimers(); + await sleep(20); expect(wrapper.instance().affix.state.affixStyle.top).toBe(10); }); @@ -144,7 +144,7 @@ describe('Affix Render', () => { expect(wrapper.instance().state.placeholderStyle).toBe(undefined); }); - it('instance change', () => { + it('instance change', async () => { const getObserverLength = () => Object.keys(getObserverEntities()).length; const container = document.createElement('div'); @@ -154,20 +154,20 @@ describe('Affix Render', () => { const originLength = getObserverLength(); const getTarget = () => target; wrapper = mount(); - jest.runAllTimers(); + await sleep(20); expect(getObserverLength()).toBe(originLength + 1); target = null; wrapper.setProps({}); wrapper.update(); - jest.runAllTimers(); + await sleep(20); expect(getObserverLength()).toBe(originLength); }); }); describe('updatePosition when size changed', () => { function test(name, index) { - it(name, () => { + it(name, async () => { document.body.innerHTML = '
'; const updateCalled = jest.fn(); @@ -175,11 +175,11 @@ describe('Affix Render', () => { attachTo: document.getElementById('mounter'), }); - jest.runAllTimers(); + await sleep(20); - movePlaceholder(300); + await movePlaceholder(300); expect(wrapper.instance().affix.state.affixStyle).toBeTruthy(); - jest.runAllTimers(); + await sleep(20); wrapper.update(); // Mock trigger resize @@ -189,7 +189,7 @@ describe('Affix Render', () => { .at(index) .instance() .onResize([{ target: { getBoundingClientRect: () => ({ width: 99, height: 99 }) } }]); - jest.runAllTimers(); + await sleep(20); expect(updateCalled).toHaveBeenCalled(); }); diff --git a/components/anchor/__tests__/Anchor.test.js b/components/anchor/__tests__/Anchor.test.js index 8fb26833c3..ce1a82b3fc 100644 --- a/components/anchor/__tests__/Anchor.test.js +++ b/components/anchor/__tests__/Anchor.test.js @@ -273,9 +273,7 @@ describe('Anchor Render', () => { expect(wrapper.instance().state.activeLink).toBe('#API2'); }); - it('Anchor targetOffset prop', () => { - jest.useFakeTimers(); - + it('Anchor targetOffset prop', async () => { let dateNowMock; function dataNowMockFn() { @@ -304,23 +302,22 @@ describe('Anchor Render', () => { , ); wrapper.instance().handleScrollTo('#API'); - jest.runAllTimers(); + await sleep(20); expect(scrollToSpy).toHaveBeenLastCalledWith(0, 1000); dateNowMock = dataNowMockFn(); wrapper.setProps({ offsetTop: 100 }); wrapper.instance().handleScrollTo('#API'); - jest.runAllTimers(); + await sleep(20); expect(scrollToSpy).toHaveBeenLastCalledWith(0, 900); dateNowMock = dataNowMockFn(); wrapper.setProps({ targetOffset: 200 }); wrapper.instance().handleScrollTo('#API'); - jest.runAllTimers(); + await sleep(20); expect(scrollToSpy).toHaveBeenLastCalledWith(0, 800); dateNowMock.mockRestore(); - jest.useRealTimers(); }); it('Anchor onChange prop', async () => { diff --git a/components/collapse/__tests__/index.test.js b/components/collapse/__tests__/index.test.js index 626eb4f441..8b612ad8b1 100644 --- a/components/collapse/__tests__/index.test.js +++ b/components/collapse/__tests__/index.test.js @@ -2,6 +2,7 @@ import React from 'react'; import { mount } from 'enzyme'; import mountTest from '../../../tests/shared/mountTest'; import rtlTest from '../../../tests/shared/rtlTest'; +import { sleep } from '../../../tests/utils'; describe('Collapse', () => { // Fix css-animation deps on these @@ -55,8 +56,7 @@ describe('Collapse', () => { expect(wrapper.render()).toMatchSnapshot(); }); - it('could be expand and collapse', () => { - jest.useFakeTimers(); + it('could be expand and collapse', async () => { const wrapper = mount( @@ -69,10 +69,8 @@ describe('Collapse', () => { .find('.ant-collapse-header') .at(0) .simulate('click'); + await sleep(400); expect(wrapper.find('.ant-collapse-item').hasClass('ant-collapse-item-active')).toBe(true); - jest.runAllTimers(); - expect(wrapper.find('.ant-collapse-item').hasClass('ant-collapse-item-active')).toBe(true); - jest.useRealTimers(); }); it('could override default openAnimation', () => { diff --git a/components/input/__tests__/textarea.test.js b/components/input/__tests__/textarea.test.js index a574489362..40a91514dd 100644 --- a/components/input/__tests__/textarea.test.js +++ b/components/input/__tests__/textarea.test.js @@ -4,6 +4,7 @@ import { mount } from 'enzyme'; import Input from '..'; import focusTest from '../../../tests/shared/focusTest'; import calculateNodeHeight, { calculateNodeStyling } from '../calculateNodeHeight'; +import { sleep } from '../../../tests/utils'; const { TextArea } = Input; @@ -22,17 +23,15 @@ describe('TextArea', () => { }, }), }); - jest.useFakeTimers(); }); afterAll(() => { Object.defineProperty(window, 'getComputedStyle', { value: originalGetComputedStyle, }); - jest.useRealTimers(); }); - it('should auto calculate height according to content length', () => { + it('should auto calculate height according to content length', async () => { const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {}); const wrapper = mount( @@ -40,10 +39,10 @@ describe('TextArea', () => { ); const mockFunc = jest.spyOn(wrapper.instance().resizableTextArea, 'resizeTextarea'); wrapper.setProps({ value: '1111\n2222\n3333' }); - jest.runAllTimers(); + await sleep(0); expect(mockFunc).toHaveBeenCalledTimes(1); wrapper.setProps({ value: '1111' }); - jest.runAllTimers(); + await sleep(0); expect(mockFunc).toHaveBeenCalledTimes(2); wrapper.update(); expect(wrapper.find('textarea').props().style.overflow).toBeFalsy(); @@ -143,10 +142,10 @@ describe('TextArea', () => { expect(onKeyDown).toHaveBeenCalled(); }); - it('should trigger onResize', () => { + it('should trigger onResize', async () => { const onResize = jest.fn(); const wrapper = mount(