ant-design-vue/components/card/__tests__/index.test.js

87 lines
1.9 KiB
JavaScript

import { mount } from '@vue/test-utils';
import Card from '../index';
import Button from '../../button/index';
import mountTest from '../../../tests/shared/mountTest';
describe('Card', () => {
mountTest(Card);
beforeAll(() => {
jest.useFakeTimers();
});
afterAll(() => {
jest.useRealTimers();
});
it('should still have padding when card which set padding to 0 is loading', () => {
const wrapper = mount({
render() {
return (
<Card loading bodyStyle={{ padding: 0 }}>
xxx
</Card>
);
},
});
expect(wrapper.html()).toMatchSnapshot();
});
it('title should be vertically aligned', () => {
const wrapper = mount({
render() {
return (
<Card title="Card title" extra={<Button>Button</Button>} style={{ width: '300px' }}>
<p>Card content</p>
</Card>
);
},
});
expect(wrapper.html()).toMatchSnapshot();
});
it('onTabChange should work', () => {
const tabList = [
{
key: 'tab1',
tab: 'tab1',
},
{
key: 'tab2',
tab: 'tab2',
},
];
const onTabChange = jest.fn();
const wrapper = mount(
{
render() {
return (
<Card onTabChange={onTabChange} tabList={tabList}>
xxx
</Card>
);
},
},
{
sync: false,
},
);
wrapper
.findAll('.ant-tabs-tab')
.at(1)
.trigger('click');
expect(onTabChange).toHaveBeenCalledWith('tab2');
});
it('should not render when actions is number', () => {
const wrapper = mount({
render() {
return (
<Card title="Card title" actions={11}>
<p>Card content</p>
</Card>
);
},
});
expect(wrapper.findAll('.ant-card-actions').length).toBe(0);
});
});