2019-06-30 20:15:44 +08:00
|
|
|
import React from 'react';
|
|
|
|
import Result from '..';
|
2019-08-26 22:53:20 +08:00
|
|
|
import mountTest from '../../../tests/shared/mountTest';
|
2020-01-02 19:10:16 +08:00
|
|
|
import rtlTest from '../../../tests/shared/rtlTest';
|
2022-05-19 10:18:17 +08:00
|
|
|
import { render } from '../../../tests/utils';
|
2022-05-23 14:37:16 +08:00
|
|
|
import Button from '../../button';
|
2019-08-26 22:53:20 +08:00
|
|
|
|
|
|
|
describe('Result', () => {
|
|
|
|
mountTest(Result);
|
2020-01-02 19:10:16 +08:00
|
|
|
rtlTest(Result);
|
2019-06-30 20:15:44 +08:00
|
|
|
|
|
|
|
it('🙂 successPercent should decide the progress status when it exists', () => {
|
2022-09-06 18:51:28 +08:00
|
|
|
const { container } = render(
|
2019-06-30 20:15:44 +08:00
|
|
|
<Result
|
|
|
|
status="success"
|
|
|
|
title="Successfully Purchased Cloud Server ECS!"
|
|
|
|
subTitle="Order number: 2017182818828182881 Cloud server configuration takes 1-5 minutes, please wait."
|
|
|
|
extra={[
|
|
|
|
<Button type="primary" key="console">
|
|
|
|
Go Console
|
|
|
|
</Button>,
|
|
|
|
<Button key="buy">Buy Again</Button>,
|
|
|
|
]}
|
|
|
|
/>,
|
|
|
|
);
|
2022-09-06 18:51:28 +08:00
|
|
|
expect(container.querySelectorAll('.anticon-check-circle')).toHaveLength(1);
|
2019-06-30 20:15:44 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
it('🙂 different status, different class', () => {
|
2022-09-06 18:51:28 +08:00
|
|
|
const { container, rerender } = render(<Result status="warning" />);
|
|
|
|
expect(container.querySelectorAll('.ant-result-warning')).toHaveLength(1);
|
2019-06-30 20:15:44 +08:00
|
|
|
|
2022-05-19 10:18:17 +08:00
|
|
|
rerender(<Result status="error" />);
|
2019-06-30 20:15:44 +08:00
|
|
|
|
2022-09-06 18:51:28 +08:00
|
|
|
expect(container.querySelectorAll('.ant-result-error')).toHaveLength(1);
|
2019-06-30 20:15:44 +08:00
|
|
|
|
2022-05-19 10:18:17 +08:00
|
|
|
rerender(<Result status="500" />);
|
2019-06-30 20:15:44 +08:00
|
|
|
|
2022-09-06 18:51:28 +08:00
|
|
|
expect(container.querySelectorAll('.ant-result-500')).toHaveLength(1);
|
2019-06-30 20:15:44 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
it('🙂 When status = 404, the icon is an image', () => {
|
2022-09-06 18:51:28 +08:00
|
|
|
const { container } = render(<Result status="404" />);
|
|
|
|
expect(container.querySelectorAll('.ant-result-404 .ant-result-image')).toHaveLength(1);
|
2019-06-30 20:15:44 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
it('🙂 When extra is undefined, the extra dom is undefined', () => {
|
2022-09-06 18:51:28 +08:00
|
|
|
const { container } = render(<Result status="404" />);
|
|
|
|
expect(container.querySelectorAll('.ant-result-extra')).toHaveLength(0);
|
2019-06-30 20:15:44 +08:00
|
|
|
});
|
2019-07-01 15:28:02 +08:00
|
|
|
|
|
|
|
it('🙂 result should support className', () => {
|
2022-09-06 18:51:28 +08:00
|
|
|
const { container } = render(<Result status="404" title="404" className="my-result" />);
|
|
|
|
expect(container.querySelectorAll('.ant-result.my-result')).toHaveLength(1);
|
2019-07-01 15:28:02 +08:00
|
|
|
});
|
2019-12-13 10:18:12 +08:00
|
|
|
|
|
|
|
it('should warning when pass a string as icon props', () => {
|
2023-06-07 11:54:50 +08:00
|
|
|
const warnSpy = vi.spyOn(console, 'error').mockImplementation(() => {});
|
2022-04-06 11:07:15 +08:00
|
|
|
|
|
|
|
render(<Result title="404" icon="ab" />);
|
2019-12-13 10:18:12 +08:00
|
|
|
expect(warnSpy).not.toHaveBeenCalled();
|
2022-04-06 11:07:15 +08:00
|
|
|
|
|
|
|
render(<Result title="404" icon="smile" />);
|
2019-12-13 10:18:12 +08:00
|
|
|
expect(warnSpy).toHaveBeenCalledWith(
|
|
|
|
`Warning: [antd: Result] \`icon\` is using ReactNode instead of string naming in v4. Please check \`smile\` at https://ant.design/components/icon`,
|
|
|
|
);
|
2022-04-06 11:07:15 +08:00
|
|
|
|
2019-12-13 10:18:12 +08:00
|
|
|
warnSpy.mockRestore();
|
|
|
|
});
|
2022-11-10 19:27:36 +08:00
|
|
|
|
|
|
|
it('should hide icon by setting icon to false or null', () => {
|
|
|
|
const { container } = render(<Result title="404" icon={null} />);
|
|
|
|
expect(container.querySelectorAll('.ant-result-icon')).toHaveLength(0);
|
|
|
|
const { container: container2 } = render(<Result title="404" icon={false} />);
|
|
|
|
expect(container2.querySelectorAll('.ant-result-icon')).toHaveLength(0);
|
|
|
|
});
|
2019-06-30 20:15:44 +08:00
|
|
|
});
|