test(icon): add NIcon test (#374)

src/icon/tests/Icon.spec.ts

@@ -1,8 +1,50 @@
 import { mount } from '@vue/test-utils'
+import { h } from 'vue'
 import { NIcon } from '../index'
 
 describe('n-icon', () => {
   it('should work with import on demand', () => {
     mount(NIcon)
   })
+
+  it('should work with `size` prop', async () => {
+    const wrapper = mount(NIcon, { props: { size: 40 } })
+    expect(wrapper.find('[role="img"]').classes()).toContain('n-icon')
+    expect(wrapper.find('[role="img"]').attributes('style')).toContain(
+      'font-size: 40px;'
+    )
+
+    await wrapper.setProps({ size: 80 })
+    expect(wrapper.find('[role="img"]').attributes('style')).toContain(
+      'font-size: 80px;'
+    )
+  })
+
+  it('should work with `color` prop', async () => {
+    const wrapper = mount(NIcon, { props: { color: 'rgb(14, 122, 13)' } })
+    expect(wrapper.find('[role="img"]').attributes('style')).toContain(
+      'color: rgb(14, 122, 13);'
+    )
+  })
+
+  it('should work with `depth` prop', async () => {
+    const wrapper = mount(NIcon, { props: { depth: 5 } })
+    expect(wrapper.find('[role="img"]').classes()).toContain('n-icon--depth')
+    expect(wrapper.find('[role="img"]').attributes('style')).toMatchSnapshot()
+  })
+
+  it('should work with customize icon', async () => {
+    const customize = h(
+      'svg',
+      { xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 512 512' },
+      {
+        default: () =>
+          h('path', {
+            d: 'M368.5 240H272v-96.5c0-8.8-7.2-16-16-16s-16 7.2-16 16V240h-96.5c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7H240v96.5c0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7 8.8 0 16-7.2 16-16V272h96.5c8.8 0 16-7.2 16-16s-7.2-16-16-16z'
+          })
+      }
+    )
+    const wrapper = mount(NIcon, { slots: { default: () => customize } })
+    expect(wrapper.find('svg').exists()).toBe(true)
+  })
 })

src/icon/tests/__snapshots__/Icon.spec.ts.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`n-icon should work with \`depth\` prop 1`] = `"--bezier: cubic-bezier(.4, 0, .2, 1); --color: #000; --opacity: 0.18;"`;