diff --git a/src/skeleton/tests/Skeleton.spec.tsx b/src/skeleton/tests/Skeleton.spec.tsx new file mode 100644 index 000000000..3f0cb3e44 --- /dev/null +++ b/src/skeleton/tests/Skeleton.spec.tsx @@ -0,0 +1,58 @@ +import { mount } from '@vue/test-utils' +import { NSkeleton } from '../index' + +describe('n-skeleton', () => { + it('should work with import on demand', () => { + mount(NSkeleton) + }) + + it('should work with `text` prop', async () => { + const wrapper = mount(NSkeleton, { + props: { + text: true + } + }) + expect(wrapper.find('.n-skeleton').attributes('style')).toMatchSnapshot() + }) + + it('should work with box', async () => { + const wrapper = mount(NSkeleton) + expect(wrapper.find('.n-skeleton').attributes('style')).toMatchSnapshot() + }) + + it('should work with `sharp` prop', async () => { + const wrapper = mount(NSkeleton, { + props: { + sharp: false + } + }) + expect(wrapper.find('.n-skeleton').attributes('style')).toMatchSnapshot() + }) + + it('should work with `round` prop', async () => { + const wrapper = mount(NSkeleton, { + props: { + round: true + } + }) + expect(wrapper.find('.n-skeleton').attributes('style')).toMatchSnapshot() + }) + + it('should work with `circle` prop', async () => { + const wrapper = mount(NSkeleton, { + props: { + circle: true + } + }) + expect(wrapper.find('.n-skeleton').attributes('style')).toMatchSnapshot() + }) + + it('should work with `repeat` prop', async () => { + const wrapper = mount(NSkeleton, { + props: { + repeat: 2 + } + }) + expect(wrapper.findAll('.n-skeleton').length).toBe(2) + }) +}) diff --git a/src/skeleton/tests/__snapshots__/Skeleton.spec.tsx.snap b/src/skeleton/tests/__snapshots__/Skeleton.spec.tsx.snap new file mode 100644 index 000000000..d1b6ce1b7 --- /dev/null +++ b/src/skeleton/tests/__snapshots__/Skeleton.spec.tsx.snap @@ -0,0 +1,11 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`n-skeleton should work with \`circle\` prop 1`] = `"border-radius: 50%; --bezier: cubic-bezier(.4, 0, .2, 1); --color-start: #eee; --color-end: #ddd;"`; + +exports[`n-skeleton should work with \`round\` prop 1`] = `"border-radius: 4096px; --bezier: cubic-bezier(.4, 0, .2, 1); --color-start: #eee; --color-end: #ddd;"`; + +exports[`n-skeleton should work with \`sharp\` prop 1`] = `"border-radius: 3px; --bezier: cubic-bezier(.4, 0, .2, 1); --color-start: #eee; --color-end: #ddd;"`; + +exports[`n-skeleton should work with \`text\` prop 1`] = `"display: inline-block; vertical-align: -0.125em; --bezier: cubic-bezier(.4, 0, .2, 1); --color-start: #eee; --color-end: #ddd;"`; + +exports[`n-skeleton should work with box 1`] = `"--bezier: cubic-bezier(.4, 0, .2, 1); --color-start: #eee; --color-end: #ddd;"`;