test(Empty): update test cases

This commit is contained in:
chenjiahan 2020-11-14 06:44:18 +08:00
parent b5e13563eb
commit e6e18f542f
2 changed files with 20 additions and 14 deletions

View File

@ -1,28 +1,32 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`bottom slot 1`] = ` exports[`should render bottom slot correctly 1`] = `
<div class="van-empty"> <div class="van-empty">
<div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div> <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div>
<!---->
<div class="van-empty__bottom">Custom bottom</div> <div class="van-empty__bottom">Custom bottom</div>
</div> </div>
`; `;
exports[`description slot 1`] = ` exports[`should render description slot correctly 1`] = `
<div class="van-empty"> <div class="van-empty">
<div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div> <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png"></div>
<p class="van-empty__description">Custom description</p> <p class="van-empty__description">Custom description</p>
<!---->
</div> </div>
`; `;
exports[`image slot 1`] = ` exports[`should render image slot correctly 1`] = `
<div class="van-empty"> <div class="van-empty">
<div class="van-empty__image">Custom Image</div> <div class="van-empty__image">Custom Image</div>
<!---->
<!---->
</div> </div>
`; `;
exports[`render svg when image is network 1`] = ` exports[`should render svg when image is network 1`] = `
<div class="van-empty"> <div class="van-empty">
<div class="van-empty__image"><svg viewBox="0 0 160 160" xmlns="http://www.w3.org/2000/svg"> <div class="van-empty__image"><svg viewBox="0 0 160 160">
<defs> <defs>
<linearGradient id="c" x1="64.022%" y1="100%" x2="64.022%" y2="0%"> <linearGradient id="c" x1="64.022%" y1="100%" x2="64.022%" y2="0%">
<stop stop-color="#FFF" offset="0%" stop-opacity="0.5"></stop> <stop stop-color="#FFF" offset="0%" stop-opacity="0.5"></stop>
@ -79,5 +83,7 @@ exports[`render svg when image is network 1`] = `
</g> </g>
</g> </g>
</svg></div> </svg></div>
<!---->
<!---->
</div> </div>
`; `;

View File

@ -1,9 +1,9 @@
import Empty from '..'; import Empty from '..';
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
test('image slot', () => { test('should render image slot correctly', () => {
const wrapper = mount(Empty, { const wrapper = mount(Empty, {
scopedSlots: { slots: {
image: () => 'Custom Image', image: () => 'Custom Image',
}, },
}); });
@ -11,9 +11,9 @@ test('image slot', () => {
expect(wrapper.html()).toMatchSnapshot(); expect(wrapper.html()).toMatchSnapshot();
}); });
test('description slot', () => { test('should render description slot correctly', () => {
const wrapper = mount(Empty, { const wrapper = mount(Empty, {
scopedSlots: { slots: {
description: () => 'Custom description', description: () => 'Custom description',
}, },
}); });
@ -21,9 +21,9 @@ test('description slot', () => {
expect(wrapper.html()).toMatchSnapshot(); expect(wrapper.html()).toMatchSnapshot();
}); });
test('bottom slot', () => { test('should render bottom slot correctly', () => {
const wrapper = mount(Empty, { const wrapper = mount(Empty, {
scopedSlots: { slots: {
default: () => 'Custom bottom', default: () => 'Custom bottom',
}, },
}); });
@ -31,7 +31,7 @@ test('bottom slot', () => {
expect(wrapper.html()).toMatchSnapshot(); expect(wrapper.html()).toMatchSnapshot();
}); });
test('render svg when image is network', () => { test('should render svg when image is network', () => {
const wrapper = mount(Empty, { const wrapper = mount(Empty, {
props: { props: {
image: 'network', image: 'network',
@ -41,7 +41,7 @@ test('render svg when image is network', () => {
expect(wrapper.html()).toMatchSnapshot(); expect(wrapper.html()).toMatchSnapshot();
}); });
test('image-size prop', () => { test('should change image size when using image-size prop', async () => {
const wrapper = mount(Empty, { const wrapper = mount(Empty, {
props: { props: {
imageSize: 50, imageSize: 50,
@ -53,7 +53,7 @@ test('image-size prop', () => {
expect(image.style.width).toEqual('50px'); expect(image.style.width).toEqual('50px');
expect(image.style.height).toEqual('50px'); expect(image.style.height).toEqual('50px');
wrapper.setProps({ imageSize: '1vw' }); await wrapper.setProps({ imageSize: '1vw' });
expect(image.style.width).toEqual('1vw'); expect(image.style.width).toEqual('1vw');
expect(image.style.height).toEqual('1vw'); expect(image.style.height).toEqual('1vw');
}); });