add test case

This commit is contained in:
zombiej 2019-04-08 22:20:18 +08:00
parent f7df66b97c
commit 9f3c357053
3 changed files with 73 additions and 12 deletions

View File

@ -1,6 +1,8 @@
import React from 'react';
import { mount, render } from 'enzyme';
import Layout from '..';
import Icon from '../../icon';
import Menu from '../../menu';
const { Sider, Content } = Layout;
@ -104,6 +106,36 @@ describe('Layout', () => {
);
expect(wrapper.find('.ant-layout').hasClass('ant-layout-has-sider')).toBe(false);
});
it('render correct with Tooltip', () => {
jest.useFakeTimers();
const wrapper = mount(
<Sider collapsible collapsed={false}>
<Menu mode="inline">
<Menu.Item key="1">
<Icon type="user" />
<span>Light</span>
</Menu.Item>
</Menu>
</Sider>,
);
wrapper.find('.ant-menu-item').simulate('mouseenter');
jest.runAllTimers();
wrapper.update();
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
wrapper.find('.ant-menu-item').simulate('mouseout');
jest.runAllTimers();
wrapper.update();
wrapper.setProps({ collapsed: true });
wrapper.find('.ant-menu-item').simulate('mouseenter');
jest.runAllTimers();
wrapper.update();
expect(wrapper.find('.ant-tooltip-inner').length).toBeTruthy();
jest.useRealTimers();
});
});
describe('Sider onBreakpoint', () => {

View File

@ -1,6 +1,7 @@
import * as React from 'react';
import { Item } from 'rc-menu';
import { ClickParam } from '.';
import { MenuContext, MenuContextProps } from './';
import Tooltip from '../tooltip';
import { SiderContext, SiderContextProps } from '../layout/Sider';
@ -33,19 +34,25 @@ export default class MenuItem extends React.Component<MenuItemProps> {
const { level, children, rootPrefixCls } = this.props;
const { title, ...rest } = this.props;
let titleNode = title || (level === 1 ? children : '');
if (!siderCollapsed) {
titleNode = null;
}
return (
<Tooltip
title={titleNode}
placement="right"
overlayClassName={`${rootPrefixCls}-inline-collapsed-tooltip`}
>
<Item {...rest} title={title} ref={this.saveMenuItem} />
</Tooltip>
<MenuContext.Consumer>
{({ inlineCollapsed }: MenuContextProps) => {
let titleNode = title || (level === 1 ? children : '');
if (!siderCollapsed && !inlineCollapsed) {
titleNode = null;
}
return (
<Tooltip
title={titleNode}
placement="right"
overlayClassName={`${rootPrefixCls}-inline-collapsed-tooltip`}
>
<Item {...rest} title={title} ref={this.saveMenuItem} />
</Tooltip>
);
}}
</MenuContext.Consumer>
);
};

View File

@ -494,6 +494,8 @@ describe('Menu', () => {
const text = wrapper.find('.ant-tooltip-inner').text();
expect(text).toBe('bamboo lucky');
jest.useRealTimers();
});
it('render correctly when using with Layout.Sider', () => {
@ -608,4 +610,24 @@ describe('Menu', () => {
expect(wrapper.render()).toMatchSnapshot();
});
it('not title if not collapsed', () => {
jest.useFakeTimers();
const wrapper = mount(
<Menu mode="inline" inlineCollapsed={false}>
<Menu.Item key="1">
<Icon type="pie-chart" />
<span>Option 1</span>
</Menu.Item>
</Menu>,
);
wrapper.find('.ant-menu-item').simulate('mouseenter');
jest.runAllTimers();
wrapper.update();
expect(wrapper.find('.ant-tooltip-inner').length).toBeFalsy();
jest.useRealTimers();
});
});