From 3ad573d4bac30d540c4191df74b9b5dff7b4e76d Mon Sep 17 00:00:00 2001
From: xuwensheng <xws@superid.cn>
Date: Wed, 23 Aug 2017 14:57:14 +0800
Subject: [PATCH] Fix Checkbox Group disabled status (#7266)

---
 components/checkbox/Checkbox.tsx              |  2 +-
 .../__tests__/__snapshots__/demo.test.js.snap |  3 +-
 .../checkbox/__tests__/checkbox.test.js       | 23 ++++++++
 components/checkbox/__tests__/group.test.js   | 54 +++++++++++++++++++
 components/checkbox/__tests__/index.test.js   | 38 -------------
 5 files changed, 80 insertions(+), 40 deletions(-)
 create mode 100644 components/checkbox/__tests__/checkbox.test.js
 create mode 100644 components/checkbox/__tests__/group.test.js
 delete mode 100644 components/checkbox/__tests__/index.test.js

diff --git a/components/checkbox/Checkbox.tsx b/components/checkbox/Checkbox.tsx
index a047e112fa64..e0d4ea892b2f 100644
--- a/components/checkbox/Checkbox.tsx
+++ b/components/checkbox/Checkbox.tsx
@@ -58,7 +58,7 @@ export default class Checkbox extends React.Component<CheckboxProps, any> {
     if (checkboxGroup) {
       checkboxProps.onChange = () => checkboxGroup.toggleOption({ label: children, value: props.value });
       checkboxProps.checked = checkboxGroup.value.indexOf(props.value) !== -1;
-      checkboxProps.disabled = 'disabled' in props ? props.disabled : checkboxGroup.disabled;
+      checkboxProps.disabled = props.disabled || checkboxGroup.disabled;
     }
     const classString = classNames(className, {
       [`${prefixCls}-wrapper`]: true,
diff --git a/components/checkbox/__tests__/__snapshots__/demo.test.js.snap b/components/checkbox/__tests__/__snapshots__/demo.test.js.snap
index 26708893acca..fc61e0855cff 100644
--- a/components/checkbox/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/checkbox/__tests__/__snapshots__/demo.test.js.snap
@@ -363,10 +363,11 @@ exports[`renders ./components/checkbox/demo/group.md correctly 1`] = `
       class="ant-checkbox-group-item ant-checkbox-wrapper"
     >
       <span
-        class="ant-checkbox"
+        class="ant-checkbox ant-checkbox-disabled"
       >
         <input
           class="ant-checkbox-input"
+          disabled=""
           type="checkbox"
         />
         <span
diff --git a/components/checkbox/__tests__/checkbox.test.js b/components/checkbox/__tests__/checkbox.test.js
new file mode 100644
index 000000000000..46bfcbbec443
--- /dev/null
+++ b/components/checkbox/__tests__/checkbox.test.js
@@ -0,0 +1,23 @@
+import React from 'react';
+import { shallow } from 'enzyme';
+import Checkbox from '..';
+
+describe('Checkbox', () => {
+  it('responses hover events', () => {
+    const onMouseEnter = jest.fn();
+    const onMouseLeave = jest.fn();
+
+    const wrapper = shallow(
+      <Checkbox
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+      />
+    );
+
+    wrapper.simulate('mouseenter');
+    expect(onMouseEnter).toHaveBeenCalled();
+
+    wrapper.simulate('mouseleave');
+    expect(onMouseLeave).toHaveBeenCalled();
+  });
+});
diff --git a/components/checkbox/__tests__/group.test.js b/components/checkbox/__tests__/group.test.js
new file mode 100644
index 000000000000..323bddb1c923
--- /dev/null
+++ b/components/checkbox/__tests__/group.test.js
@@ -0,0 +1,54 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import Checkbox from '../index';
+
+describe('CheckboxGroup', () => {
+  it('should work basically', () => {
+    const onChange = jest.fn();
+    const wrapper = mount(
+      <Checkbox.Group options={['Apple', 'Pear', 'Orange']} onChange={onChange} />
+    );
+    wrapper.find('.ant-checkbox-input').at(0).simulate('change');
+    expect(onChange).toBeCalledWith(['Apple']);
+    wrapper.find('.ant-checkbox-input').at(1).simulate('change');
+    expect(onChange).toBeCalledWith(['Apple', 'Pear']);
+    wrapper.find('.ant-checkbox-input').at(2).simulate('change');
+    expect(onChange).toBeCalledWith(['Apple', 'Pear', 'Orange']);
+    wrapper.find('.ant-checkbox-input').at(1).simulate('change');
+    expect(onChange).toBeCalledWith(['Apple', 'Orange']);
+  });
+
+  it('does not trigger onChange callback of both Checkbox and CheckboxGroup when CheckboxGroup is disabled', () => {
+    const onChangeGroup = jest.fn();
+
+    const options = [
+      { label: 'Apple', value: 'Apple' },
+      { label: 'Pear', value: 'Pear' },
+    ];
+
+    const groupWrapper = mount(
+      <Checkbox.Group options={options} onChange={onChangeGroup} disabled />
+    );
+    groupWrapper.find('.ant-checkbox-input').at(0).simulate('change');
+    expect(onChangeGroup).not.toBeCalled();
+    groupWrapper.find('.ant-checkbox-input').at(1).simulate('change');
+    expect(onChangeGroup).not.toBeCalled();
+  });
+
+  it('does not prevent onChange callback from Checkbox when CheckboxGroup is not disabled', () => {
+    const onChangeGroup = jest.fn();
+
+    const options = [
+      { label: 'Apple', value: 'Apple' },
+      { label: 'Orange', value: 'Orange', disabled: true },
+    ];
+
+    const groupWrapper = mount(
+      <Checkbox.Group options={options} onChange={onChangeGroup} />
+    );
+    groupWrapper.find('.ant-checkbox-input').at(0).simulate('change');
+    expect(onChangeGroup).toBeCalledWith(['Apple']);
+    groupWrapper.find('.ant-checkbox-input').at(1).simulate('change');
+    expect(onChangeGroup).toBeCalledWith(['Apple']);
+  });
+});
diff --git a/components/checkbox/__tests__/index.test.js b/components/checkbox/__tests__/index.test.js
deleted file mode 100644
index 55c89394e19e..000000000000
--- a/components/checkbox/__tests__/index.test.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from 'react';
-import { shallow, mount } from 'enzyme';
-import Checkbox from '..';
-
-describe('Checkbox', () => {
-  it('responses hover events', () => {
-    const onMouseEnter = jest.fn();
-    const onMouseLeave = jest.fn();
-
-    const wrapper = shallow(
-      <Checkbox
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-      />
-    );
-
-    wrapper.simulate('mouseenter');
-    expect(onMouseEnter).toHaveBeenCalled();
-
-    wrapper.simulate('mouseleave');
-    expect(onMouseLeave).toHaveBeenCalled();
-  });
-
-  it('CheckGroup should work', () => {
-    const onChange = jest.fn();
-    const wrapper = mount(
-      <Checkbox.Group options={['Apple', 'Pear', 'Orange']} onChange={onChange} />
-    );
-    wrapper.find('.ant-checkbox-input').at(0).simulate('change');
-    expect(onChange).toBeCalledWith(['Apple']);
-    wrapper.find('.ant-checkbox-input').at(1).simulate('change');
-    expect(onChange).toBeCalledWith(['Apple', 'Pear']);
-    wrapper.find('.ant-checkbox-input').at(2).simulate('change');
-    expect(onChange).toBeCalledWith(['Apple', 'Pear', 'Orange']);
-    wrapper.find('.ant-checkbox-input').at(1).simulate('change');
-    expect(onChange).toBeCalledWith(['Apple', 'Orange']);
-  });
-});