mirror of
https://github.com/ant-design/ant-design.git
synced 2025-01-18 14:13:37 +08:00
chore: rewrite test case Demo CC => FC (#40102)
* chore: rewrite test case demo CC => FC * chore: rewrite test case demo CC => FC * fix
This commit is contained in:
parent
59593e0476
commit
fadba4cb42
@ -1,4 +1,5 @@
|
||||
import React from 'react';
|
||||
import React, { useEffect, useRef } from 'react';
|
||||
import type { CSSProperties } from 'react';
|
||||
import type { InternalAffixClass } from '..';
|
||||
import Affix from '..';
|
||||
import accessibilityTest from '../../../tests/shared/accessibilityTest';
|
||||
@ -9,62 +10,42 @@ import { addObserveTarget, getObserverEntities } from '../utils';
|
||||
|
||||
const events: Partial<Record<keyof HTMLElementEventMap, (ev: Partial<Event>) => void>> = {};
|
||||
|
||||
class AffixMounter extends React.Component<{
|
||||
offsetBottom?: number;
|
||||
interface AffixProps {
|
||||
offsetTop?: number;
|
||||
onTestUpdatePosition?(): void;
|
||||
offsetBottom?: number;
|
||||
style?: CSSProperties;
|
||||
onChange?: () => void;
|
||||
onTestUpdatePosition?: () => void;
|
||||
getInstance?: (inst: InternalAffixClass) => void;
|
||||
style?: React.CSSProperties;
|
||||
}> {
|
||||
private container: HTMLDivElement;
|
||||
|
||||
componentDidMount() {
|
||||
this.container.addEventListener = jest
|
||||
.fn()
|
||||
.mockImplementation((event: keyof HTMLElementEventMap, cb: (ev: Partial<Event>) => void) => {
|
||||
events[event] = cb;
|
||||
});
|
||||
}
|
||||
|
||||
getTarget = () => this.container;
|
||||
|
||||
render() {
|
||||
const { getInstance, ...restProps } = this.props;
|
||||
return (
|
||||
<div
|
||||
ref={(node) => {
|
||||
this.container = node!;
|
||||
}}
|
||||
className="container"
|
||||
>
|
||||
<Affix
|
||||
className="fixed"
|
||||
target={this.getTarget}
|
||||
ref={(ele) => {
|
||||
getInstance?.(ele!);
|
||||
}}
|
||||
{...restProps}
|
||||
>
|
||||
<Button type="primary">Fixed at the top of container</Button>
|
||||
</Affix>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const AffixMounter: React.FC<AffixProps> = ({ getInstance, ...restProps }) => {
|
||||
const container = useRef<HTMLDivElement>(null);
|
||||
useEffect(() => {
|
||||
if (container.current) {
|
||||
container.current.addEventListener = jest
|
||||
.fn()
|
||||
.mockImplementation((event: keyof HTMLElementEventMap, cb: (ev: Event) => void) => {
|
||||
events[event] = cb;
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
return (
|
||||
<div ref={container} className="container">
|
||||
<Affix className="fixed" ref={getInstance} target={() => container.current} {...restProps}>
|
||||
<Button type="primary">Fixed at the top of container</Button>
|
||||
</Affix>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
describe('Affix Render', () => {
|
||||
rtlTest(Affix);
|
||||
accessibilityTest(Affix);
|
||||
|
||||
const domMock = jest.spyOn(HTMLElement.prototype, 'getBoundingClientRect');
|
||||
|
||||
const classRect: Record<string, DOMRect> = {
|
||||
container: {
|
||||
top: 0,
|
||||
bottom: 100,
|
||||
} as DOMRect,
|
||||
};
|
||||
const classRect: Record<string, DOMRect> = { container: { top: 0, bottom: 100 } as DOMRect };
|
||||
|
||||
beforeEach(() => {
|
||||
jest.useFakeTimers();
|
||||
@ -74,12 +55,7 @@ describe('Affix Render', () => {
|
||||
|
||||
beforeAll(() => {
|
||||
domMock.mockImplementation(function fn(this: HTMLElement) {
|
||||
return (
|
||||
classRect[this.className] || {
|
||||
top: 0,
|
||||
bottom: 0,
|
||||
}
|
||||
);
|
||||
return classRect[this.className] || { top: 0, bottom: 0 };
|
||||
});
|
||||
});
|
||||
|
||||
@ -93,16 +69,11 @@ describe('Affix Render', () => {
|
||||
});
|
||||
|
||||
const movePlaceholder = async (top: number) => {
|
||||
classRect.fixed = {
|
||||
top,
|
||||
bottom: top,
|
||||
} as DOMRect;
|
||||
classRect.fixed = { top, bottom: top } as DOMRect;
|
||||
if (events.scroll == null) {
|
||||
throw new Error('scroll should be set');
|
||||
}
|
||||
events.scroll({
|
||||
type: 'scroll',
|
||||
});
|
||||
events.scroll({ type: 'scroll' });
|
||||
await waitFakeTimer();
|
||||
};
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user