Merge pull request #482 from guoxiao158/next

feat: 单元测试开发

src/packages/__VUE/backtop/__tests__/backtop.spec.ts

@@ -0,0 +1,26 @@
+import { mount } from '@vue/test-utils';
+import BackTop from '../index.vue';
+import Icon from '../../icon/index.vue';
+test('emit click event', () => {
+  const wrapper = mount(BackTop);
+  wrapper.trigger('click');
+  expect(wrapper.emitted('click')!.length).toEqual(1);
+});
+test('backtop show', () => {
+  const wrapper = mount(BackTop);
+  const backtop = wrapper.find('.nut-backtop');
+  expect(backtop.exists()).toBe(true);
+});
+test('backtop style', () => {
+  const wrapper = mount(BackTop, {
+    props: {
+      bottom: 50,
+      right: 40,
+      zIndex: 100
+    }
+  });
+  const backtop: any = wrapper.find('.nut-backtop');
+  expect(backtop.element.style.bottom).toBe('50px');
+  expect(backtop.element.style.right).toBe('40px');
+  expect(backtop.element.style.zIndex).toBe('100');
+});

src/packages/__VUE/backtop/index.vue

@@ -67,8 +67,8 @@ export default create({
     });
     const style = computed(() => {
       return {
-        right: `${props.bottom}px`,
-        bottom: `${props.right}px`,
+        right: `${props.right}px`,
+        bottom: `${props.bottom}px`,
         zIndex: props.zIndex
       };
     });

src/packages/__VUE/input/__tests__/input.spec.ts

@@ -1,5 +1,6 @@
 import { mount } from '@vue/test-utils';
 import Input from '../index.vue';
+import Icon from '../../icon/index.vue';
 
 test('base', () => {
   const wrapper = mount(Input, { props: { modelValue: 3 } });

src/packages/__VUE/rate/__tests__/rate.spec.ts

@@ -0,0 +1,52 @@
+import { mount } from '@vue/test-utils';
+import Rate from '../index.vue';
+import Icon from '../../icon/index.vue';
+
+test('base rate', () => {
+  const wrapper = mount(Rate);
+  const rate = wrapper.find('.nut-rate');
+  expect(rate.exists()).toBe(true);
+});
+test('should have rate  when v-model', () => {
+  const wrapper = mount(Rate, { props: { modelValue: 4 } });
+  const rate = wrapper.findAll('.nut-rate-item__icon--disabled');
+  expect(rate.length).toBe(1);
+});
+test('should have rate  when v-model', () => {
+  const wrapper = mount(Rate, {
+    props: { count: 10, iconSize: 20, activeColor: 'red' }
+  });
+  const rate = wrapper.findAll('.nut-rate-item');
+  expect(rate.length).toBe(10);
+
+  const i = wrapper.find('.nut-rate-item__icon');
+  expect(i.attributes().size).toBe('20');
+});
+test('should have click', async () => {
+  const wrapper = mount(Rate);
+  const rate = wrapper.findAll('.nut-rate-item');
+  await rate[3].trigger('click');
+  setTimeout(() => {
+    const rateDis = wrapper.findAll('.nut-rate-item__icon--disabled');
+    expect(rateDis.length).toBe(2);
+    expect((wrapper.emitted('change') as any)[0][0]).toEqual('3');
+  }, 200);
+});
+test('should have disabled', async () => {
+  const wrapper = mount(Rate, { props: { disabled: true, modelValue: 4 } });
+  const rate = wrapper.findAll('.nut-rate-item');
+  await rate[1].trigger('click');
+  setTimeout(() => {
+    const rateDis = wrapper.findAll('.nut-rate-item__icon--disabled');
+    expect(rateDis.length).toBe(1);
+  }, 200);
+});
+test('should have readonly', async () => {
+  const wrapper = mount(Rate, { props: { readonly: true, modelValue: 4 } });
+  const rate = wrapper.findAll('.nut-rate-item');
+  await rate[1].trigger('click');
+  setTimeout(() => {
+    const rateDis = wrapper.findAll('.nut-rate-item__icon--disabled');
+    expect(rateDis.length).toBe(1);
+  }, 200);
+});

src/packages/__VUE/textarea/__tests__/textarea.spec.ts

@@ -1,9 +1,9 @@
 import { mount } from '@vue/test-utils';
 
-import Textarea from '../index.vue';
+import TextArea from '../index.vue';
 
 test('Textarea base', () => {
-  //const wrapper = mount(Textarea);
+  //const wrapper = mount(TextArea, { props: { modelValue: 3 } });
   // const input = wrapper.find('input');
   // expect(input.exists()).toBe(true);
   // expect(input.element.value).toBe("3");