Browse Source

Merge pull request #483 from Mindyzone/next

feat: checkbox;radio
love_forever 4 years ago
parent
commit
4801cb060f

+ 1 - 0
src/packages/__VUE/cell/__tests__/cell.spec.ts

@@ -1,5 +1,6 @@
 import { mount } from '@vue/test-utils';
 import Cell from '../index.vue';
+import Icon from '../../icon/index.vue';
 
 test('prop title desc', () => {
   const wrapper = mount(Cell, {

+ 25 - 0
src/packages/__VUE/checkbox/__tests__/__snapshots__/checkbox.spec.ts.snap

@@ -0,0 +1,25 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`prop disabled 1`] = `
+"<view class=\\"nut-checkbox \\"><i class=\\"nutui-iconfont nut-icon nut-icon-checked\\" style=\\"color: rgb(245, 245, 245); font-size: 18px; width: 18px; height: 18px;\\" src=\\"\\"></i>
+  <view class=\\"nut-checkbox__label nut-checkbox__label--disabled\\"></view>
+</view>"
+`;
+
+exports[`prop iconName iconActiveName 1`] = `
+"<view class=\\"nut-checkbox \\"><i class=\\"nutui-iconfont nut-icon nut-icon-check-normal\\" style=\\"color: rgb(214, 214, 214); font-size: 18px; width: 18px; height: 18px;\\" src=\\"\\"></i>
+  <view class=\\"nut-checkbox__label \\"></view>
+</view>"
+`;
+
+exports[`prop iconSize 1`] = `
+"<view class=\\"nut-checkbox \\"><i class=\\"nutui-iconfont nut-icon nut-icon-checked\\" style=\\"color: rgb(250, 44, 25); font-size: 20px; width: 20px; height: 20px;\\" src=\\"\\"></i>
+  <view class=\\"nut-checkbox__label \\"></view>
+</view>"
+`;
+
+exports[`prop label 1`] = `
+"<view class=\\"nut-checkbox \\"><i class=\\"nutui-iconfont nut-icon nut-icon-check-normal\\" style=\\"color: rgb(214, 214, 214); font-size: 18px; width: 18px; height: 18px;\\" src=\\"\\"></i>
+  <view class=\\"nut-checkbox__label \\"></view>
+</view>"
+`;

+ 49 - 0
src/packages/__VUE/checkbox/__tests__/checkbox.spec.ts

@@ -0,0 +1,49 @@
+import { mount } from '@vue/test-utils';
+import Checkbox from '../index.vue';
+
+test('prop label', () => {
+  const wrapper = mount(Checkbox, {
+    props: {
+      label: '复选框checkbox'
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});
+test('prop disabled', () => {
+  const wrapper = mount(Checkbox, {
+    props: {
+      modelValue: true,
+      disabled: true
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});
+test('prop iconSize', () => {
+  const wrapper = mount(Checkbox, {
+    props: {
+      modelValue: true,
+      iconSize: '20'
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});
+test('prop iconName iconActiveName', () => {
+  const wrapper = mount(Checkbox, {
+    props: {
+      iconName: 'check-normal',
+      iconActiveName: 'checked'
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+test('should emit "update:modelValue" event when checkbox is clicked', async () => {
+  const wrapper = mount(Checkbox);
+
+  wrapper.trigger('click');
+  expect(wrapper.emitted('update:modelValue')![0]).toEqual([true]);
+
+  await wrapper.setProps({ modelValue: true });
+  wrapper.trigger('click');
+  expect(wrapper.emitted('update:modelValue')![1]).toEqual([false]);
+});

+ 3 - 0
src/packages/__VUE/checkboxgroup/__tests__/__snapshots__/checkboxgroup.spec.ts.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`prop label 1`] = `"<view class=\\"nut-checkboxgroup\\"></view>"`;

+ 43 - 0
src/packages/__VUE/checkboxgroup/__tests__/checkboxgroup.spec.ts

@@ -0,0 +1,43 @@
+import { mount } from '@vue/test-utils';
+import Checkboxgroup from '../index.vue';
+import Checkbox from '../../checkbox/index.vue';
+import { h } from '@vue/runtime-core';
+
+test('prop label', () => {
+  const wrapper = mount(Checkboxgroup, {
+    props: {
+      disabled: true
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});
+
+// test('should emit "update:modelValue" event when checkbox is clicked', async () => {
+//   const wrapper = mount(Checkboxgroup, {
+//     slots: {
+//       default: () => {
+//         return h(
+//           'nut-checkbox',
+//           {
+//             modelValue: 'false',
+//             label: '1'
+//           }
+//         )
+//       }
+//     }
+//   });
+
+//   expect(wrapper.html()).toContain('abc');
+
+// const items = wrapper.findAll('.nut-checkbox');
+// console.log('blabla', wrapper)
+
+// await items[0].trigger('click');
+// expect(wrapper.vm).toContain('ballll')
+
+// await items[1].trigger('click');
+// expect(wrapper.vm.value).toEqual(['1', '2']);
+
+// await items[0].trigger('click');
+// expect(wrapper.vm.value).toEqual(['2']);
+// });

+ 3 - 0
src/packages/__VUE/radiogroup/__tests__/__snapshots__/radiogroup.spec.ts.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`prop modelValue 1`] = `"<view class=\\"nut-radiogroup\\"></view>"`;

+ 11 - 0
src/packages/__VUE/radiogroup/__tests__/radiogroup.spec.ts

@@ -0,0 +1,11 @@
+import { mount } from '@vue/test-utils';
+import Radiogroup from '../index.vue';
+
+test('prop modelValue', () => {
+  const wrapper = mount(Radiogroup, {
+    props: {
+      modelValue: '1'
+    }
+  });
+  expect(wrapper.html()).toMatchSnapshot();
+});