click close do not trigger Trigger (#110)

react-component · Apr 28, 2018 · d9b55e1 · d9b55e1
1 parent 3ce1332
commit d9b55e1
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 2 deletions.
diff --git a/src/Select.jsx b/src/Select.jsx
@@ -651,11 +651,17 @@ class Select extends Component {
     }
   }
 
-  removeSelected(selectedVal) {
+  removeSelected(selectedVal, e) {
     const props = this.props;
     if (props.disabled) {
       return;
     }
+
+    // Do not trigger Trigger popup
+    if (e && e.stopPropagation) {
+      e.stopPropagation();
+    }
+
     this._cacheTreeNodesStates = 'no';
     if (props.treeCheckable &&
       (props.showCheckedStrategy === SHOW_ALL || props.showCheckedStrategy === SHOW_PARENT)
@@ -692,6 +698,7 @@ class Select extends Component {
         });
       }
     }
+
     this.fireChange(value, { triggerValue: selectedVal, clear: true });
   }
 
@@ -842,7 +849,9 @@ class Select extends Component {
         >
           <span
             className={`${prefixCls}-selection__choice__remove`}
-            onClick={this.removeSelected.bind(this, singleValue.value)}
+            onClick={(event) => {
+              this.removeSelected(singleValue.value, event);
+            }}
           />
           <span className={`${prefixCls}-selection__choice__content`}>{content}</span>
         </li>

diff --git a/tests/Select.multiple.spec.js b/tests/Select.multiple.spec.js
@@ -138,4 +138,15 @@ describe('TreeSelect.multiple', () => {
     select(wrapper, 0);  // unselect
     expect(wrapper.find('input').getDOMNode().value).toBe('');
   });
+
+  it('do not open tree when close button click', () => {
+    const wrapper = mount(createSelect());
+    wrapper.find('.rc-tree-select-selection').simulate('click');
+    select(wrapper, 0);
+    select(wrapper, 1);
+    wrapper.setState({ open: false });
+    wrapper.find('.rc-tree-select-selection__choice__remove').at(0).simulate('click');
+    expect(wrapper.state('open')).toBe(false);
+    expect(wrapper.state('value')).toEqual([{ label: 'label1', value: '1' }]);
+  });
 });