diff --git a/src/components/DateInput.js b/src/components/DateInput.js
index 7be298ff6..82b925c2f 100644
--- a/src/components/DateInput.js
+++ b/src/components/DateInput.js
@@ -220,6 +220,10 @@ export default class DateInput extends React.Component {
}
}
+ focus() {
+ this.inputEl.focus();
+ }
+
render() {
const { className, dateVisible, disabled, footer, header, showOnFocus } = this.props;
const { open } = this.state;
diff --git a/src/components/Select.js b/src/components/Select.js
index f2d618234..b5c02ada3 100644
--- a/src/components/Select.js
+++ b/src/components/Select.js
@@ -41,6 +41,12 @@ class Select extends React.Component {
this.props.onChange(value);
}
+ bindInput = el => this.selectEl = el;
+
+ focus() {
+ this.selectEl.focus();
+ }
+
render() {
const { value, ...props } = this.props;
delete props.onChange; // don't pass onChange prop to react-select
@@ -54,6 +60,7 @@ class Select extends React.Component {
inputProps={{ ...props.inputProps, name: props.name || '' }}
onChange={this.onChange}
value={value || this.state.value}
+ ref={this.bindInput}
{...props}
/>
);
diff --git a/test/components/DateInput.spec.js b/test/components/DateInput.spec.js
index 168bd446d..7d4fee9b0 100644
--- a/test/components/DateInput.spec.js
+++ b/test/components/DateInput.spec.js
@@ -284,4 +284,12 @@ describe('', () => {
mount();
assert(callback.calledWith('1-2-3', 'MM-DD-YY'));
});
+
+ it('should support focus', () => {
+ const wrapper = mount();
+ const component = wrapper.instance();
+ sinon.spy(component.inputEl, 'focus');
+ component.focus();
+ assert.equal(component.inputEl.focus.calledOnce, true);
+ });
});
diff --git a/test/components/Select.spec.js b/test/components/Select.spec.js
index 658e894b3..e696a1fa8 100644
--- a/test/components/Select.spec.js
+++ b/test/components/Select.spec.js
@@ -1,6 +1,6 @@
import React from 'react';
import assert from 'assert';
-import { shallow } from 'enzyme';
+import { shallow, mount } from 'enzyme';
import sinon from 'sinon';
import ReactSelect from 'react-select-plus';
@@ -79,4 +79,12 @@ describe('', () => {
const component = shallow();
assert.equal(component.type(), ReactSelect.Async);
});
+
+ it('should support focus', () => {
+ const wrapper = mount();
+ const component = wrapper.instance();
+ sinon.spy(component.selectEl, 'focus');
+ component.focus();
+ assert.equal(component.selectEl.focus.calledOnce, true);
+ });
});