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

90 lines
2.4 KiB
JavaScript

import { mount } from '@vue/test-utils';
import { asyncExpect } from '../../../tests/utils';
import Skeleton from '..';
import mountTest from '../../../tests/shared/mountTest';
describe('Skeleton', () => {
const genSkeleton = props => {
const skeletonProps = {
props: {
loading: true,
...props,
},
slots: {
default: () => 'Bamboo',
},
sync: false,
};
return mount(Skeleton, skeletonProps);
};
mountTest(Skeleton);
describe('avatar', () => {
it('size', async () => {
const wrapperSmall = genSkeleton({ avatar: { size: 'small' } });
await asyncExpect(() => {
expect(wrapperSmall.html()).toMatchSnapshot();
});
const wrapperDefault = genSkeleton({ avatar: { size: 'default' } });
await asyncExpect(() => {
expect(wrapperDefault.html()).toMatchSnapshot();
});
const wrapperLarge = genSkeleton({ avatar: { size: 'large' } });
await asyncExpect(() => {
expect(wrapperLarge.html()).toMatchSnapshot();
});
const wrapperNumber = genSkeleton({ avatar: { size: 20 } });
await asyncExpect(() => {
expect(wrapperNumber.html()).toMatchSnapshot();
});
});
it('shape', async () => {
const wrapperCircle = genSkeleton({ avatar: { shape: 'circle' } });
await asyncExpect(() => {
expect(wrapperCircle.html()).toMatchSnapshot();
});
const wrapperSquare = genSkeleton({ avatar: { shape: 'square' } });
await asyncExpect(() => {
expect(wrapperSquare.html()).toMatchSnapshot();
});
});
});
describe('title', () => {
it('width', async () => {
const wrapper = genSkeleton({ title: { width: '93%' } });
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot();
});
});
});
describe('paragraph', () => {
it('rows', async () => {
const wrapper = genSkeleton({ paragraph: { rows: 5 } });
await asyncExpect(() => {
expect(wrapper.html()).toMatchSnapshot();
});
});
it('width', async () => {
const wrapperPure = genSkeleton({ paragraph: { width: '93%' } });
await asyncExpect(() => {
expect(wrapperPure.html()).toMatchSnapshot();
});
const wrapperList = genSkeleton({ paragraph: { width: ['28%', '93%'] } });
await asyncExpect(() => {
expect(wrapperList.html()).toMatchSnapshot();
});
});
});
});