diff --git a/devui/skeleton/__tests__/skeleton.spec.ts b/devui/skeleton/__tests__/skeleton.spec.ts index e55e134a615f1d42ac9eefd35b07288a785f6ee0..a5f905040d816a9c77a294a3908affc2d64accbe 100644 --- a/devui/skeleton/__tests__/skeleton.spec.ts +++ b/devui/skeleton/__tests__/skeleton.spec.ts @@ -3,59 +3,59 @@ import { ref } from 'vue'; import DSkeleton from '../src/skeleton'; describe('skeleton 组件', () => { - it('render basic skeleton successfully', () => { - const row = ref(4); + it('render basic skeleton', () => { + const row = ref(4) const wrapper = mount({ components: { DSkeleton }, template: ``, setup() { return { row - }; + } }, - }); + }) expect(wrapper.classes()).toContain('devui-skeleton') expect(wrapper.classes()).toContain('devui-skeleton-animated') - expect(wrapper.element.childElementCount).toBe(1) - // 渲染个数应当与传入的 row 的数量相同 - expect(wrapper.element.children[0].childElementCount).toBe(4) + expect(wrapper.element.childElementCount).toBe(2) + expect(wrapper.element.children[1].children[1].childElementCount).toBe(4) }) it('render skeleton without animate', () => { - const animate = ref(false); + const animate = ref(false) const wrapper = mount({ components: { DSkeleton }, template: ``, setup() { return { animate - }; + } }, - }); + }) - expect(wrapper.classes()).toContain('devui-skeleton-no-animated') + expect(wrapper.classes()).toEqual(['devui-skeleton']) }) - it('render skeleton with avatar', () => { - const avatar = ref(true); + it('render skeleton without title and paragraph', () => { + const title = ref(false) + const paragraph = ref(false) const wrapper = mount({ components: { DSkeleton }, - template: ``, + template: ``, setup() { return { - avatar - }; + title, + paragraph + } }, - }); - - expect(wrapper.element.childElementCount).toBe(2) - expect(wrapper.element.children[0].innerHTML).toBe('
') + }) + + expect(wrapper.element.children[1].childElementCount).toBe(2) }) it('hide skeleton and show real content', () => { - const row = ref(4); - const loading = ref(false); + const row = ref(4) + const loading = ref(false) const wrapper = mount({ components: { DSkeleton }, template: ` @@ -71,9 +71,9 @@ describe('skeleton 组件', () => { return { row, loading - }; + } }, - }); + }) expect(wrapper.classes()).toContain('devui-skeleton') expect(wrapper.element.children[0].innerHTML).toBe('
content1
content2
content3
content4
')