feat: image新增单元测试

src/packages/__VUE/image/__tests__/__snapshots__/image.spec.ts.snap

@@ -0,0 +1,29 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`image load error 1`] = `
+"<view class=\\"nut-image\\" style=\\"width: 100px; height: 100px;\\"><img class=\\"nut-img\\" src=\\"https://x\\" alt=\\"\\" style=\\"object-fit: fill; object-position: center;\\">
+  <!--v-if-->
+  <view class=\\"nut-img-error\\"><i class=\\"nutui-iconfont nut-icon nut-icon-image-error\\" src=\\"\\"></i></view>
+</view>"
+`;
+
+exports[`image loading 1`] = `
+"<view class=\\"nut-image\\" style=\\"width: 100px; height: 100px;\\"><img class=\\"nut-img\\" src=\\"\\" alt=\\"\\" style=\\"object-fit: fill; object-position: center;\\">
+  <view class=\\"nut-img-loading\\"><i class=\\"nutui-iconfont nut-icon nut-icon-image\\" src=\\"\\"></i></view>
+  <!--v-if-->
+</view>"
+`;
+
+exports[`image render 1`] = `
+"<view class=\\"nut-image\\" style=\\"width: 100px; height: 100px;\\"><img class=\\"nut-img\\" src=\\"//img10.360buyimg.com/ling/jfs/t1/181258/24/10385/53029/60d04978Ef21f2d42/92baeb21f907cd24.jpg\\" alt=\\"\\" style=\\"object-fit: fill; object-position: center;\\">
+  <!--v-if-->
+  <!--v-if-->
+</view>"
+`;
+
+exports[`image render Round 1`] = `
+"<view class=\\"nut-image nut-image-round\\" style=\\"width: 100px; height: 100px;\\"><img class=\\"nut-img\\" src=\\"//img10.360buyimg.com/ling/jfs/t1/181258/24/10385/53029/60d04978Ef21f2d42/92baeb21f907cd24.jpg\\" alt=\\"\\" style=\\"object-fit: fill; object-position: center;\\">
+  <!--v-if-->
+  <!--v-if-->
+</view>"
+`;

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

@@ -1 +1,69 @@
-import { mount } from '@vue/test-utils';
+import { config, mount } from '@vue/test-utils';
+import { h, nextTick } from 'vue';
+import Image from '../index.vue';
+import NutIcon from '../../icon/index.vue';
+
+beforeAll(() => {
+  config.global.components = {
+    NutIcon
+  };
+});
+
+afterAll(() => {
+  config.global.components = {};
+});
+
+test('image render', async () => {
+  const wrapper = mount(Image, {
+    props: {
+      src: '//img10.360buyimg.com/ling/jfs/t1/181258/24/10385/53029/60d04978Ef21f2d42/92baeb21f907cd24.jpg',
+      width: '100',
+      height: '100',
+      showLoading: false
+    }
+  });
+  await wrapper.find('img').trigger('load');
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('image load error', async () => {
+  const wrapper = mount(Image, {
+    props: {
+      src: 'https://x',
+      width: '100',
+      height: '100',
+      showError: true
+    }
+  });
+  await wrapper.find('img').trigger('error');
+  expect(wrapper.find('.nut-img-error').exists()).toBeTruthy();
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('image loading', async () => {
+  const wrapper = mount(Image, {
+    props: {
+      src: '',
+      width: '100',
+      height: '100',
+      showLoading: true
+    }
+  });
+  // await wrapper.find('img').trigger('load');
+  expect(wrapper.find('.nut-img-loading').exists()).toBeTruthy();
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('image render Round', async () => {
+  const wrapper = mount(Image, {
+    props: {
+      src: '//img10.360buyimg.com/ling/jfs/t1/181258/24/10385/53029/60d04978Ef21f2d42/92baeb21f907cd24.jpg',
+      width: '100',
+      height: '100',
+      round: true
+    }
+  });
+  await wrapper.find('img').trigger('load');
+  expect(wrapper.find('.nut-image-round').exists()).toBeTruthy();
+  expect(wrapper.html()).toMatchSnapshot();
+});

src/packages/__VUE/image/doc.md

@@ -111,7 +111,7 @@ app.use();
 
 ```html
 <template>
-  <nut-image src="https://x" width="100" height="100" showLoading>
+  <nut-image src="https://x" width="100" height="100" showError>
     <template #error> 加载失败 </template>
   </nut-image>
 </template>