Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
23 commits
Select commit Hold shift + click to select a range
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Fix + tests for disabled control
onKeyDown was checking the state, not props, for disabled
This didn't affect the normal operation, as the control
was not focusable when disabled, but could have potentially
caused issues in certain browsers
  • Loading branch information
bruderstein committed Jul 27, 2015
commit 43e24f8262671c8b756d49a7d6d2c644b5c2ce7f
2 changes: 1 addition & 1 deletion src/Select.js
Original file line number Diff line number Diff line change
Expand Up @@ -381,7 +381,7 @@ var Select = React.createClass({
},

handleKeyDown: function(event) {
if (this.state.disabled) return;
if (this.props.disabled) return;

switch (event.keyCode) {

Expand Down
49 changes: 47 additions & 2 deletions test/Select-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -826,8 +826,12 @@ describe('Select', function() {
);

// Focus on the input, such that mouse events are accepted
searchInputNode = React.findDOMNode(instance.getInputNode()).querySelector('input');
TestUtils.Simulate.focus(searchInputNode);
var searchInstance = React.findDOMNode(instance.getInputNode());
searchInputNode = null;
if (searchInstance) {
searchInputNode = searchInstance.querySelector('input');
TestUtils.Simulate.focus(searchInputNode);
}
return instance;

};
Expand Down Expand Up @@ -1098,5 +1102,46 @@ describe('Select', function() {
});
});
});

describe('disabled=true', function () {

beforeEach(function () {

instance = createControl({
options: defaultOptions,
value: 'three',
disabled: true,
searchable: true
});
});

it('does not render an input search control', function () {

expect(searchInputNode, 'to be null');
});

it('does not react to keyDown', function () {

TestUtils.Simulate.keyDown(getSelectControl(instance), { keyCode: 40, key: 'ArrowDown' });
expect(React.findDOMNode(instance).querySelectorAll('.Select-option'), 'to have length', 0);
});

it('does not respond to mouseDown', function () {

TestUtils.Simulate.mouseDown(getSelectControl(instance));
expect(React.findDOMNode(instance).querySelectorAll('.Select-option'), 'to have length', 0);
});

it('does not respond to mouseDown on the arrow', function () {

TestUtils.Simulate.mouseDown(getSelectControl(instance).querySelector('.Select-arrow'));
expect(React.findDOMNode(instance).querySelectorAll('.Select-option'), 'to have length', 0);
});

it('renders the given value', function () {

expect(React.findDOMNode(instance).querySelector(DISPLAYED_SELECTION_SELECTOR), 'to have text', 'Three');
});
});
});
});