Merge pull request #175 from RaoHai/passthroughOnKeyDown

passThrough `onKeyDown` of Custom Input
react-component · Apr 2, 2017 · 5e1686c · 5e1686c
2 parents 712d960 + b14b045
commit 5e1686c
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/src/Select.jsx b/src/Select.jsx
@@ -28,6 +28,16 @@ function saveRef(name, component) {
   this[name] = component;
 }
 
+function chaining(...fns) {
+  return function (...args) {
+    for (let i = 0; i < fns.length; i++) {
+      if (fns[i] && typeof fns[i] === 'function') {
+        fns[i].apply(this, args);
+      }
+    }
+  };
+}
+
 const Select = React.createClass({
   propTypes: SelectPropTypes,
 
@@ -470,7 +480,7 @@ const Select = React.createClass({
       {React.cloneElement(inputElement, {
         ref: this.saveInputRef,
         onChange: this.onInputChange,
-        onKeyDown: this.onInputKeyDown,
+        onKeyDown: chaining(this.onInputKeyDown, inputElement.props.onKeyDown),
         value: this.state.inputValue,
         disabled: props.disabled,
         className: inputCls,

diff --git a/tests/Select.spec.js b/tests/Select.spec.js
@@ -427,19 +427,22 @@ describe('Select', () => {
   });
 
   it('combox could comstomize input element', () => {
+    const handleKeyDown = jest.fn();
     const wrapper = mount(
-      <Select combobox getInputElement={() => <textarea />}>
+      <Select combobox getInputElement={() => <textarea onKeyDown={handleKeyDown} />}>
         <Option value="1">1</Option>
         <Option value="2">2</Option>
       </Select>
     );
 
     expect(wrapper.find('textarea').length).toBe(1);
     wrapper.find('.rc-select').simulate('click');
+    wrapper.find('.rc-select').find('textarea').simulate('keyDown', { keyCode: KeyCode.NUM_ONE });
     const dropdownWrapper = mount(wrapper.find('Trigger').node.getComponent());
 
     dropdownWrapper.find('MenuItem').first().simulate('click');
     expect(wrapper.state().inputValue).toBe('1');
+    expect(handleKeyDown).toBeCalled();
   });
 
   describe('propTypes', () => {