import React from 'react'; import { mount } from 'enzyme'; import Tooltip from '..'; import Button from '../../button'; import Switch from '../../switch'; import Checkbox from '../../checkbox'; import DatePicker from '../../date-picker'; import Input from '../../input'; import Group from '../../input/Group'; import { sleep } from '../../../tests/utils'; import mountTest from '../../../tests/shared/mountTest'; describe('Tooltip', () => { mountTest(Tooltip); it('check `onVisibleChange` arguments', () => { const onVisibleChange = jest.fn(); const wrapper = mount(
Hello world!
, ); // `title` is empty. const div = wrapper.find('#hello').at(0); div.simulate('mouseenter'); expect(onVisibleChange).not.toHaveBeenCalled(); expect(wrapper.instance().tooltip.props.visible).toBe(false); div.simulate('mouseleave'); expect(onVisibleChange).not.toHaveBeenCalled(); expect(wrapper.instance().tooltip.props.visible).toBe(false); // update `title` value. wrapper.setProps({ title: 'Have a nice day!' }); wrapper.find('#hello').simulate('mouseenter'); expect(onVisibleChange).toHaveBeenLastCalledWith(true); expect(wrapper.instance().tooltip.props.visible).toBe(true); wrapper.find('#hello').simulate('mouseleave'); expect(onVisibleChange).toHaveBeenLastCalledWith(false); expect(wrapper.instance().tooltip.props.visible).toBe(false); // add `visible` props. wrapper.setProps({ visible: false }); wrapper.find('#hello').simulate('mouseenter'); expect(onVisibleChange).toHaveBeenLastCalledWith(true); const lastCount = onVisibleChange.mock.calls.length; expect(wrapper.instance().tooltip.props.visible).toBe(false); // always trigger onVisibleChange wrapper.simulate('mouseleave'); expect(onVisibleChange.mock.calls.length).toBe(lastCount); // no change with lastCount expect(wrapper.instance().tooltip.props.visible).toBe(false); }); it('should hide when mouse leave native disabled button', () => { const onVisibleChange = jest.fn(); const wrapper = mount( , ); expect(wrapper.find('span')).toHaveLength(1); const button = wrapper.find('span').at(0); button.simulate('mouseenter'); expect(onVisibleChange).toHaveBeenCalledWith(true); expect(wrapper.instance().tooltip.props.visible).toBe(true); button.simulate('mouseleave'); expect(onVisibleChange).toHaveBeenCalledWith(false); expect(wrapper.instance().tooltip.props.visible).toBe(false); }); describe('should hide when mouse leave antd disabled component', () => { function testComponent(name, Component) { it(name, () => { const onVisibleChange = jest.fn(); const wrapper = mount( , ); expect(wrapper.render()).toMatchSnapshot(); const button = wrapper.find('span').at(0); button.simulate('mouseenter'); expect(onVisibleChange).toHaveBeenCalledWith(true); expect(wrapper.instance().tooltip.props.visible).toBe(true); button.simulate('mouseleave'); expect(onVisibleChange).toHaveBeenCalledWith(false); expect(wrapper.instance().tooltip.props.visible).toBe(false); }); } testComponent('Button', Button); testComponent('Switch', Switch); testComponent('Checkbox', Checkbox); }); it('should render disabled Button style properly', () => { const wrapper1 = mount( , ); const wrapper2 = mount( , ); expect( wrapper1 .find('span') .first() .getDOMNode().style.display, ).toBe('inline-block'); expect( wrapper2 .find('span') .first() .getDOMNode().style.display, ).toBe('block'); }); it('should works for arrowPointAtCenter', () => { const arrowWidth = 5; const horizontalArrowShift = 16; const triggerWidth = 200; const suit = () => { const wrapper = mount( , ); wrapper .find('button') .at(0) .simulate('click'); const popupLeftDefault = parseInt(wrapper.instance().getPopupDomNode().style.left, 10); const wrapper2 = mount( , ); wrapper2 .find('button') .at(0) .simulate('click'); const popupLeftArrowPointAtCenter = parseInt( wrapper2.instance().getPopupDomNode().style.left, 10, ); expect(popupLeftArrowPointAtCenter - popupLeftDefault).toBe( triggerWidth / 2 - horizontalArrowShift - arrowWidth, ); }; jest.dontMock('rc-trigger', suit); }); it('should works for date picker', async () => { const onVisibleChange = jest.fn(); const wrapper = mount( , ); expect(wrapper.find('.ant-picker')).toHaveLength(1); const picker = wrapper.find('.ant-picker').at(0); picker.simulate('mouseenter'); await sleep(100); expect(onVisibleChange).toHaveBeenCalledWith(true); expect(wrapper.instance().tooltip.props.visible).toBe(true); picker.simulate('mouseleave'); await sleep(100); expect(onVisibleChange).toHaveBeenCalledWith(false); expect(wrapper.instance().tooltip.props.visible).toBe(false); }); it('should works for input group', async () => { const onVisibleChange = jest.fn(); const wrapper = mount( , ); expect(wrapper.find('Group')).toHaveLength(1); const picker = wrapper.find('Group').at(0); picker.simulate('mouseenter'); await sleep(100); expect(onVisibleChange).toHaveBeenCalledWith(true); expect(wrapper.instance().tooltip.props.visible).toBe(true); picker.simulate('mouseleave'); await sleep(100); expect(onVisibleChange).toHaveBeenCalledWith(false); expect(wrapper.instance().tooltip.props.visible).toBe(false); }); });