mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-01-18 06:03:38 +08:00
Code Issues Actions 29 Packages Projects Releases Wiki Activity

fix(Collapse): solve deprecated warning display unexpected in collapse issue (#42876)

Browse Source 
* fix: solve deprecated warning display unexpected in collapse issue

* fix: solve deprecated warning display unexpected in collapse issue

* feat: update test case
This commit is contained in:
kiner-tang(文辉) 2023-06-07 10:03:35 +08:00 committed by GitHub
parent d36e30384b
commit 5ff95e3fda
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 45 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
components/collapse/Collapse.tsx
View File

@ -124,21 +124,23 @@ const Collapse = React.forwardRef<HTMLDivElement, CollapseProps>((props, ref) =>
leavedClassName: `${prefixCls}-content-hidden`,
};
const items = React.useMemo<React.ReactNode[]>(
const items = React.useMemo<React.ReactNode[] | null>(
() =>
toArray(children).map<React.ReactNode>((child, index) => {
if (child.props?.disabled) {
const key = child.key ?? String(index);
const { disabled, collapsible } = child.props;
const childProps: Omit<CollapseProps, 'items'> & { key: React.Key } = {
...omit(child.props, ['disabled']),
key,
collapsible: collapsible ?? (disabled ? 'disabled' : undefined),
};
return cloneElement(child, childProps);
}
return child;
}),
children
? toArray(children).map<React.ReactNode>((child, index) => {
if (child.props?.disabled) {
const key = child.key ?? String(index);
const { disabled, collapsible } = child.props;
const childProps: Omit<CollapseProps, 'items'> & { key: React.Key } = {
...omit(child.props, ['disabled']),
key,
collapsible: collapsible ?? (disabled ? 'disabled' : undefined),
};
return cloneElement(child, childProps);
}
return child;
})
: null,
[children],
);

30
components/collapse/__tests__/index.test.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { act } from 'react-dom/test-utils';
import { waitFakeTimer, render, fireEvent } from '../../../tests/utils';
import { fireEvent, render, waitFakeTimer } from '../../../tests/utils';
import { resetWarned } from '../../_util/warning';
describe('Collapse', () => {
@ -124,6 +124,34 @@ describe('Collapse', () => {
expect(container.querySelectorAll('.ant-collapse-item-active').length).toBe(0);
});
it('should not trigger warning when using items instead of children', () => {
render(
<Collapse
items={[
{
key: '1',
label: 'This is panel header 1',
children: <p>aaa</p>,
},
{
key: '2',
label: 'This is panel header 2',
children: <p>bbb</p>,
},
{
key: '3',
label: 'This is panel header 3',
children: <p>ccc</p>,
},
]}
/>,
);
expect(errorSpy).not.toHaveBeenCalledWith(
'Warning: `children` will be removed in next major version. Please use `items` instead.',
);
});
it('should end motion when set activeKey while hiding', async () => {
jest.useFakeTimers();
const spiedRAF = jest