mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-12 20:43:11 +08:00
Code Issues Actions 26 Packages Projects Releases Wiki Activity

fix: menu items typings (#35790)

Browse Source 
* Fix menu items typings

* add test case for menu item type checking
This commit is contained in:
MasaoBlue 2022-06-08 11:25:49 +09:00 committed by GitHub
parent c0389d200a
commit d099dea28b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 244 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

161
components/menu/__tests__/__snapshots__/index.test.js.snap
View File

@ -162,6 +162,167 @@ Array [
]
`;
exports[`Menu all types must be available in the "items" syntax 1`] = `
Array [
<ul
class="ant-menu ant-menu-root ant-menu-inline ant-menu-light"
data-menu-list="true"
role="menu"
tabindex="0"
>
<li
class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open"
role="none"
>
<div
aria-controls="rc-menu-uuid-test-submenu-popup"
aria-expanded="true"
aria-haspopup="true"
class="ant-menu-submenu-title"
data-menu-id="rc-menu-uuid-test-submenu"
role="menuitem"
style="padding-left: 24px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
Submenu
</span>
<i
class="ant-menu-submenu-arrow"
/>
</div>
<ul
class="ant-menu ant-menu-sub ant-menu-inline"
data-menu-list="true"
id="rc-menu-uuid-test-submenu-popup"
>
<li
class="ant-menu-item ant-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-submenu-item1"
role="menuitem"
style="padding-left: 48px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
SubmenuItem 1
</span>
</li>
<li
class="ant-menu-item ant-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-submenu-item2"
role="menuitem"
style="padding-left: 48px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
SubmenuItem 2
</span>
</li>
</ul>
</li>
<li
class="ant-menu-item-divider"
/>
<li
class="ant-menu-item-group"
>
<div
class="ant-menu-item-group-title"
title="Group"
>
Group
</div>
<ul
class="ant-menu-item-group-list"
>
<li
class="ant-menu-item ant-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-group-item"
role="menuitem"
style="padding-left: 24px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
GroupItem
</span>
</li>
<li
class="ant-menu-item-divider"
/>
<li
class="ant-menu-submenu ant-menu-submenu-inline ant-menu-submenu-open"
role="none"
>
<div
aria-controls="rc-menu-uuid-test-group-submenu-popup"
aria-expanded="true"
aria-haspopup="true"
class="ant-menu-submenu-title"
data-menu-id="rc-menu-uuid-test-group-submenu"
role="menuitem"
style="padding-left: 24px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
GroupSubmenu
</span>
<i
class="ant-menu-submenu-arrow"
/>
</div>
<ul
class="ant-menu ant-menu-sub ant-menu-inline"
data-menu-list="true"
id="rc-menu-uuid-test-group-submenu-popup"
>
<li
class="ant-menu-item ant-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-group-submenu-item1"
role="menuitem"
style="padding-left: 48px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
GroupSubmenuItem 1
</span>
</li>
<li
class="ant-menu-item ant-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-group-submenu-item2"
role="menuitem"
style="padding-left: 48px;"
tabindex="-1"
>
<span
class="ant-menu-title-content"
>
GroupSubmenuItem 2
</span>
</li>
</ul>
</li>
</ul>
</li>
</ul>,
<div
aria-hidden="true"
style="display: none;"
/>,
]
`;
exports[`Menu rtl render component should be rendered correctly in RTL direction 1`] = `
Array [
<ul

42
components/menu/__tests__/index.test.js
View File

@ -960,4 +960,46 @@ describe('Menu', () => {
expect(wrapper.exists('.bamboo')).toBeTruthy();
});
it('all types must be available in the "items" syntax', () => {
const wrapper = mount(
<Menu
mode="inline"
defaultOpenKeys={['submenu', 'group-submenu']}
items={[
{
key: 'submenu',
label: 'Submenu',
children: [
{ key: 'submenu-item1', label: 'SubmenuItem 1' },
{ key: 'submenu-item2', label: 'SubmenuItem 2' },
],
},
{ key: 'divider', type: 'divider' },
{
key: 'group',
type: 'group',
label: 'Group',
children: [
{
key: 'group-item',
label: 'GroupItem',
},
{ key: 'group-divider', type: 'divider' },
{
key: 'group-submenu',
label: 'GroupSubmenu',
children: [
{ key: 'group-submenu-item1', label: 'GroupSubmenuItem 1' },
{ key: 'group-submenu-item2', label: 'GroupSubmenuItem 2' },
],
},
],
},
]}
/>,
);
expect(wrapper.render()).toMatchSnapshot();
});
});

40
components/menu/__tests__/type.test.tsx Normal file
View File

@ -0,0 +1,40 @@
import * as React from 'react';
import Menu from '..';
describe('Menu.typescript', () => {
it('Menu.items', () => {
const menu = (
<Menu
items={[
{ key: 'item', title: 'Item' },
{
key: 'submenu',
theme: 'light',
children: [
{ key: 'submenu-item', title: 'SubmenuItem' },
{ key: 'submenu-submenu', theme: 'light', children: [] },
{ key: 'submenu-divider', type: 'divider' },
{ key: 'submenu-group', type: 'group' },
null,
],
},
{
key: 'group',
type: 'group',
children: [
{ key: 'group-item', label: 'GroupItem' },
{ key: 'group-submenu', theme: 'light', children: [] },
{ key: 'group-divider', type: 'divider' },
{ key: 'group-group', type: 'group' },
null,
],
},
{ key: 'divider', type: 'divider' },
null,
]}
/>
);
expect(menu).toBeTruthy();
});
});

2
components/menu/hooks/useItems.tsx
View File

@ -23,7 +23,7 @@ interface SubMenuType extends Omit<RcSubMenuType, 'children'> {
}
interface MenuItemGroupType extends Omit<RcMenuItemGroupType, 'children'> {
children?: MenuItemType[];
children?: ItemType[];
key?: React.Key;
}