You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
83 lines
2.1 KiB
83 lines
2.1 KiB
6 years ago
|
import { mount } from '@vue/test-utils'
|
||
|
|
import { asyncExpect } from '@/tests/utils'
|
||
|
|
import Skeleton from '..'
|
||
|
|
|
||
|
|
describe('Skeleton', () => {
|
||
|
|
const genSkeleton = props => {
|
||
|
|
const skeletonProps = {
|
||
|
|
propsData: {
|
||
|
|
loading: true,
|
||
|
|
...props,
|
||
|
|
},
|
||
|
|
slots: {
|
||
|
|
default: 'Bamboo',
|
||
|
|
},
|
||
|
|
sync: false,
|
||
|
|
}
|
||
|
|
return mount(Skeleton, skeletonProps)
|
||
|
|
}
|
||
|
|
|
||
|
|
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()
|
||
|
|
})
|
||
|
|
})
|
||
|
|
|
||
|
|
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()
|
||
|
|
})
|
||
|
|
})
|
||
|
|
})
|
||
|
|
})
|