mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-29 13:47:02 +08:00
Code Issues Actions 13 Packages Projects Releases Wiki Activity
55c85f77a1
ant-design/components/menu/__tests__/index.test.js
Wei Zhu 55c85f77a1
Update dependendies (#8150) 
* deps: upgrade rc-menu, and close: #2837

* test: update snapshots

* Update rc-calendar

* Update rc-cascader

* Update rc-dialog

* Update dropdown

* Update rc-select@7.1.0

* Update rc-slider

* Update rc-time-picker

* Update rc-tooltip

* Update rc-tree-select

* Mock rc-trigger and Portal

* Fix animation warning when inlineCollapsed changes

* fix: should use SubMenu[popupClassName]

* Fix typescript error

* Fix lint

* fix: style for menu

* Mock rc-trigger for React 15

* Remvoe allow_failures
2017-11-11 00:07:03 +08:00

248 lines
9.0 KiB
JavaScript
Raw Blame History

import React from 'react';
import { mount } from 'enzyme';
import Menu from '..';
import Icon from '../../icon';
const { SubMenu } = Menu;
describe('Menu', () => {
it('should accept defaultOpenKeys in mode horizontal', () => {
const wrapper = mount(
<Menu defaultOpenKeys={['1']} mode="horizontal">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('should accept defaultOpenKeys in mode inline', () => {
const wrapper = mount(
<Menu defaultOpenKeys={['1']} mode="inline">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('should accept defaultOpenKeys in mode vertical', () => {
const wrapper = mount(
<Menu defaultOpenKeys={['1']} mode="vertical">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('horizontal', () => {
const wrapper = mount(
<Menu openKeys={['1']} mode="horizontal" openTransitionName="">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
wrapper.setProps({ openKeys: [] });
wrapper.update();
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
wrapper.setProps({ openKeys: ['1'] });
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('inline', () => {
const wrapper = mount(
<Menu openKeys={['1']} mode="inline" openAnimation="">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
wrapper.setProps({ openKeys: [] });
wrapper.update();
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
wrapper.setProps({ openKeys: ['1'] });
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('vertical', () => {
const wrapper = mount(
<Menu openKeys={['1']} mode="vertical" openTransitionName="">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
wrapper.setProps({ openKeys: [] });
wrapper.update();
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
wrapper.setProps({ openKeys: ['1'] });
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
// https://github.com/ant-design/ant-design/pulls/4677
// https://github.com/ant-design/ant-design/issues/4692
// TypeError: Cannot read property 'indexOf' of undefined
it('pr #4677 and issue #4692', () => {
const wrapper = mount(
<Menu mode="horizontal">
<SubMenu title="submenu">
<Menu.Item key="1">menu1</Menu.Item>
<Menu.Item key="2">menu2</Menu.Item>
</SubMenu>
</Menu>
);
wrapper.update();
// just expect no error emit
});
it('should always follow openKeys when mode is switched', () => {
const wrapper = mount(
<Menu openKeys={['1']} mode="inline">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
wrapper.setProps({ mode: 'vertical' });
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
wrapper.setProps({ mode: 'inline' });
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).not.toBe(true);
});
it('should always follow openKeys when mode is switched', async () => {
jest.useFakeTimers();
const wrapper = mount(
<Menu defaultOpenKeys={['1']} mode="inline">
<Menu.Item key="menu1">
<Icon type="inbox" />
<span>Option</span>
</Menu.Item>
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">
Option
</Menu.Item>
<Menu.Item key="submenu2">
Option
</Menu.Item>
</SubMenu>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-inline')).toBe(true);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).toBe(false);
wrapper.setProps({ inlineCollapsed: true });
// 动画结束后套样式;
jest.runAllTimers();
wrapper.update();
expect(wrapper.find('.ant-menu').at(0).hasClass('ant-menu-vertical')).toBe(true);
expect(wrapper.find('.ant-menu-sub').length).toBe(0);
wrapper.setProps({ inlineCollapsed: false });
jest.runAllTimers();
wrapper.update();
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-inline')).toBe(true);
expect(wrapper.find('.ant-menu-sub').at(0).hasClass('ant-menu-hidden')).toBe(false);
jest.useRealTimers();
});
describe('open submenu when click submenu title', () => {
beforeEach(() => {
jest.useFakeTimers();
});
afterEach(() => {
jest.useRealTimers();
});
const toggleMenu = (wrapper, index, event) => {
wrapper.find('.ant-menu-submenu-title').at(index).simulate(event);
jest.runAllTimers();
wrapper.update();
};
it('inline', () => {
const wrapper = mount(
<Menu mode="inline">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').length).toBe(0);
toggleMenu(wrapper, 0, 'click');
expect(wrapper.find('.ant-menu-sub').hostNodes().length).toBe(1);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
toggleMenu(wrapper, 0, 'click');
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
});
it('vertical', () => {
const wrapper = mount(
<Menu mode="vertical">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').length).toBe(0);
toggleMenu(wrapper, 0, 'mouseenter');
expect(wrapper.find('.ant-menu-sub').hostNodes().length).toBe(1);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
toggleMenu(wrapper, 0, 'mouseleave');
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
});
it('horizontal', () => {
jest.useFakeTimers();
const wrapper = mount(
<Menu mode="horizontal">
<SubMenu key="1" title="submenu1">
<Menu.Item key="submenu1">Option 1</Menu.Item>
<Menu.Item key="submenu2">Option 2</Menu.Item>
</SubMenu>
<Menu.Item key="2">menu2</Menu.Item>
</Menu>
);
expect(wrapper.find('.ant-menu-sub').length).toBe(0);
toggleMenu(wrapper, 0, 'mouseenter');
expect(wrapper.find('.ant-menu-sub').hostNodes().length).toBe(1);
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).not.toBe(true);
toggleMenu(wrapper, 0, 'mouseleave');
expect(wrapper.find('.ant-menu-sub').hostNodes().at(0).hasClass('ant-menu-hidden')).toBe(true);
});
});
});
Reference in New Issue View Git Blame Copy Permalink