mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-06 16:06:28 +08:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

test: update

Browse Source
This commit is contained in:
Wanpan 2024-08-18 04:24:53 +08:00
parent 2fef83a704
commit 17729e5ab3
2 changed files with 61 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
components/splitter/Splitter.tsx
View File

@ -135,44 +135,43 @@ const Splitter: React.FC<React.PropsWithChildren<SplitterProps>> = (props) => {
useEffect(() => {
// 计算初始值
const getInitialBasics = () => {
if (containerRef.current) {
const { width, height } = containerRef.current.getBoundingClientRect();
const containerWidth = width - gutterCount;
const containerHeight = height - gutterCount;
const getInitialBasics = (container: HTMLDivElement) => {
const { width, height } = container.getBoundingClientRect();
const containerWidth = width - gutterCount;
const containerHeight = height - gutterCount;
const sizes: number[] = [];
let sum = 0;
let count = 0;
const sizes: number[] = [];
let sum = 0;
let count = 0;
items.forEach((child) => {
let currentSize = child.size ?? child.defaultSize;
if (currentSize === undefined || currentSize === '') {
sizes.push(defaultSize);
return;
}
items.forEach((child) => {
let currentSize = child.size ?? child.defaultSize;
if (currentSize === undefined || currentSize === '') {
sizes.push(defaultSize);
return;
}
currentSize = sizeTransform(
currentSize,
layout === 'horizontal' ? containerWidth : containerHeight,
);
sum += currentSize;
count += 1;
sizes.push(currentSize);
});
currentSize = sizeTransform(
currentSize,
layout === 'horizontal' ? containerWidth : containerHeight,
);
sum += currentSize;
count += 1;
sizes.push(currentSize);
});
const averageSize = sum > 100 ? 0 : (100 - sum) / (panelCount - count);
items.forEach((_, idx) => {
if (sizes[idx] === defaultSize) {
sizes[idx] = averageSize;
}
});
return sizes as number[];
}
return [];
const averageSize = sum > 100 ? 0 : (100 - sum) / (panelCount - count);
items.forEach((_, idx) => {
if (sizes[idx] === defaultSize) {
sizes[idx] = averageSize;
}
});
return sizes as number[];
};
setBasicsState(getInitialBasics());
if (containerRef.current) {
setBasicsState(getInitialBasics(containerRef.current));
}
// item.size 改变时，重新计算 flexBasis
}, [
JSON.stringify(items.map((item) => item.size)),

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

@ -132,6 +132,12 @@ describe('Splitter', () => {
fireEvent.click(container?.querySelector('.ant-splitter-bar-collapse-previous')!);
expect(container?.querySelector('.ant-splitter-bar-collapse-previous')).toBeFalsy();
expect(container?.querySelector('.ant-splitter-bar-collapse-next')).toBeTruthy();
expect(container?.querySelectorAll('.ant-splitter-panel')[0]).toHaveStyle(
'flex-basis: calc(0% - 1px)',
);
expect(container?.querySelectorAll('.ant-splitter-panel')[1]).toHaveStyle(
'flex-basis: calc(100% - 1px)',
);
// next click
rerender(
@ -150,6 +156,12 @@ describe('Splitter', () => {
fireEvent.click(container?.querySelector('.ant-splitter-bar-collapse-next')!);
expect(container?.querySelector('.ant-splitter-bar-collapse-previous')).toBeTruthy();
expect(container?.querySelector('.ant-splitter-bar-collapse-next')).toBeFalsy();
expect(container?.querySelectorAll('.ant-splitter-panel')[0]).toHaveStyle(
'flex-basis: calc(100% - 1px)',
);
expect(container?.querySelectorAll('.ant-splitter-panel')[1]).toHaveStyle(
'flex-basis: calc(0% - 1px)',
);
// collapsible is boolean
rerender(
@ -166,13 +178,31 @@ describe('Splitter', () => {
fireEvent.click(container?.querySelector('.ant-splitter-bar-collapse-next')!);
expect(container?.querySelector('.ant-splitter-bar-collapse-previous')).toBeTruthy();
expect(container?.querySelector('.ant-splitter-bar-collapse-next')).toBeFalsy();
expect(container?.querySelectorAll('.ant-splitter-panel')[0]).toHaveStyle(
'flex-basis: calc(100% - 1px)',
);
expect(container?.querySelectorAll('.ant-splitter-panel')[1]).toHaveStyle(
'flex-basis: calc(0% - 1px)',
);
fireEvent.click(container?.querySelector('.ant-splitter-bar-collapse-previous')!);
expect(container?.querySelector('.ant-splitter-bar-collapse-previous')).toBeTruthy();
expect(container?.querySelector('.ant-splitter-bar-collapse-next')).toBeTruthy();
expect(container?.querySelectorAll('.ant-splitter-panel')[0]).toHaveStyle(
'flex-basis: calc(10% - 1px)',
);
expect(container?.querySelectorAll('.ant-splitter-panel')[1]).toHaveStyle(
'flex-basis: calc(90% - 1px)',
);
fireEvent.click(container?.querySelector('.ant-splitter-bar-collapse-previous')!);
expect(container?.querySelector('.ant-splitter-bar-collapse-previous')).toBeFalsy();
expect(container?.querySelector('.ant-splitter-bar-collapse-next')).toBeTruthy();
expect(container?.querySelectorAll('.ant-splitter-panel')[0]).toHaveStyle(
'flex-basis: calc(0% - 1px)',
);
expect(container?.querySelectorAll('.ant-splitter-panel')[1]).toHaveStyle(
'flex-basis: calc(100% - 1px)',
);
});
});