ソースを参照

test(toast,uploader): add test (#1146)

Drjingfubo 3 年 前
コミット
53c4212165

+ 13 - 0
src/packages/__VUE/toast/test/function.spec.ts

@@ -34,4 +34,17 @@ describe('function toast', () => {
     let failToast = document.querySelector('.nut-icon-failure') as HTMLElement;
     expect(failToast.style.fontSize).toEqual('20px');
   });
+  test('show warn toast', async () => {
+    ToastFunction.warn('文案');
+    await sleep();
+    let failToast = document.querySelector('.nut-icon-failure') as HTMLElement;
+    expect(failToast.style.fontSize).toEqual('20px');
+  });
+  test('show fail toast', async () => {
+    ToastFunction.fail('文案');
+    await sleep();
+    let failToast = document.querySelector('.nut-icon-tips') as HTMLElement;
+    expect(failToast.style.fontSize).toEqual('20px');
+    ToastFunction.hide();
+  });
 });

+ 8 - 0
src/packages/__VUE/uploader/__tests__/__snapshots__/index.spec.ts.snap

@@ -0,0 +1,8 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`render preview image 1`] = `
+"<view class=\\"nut-uploader\\" modelvalue=\\"[object Object],[object Object],[object Object]\\">
+  <!--v-if-->
+  <view class=\\"nut-uploader__upload picture\\"><i class=\\"nutui-iconfont nut-icon nut-icon-photograph\\" style=\\"color: rgb(128, 128, 128);\\" src=\\"\\"></i><input class=\\"nut-uploader__input\\" type=\\"file\\" accept=\\"*\\" name=\\"file\\"></view>
+</view>"
+`;

+ 122 - 0
src/packages/__VUE/uploader/__tests__/index.spec.ts

@@ -4,6 +4,11 @@ import { nextTick, ref } from 'vue';
 import NutIcon from '../../icon/index.vue';
 import NutProgress from '../../progress/index.vue';
 
+function sleep(delay = 0): Promise<void> {
+  return new Promise((resolve) => {
+    setTimeout(resolve, delay);
+  });
+}
 beforeAll(() => {
   config.global.components = {
     NutIcon,
@@ -14,6 +19,9 @@ beforeAll(() => {
 afterAll(() => {
   config.global.components = {};
 });
+const mockFile = new File([new ArrayBuffer(10000)], 'test.jpg', {
+  type: 'test'
+});
 
 test('should render base uploader and type', async () => {
   const wrapper = mount(Uploader);
@@ -144,3 +152,117 @@ test('should render base uploader props disabled', async () => {
   let up_load1 = wrapper.find('.nut-uploader__input');
   expect(up_load1.attributes().disabled).toBe('');
 });
+
+test('render preview image', async () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      modelValue: [
+        { url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' },
+        { url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif' },
+        { file: mockFile }
+      ]
+    }
+  });
+
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('before-delete prop return false', () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      fileList: [
+        {
+          name: '文件1.png',
+          url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+          status: 'success',
+          message: '上传成功',
+          type: 'image'
+        }
+      ],
+      isDeletable: true,
+      beforeDelete: () => false
+    }
+  });
+  wrapper.find('.nut-icon-failure').trigger('click');
+  expect(wrapper.emitted('delete')).toBeFalsy();
+});
+test('before-delete prop return true', () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      fileList: [
+        {
+          name: '文件1.png',
+          url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+          status: 'success',
+          message: '上传成功',
+          type: 'image'
+        }
+      ],
+      isDeletable: true,
+      beforeDelete: () => true
+    }
+  });
+  wrapper.find('.nut-icon-failure').trigger('click');
+  expect(wrapper.emitted('delete')).toBeTruthy();
+});
+
+test('before-delete prop resolved', async () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      fileList: [
+        {
+          name: '文件1.png',
+          url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+          status: 'success',
+          message: '上传成功',
+          type: 'image'
+        }
+      ],
+      isDeletable: true,
+      beforeDelete: () => true
+    }
+  });
+
+  wrapper.find('.nut-icon-failure').trigger('click');
+  await sleep();
+  expect(wrapper.emitted('delete')).toBeTruthy();
+});
+
+test('before-delete prop rejected', async () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      fileList: [
+        {
+          name: '文件1.png',
+          url: 'https://m.360buyimg.com/babel/jfs/t1/164410/22/25162/93384/616eac6cE6c711350/0cac53c1b82e1b05.gif',
+          status: 'success',
+          message: '上传成功',
+          type: 'image'
+        }
+      ],
+      isDeletable: true,
+      beforeDelete: () => false
+    }
+  });
+
+  wrapper.find('.nut-icon-failure').trigger('click');
+  await sleep();
+  expect(wrapper.emitted('delete')).toBeFalsy();
+});
+
+test('multiFile upload filter max-size file', async () => {
+  const wrapper = mount(Uploader, {
+    props: {
+      maxSize: 1000
+    }
+  });
+
+  const smallFile = new File([new ArrayBuffer(100)], 'small.jpg');
+  const input = wrapper.find<HTMLInputElement>('.nut-uploader__input');
+  Object.defineProperty(input.element, 'files', {
+    get: jest.fn().mockReturnValue([mockFile, smallFile])
+  });
+  input.trigger('change');
+  await sleep();
+  // expect(wrapper.emitted<[File]>('oversize')![0]).toBeTruthy();
+});

+ 1 - 1
src/packages/__VUE/uploader/index.vue

@@ -317,7 +317,7 @@ export default create({
           index
         });
       } else {
-        console.log('用户阻止了删除!');
+        // console.log('用户阻止了删除!');
       }
     };