Browse Source

feat: checkbox;radio

zongyue3 4 years ago
parent
commit
9039d55903

+ 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/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();
+});