[Improvement] Checkbox: add test cases (#1201)

packages/checkbox/index.vue

@@ -6,7 +6,7 @@
         b('icon'),
         `van-checkbox--${shape}`, {
           'van-checkbox--disabled': isDisabled,
-          'van-checkbox--checked': isChecked
+          'van-checkbox--checked': checked
       }]"
       @click="onClick"
     />
@@ -40,7 +40,7 @@ export default create({
   },
 
   computed: {
-    currentValue: {
+    checked: {
       get() {
         return this.parent
           ? this.parent.value.indexOf(this.name) !== -1
@@ -74,15 +74,6 @@ export default create({
       }
     },
 
-    isChecked() {
-      const { currentValue } = this;
-      if ({}.toString.call(currentValue) === '[object Boolean]') {
-        return currentValue;
-      } else if (this.isDef(currentValue)) {
-        return currentValue === this.name;
-      }
-    },
-
     isDisabled() {
       return (this.parent && this.parent.disabled) || this.disabled;
     }
@@ -101,7 +92,7 @@ export default create({
   methods: {
     onClick(target) {
       if (!this.isDisabled && !(target === 'label' && this.labelDisabled)) {
-        this.currentValue = !this.currentValue;
+        this.checked = !this.checked;
       }
     }
   }

packages/checkbox/test/index.spec.js

@@ -0,0 +1,72 @@
+import Checkbox from '..';
+import CheckboxGroup from '../../checkbox-group';
+import { mount } from '@vue/test-utils';
+
+test('switch checkbox', () => {
+  const wrapper = mount(Checkbox);
+
+  wrapper.vm.$on('input', value => {
+    wrapper.setData({ value });
+  });
+
+  const icon = wrapper.find('.van-checkbox__icon');
+  icon.trigger('click');
+  icon.trigger('click');
+
+  expect(wrapper.emitted('input')).toEqual([[true], [false]]);
+  expect(wrapper.emitted('change')).toEqual([[true], [false]]);
+});
+
+test('disabled', () => {
+  const wrapper = mount(Checkbox, {
+    propsData: {
+      disabled: true
+    }
+  });
+
+  wrapper.find('.van-checkbox__icon').trigger('click');
+  expect(wrapper.emitted('input')).toBeFalsy();
+});
+
+test('label disabled', () => {
+  const wrapper = mount(Checkbox, {
+    slots: {
+      default: '<div />'
+    },
+    propsData: {
+      labelDisabled: true
+    }
+  });
+
+  wrapper.find('.van-checkbox__label').trigger('click');
+  expect(wrapper.emitted('input')).toBeFalsy();
+});
+
+test('checkbox group', () => {
+  const wrapper = mount({
+    template: `
+      <checkbox-group v-model="result" :max="2">
+        <checkbox v-for="item in list" :key="item" :name="item" :disabled="item === 'd'"></checkbox>
+      </checkbox-group>
+    `,
+    components: {
+      Checkbox,
+      CheckboxGroup
+    },
+    data() {
+      return {
+        result: [],
+        list: ['a', 'b', 'c', 'd']
+      };
+    }
+  });
+
+  const icons = wrapper.findAll('.van-checkbox__icon');
+  icons.at(0).trigger('click');
+  icons.at(1).trigger('click');
+  icons.at(2).trigger('click');
+  expect(wrapper.vm.result).toEqual(['a', 'b']);
+
+  icons.at(0).trigger('click');
+  expect(wrapper.vm.result).toEqual(['b']);
+});